How to make advanced slideshow with embedded video from 3rd party sites.

Important notes:

  • This tutorial page assumes that you already have enough knowledge and information on how to create Advanced dynamic display block slideshow for Drupal 6.
  • This page assumes you want to make a slideshow like the Embedded content slideshow example working in our themes site.
  • Make sure that you have already installed the required modules for the Advanced dynamic display block slideshow and have a ddblock advanced slideshow working.
  • For more detailed instructions on how to install and enable the required modules, see
  • Links refer to the existing tutorial on this site.

Installation additional emfield module

  1. Download the Embedded Media Field module at http://drupal.org/project/emfield
  2. Extract and copy these modules into the /sites/all/modules/ folder.

Enable Embedded Media Field

Path to enable Embedded Media Field:

  1. Go to Admin > Site building > Modules.
  2. Enable Embedded Media field and Embedded video field.
  3. Click Save configuration button.


Create content type
There are two ways you can create the content type for the slideshow with embedded videos.

  • Import the predefined content type.
  • Create the content type manually.

Import Ddblock embedded video content type

  1. From the Download page, Download ddblock_embedded_video.zip, and extract the contents.
  2. Open dblock_embedded_video_content_type_export.txt and copy the content.
  3. Go to Administer > Content Management > Content Types > Import.
  4. Paste the copied file content into the "Import data" field.
  5. Leave the Content type field to: <create>.
  6. Click Import, and this will create the ddblock_embedded_video content type.

Important: You need to have CCK, imageapi, filefield and imagefield installed and enabled on your Drupal installation, otherwise the import will not be successful.

Alternatively, you can use the manual content type creation instructions that follow.

Detailed instruction on how to add a Ddblock embedded video content type manually

Path to create content:

  1. Go to Admin > Content management > Content types.

Create content type Ddblock embedded video

  1. Click Add content type button.
  2. Fill in the following text field.
    • Name - Ddblock embedded video
    • Type - ddblock_embedded_video
    • Description - Ddblock embedded video for the advanced dynamic display block slideshow.
  3. Click Save content type button at the buttom of the page.

Manage fields

Path to manage fields:

  1. Go to Admin > Content management > Content types.

Configure Manage fields

  1. Find Ddblock embedded video in your list of content types.
  2. Click manage field link.

Add field Custom pager text field

  1. Add Custom pager text field.
  2. Fill in the following:
    • Label - Custom pager text field
    • Field name - custom_pager_text
    • Type of data to store - Select Text
    • Form element to edit the data - Select Textfield
  3. Click Save button

Configure Custom pager text field

  1. Fill in the following:
    • Size of textfield - e.g (set to 30)
    • Help text - (optional) Used for the text of a custom pager.
    • Check Required checkbox
    • Leave the other default settings
  2. Click Save fields settings

Add Slider text field

  1. Fill in the following:
    • Label - Slider text field
    • Field name - slider_text
    • Type of data to store - Select Text
    • Form element to edit the data - Select Text area(multiple rows)
  2. Click Save button

Configure Slider text field

  1. Fill in the following:
    • Rows - e.g (set to 5)
    • Help text - (optional) Used for the text on a slider.
    • Check Required checkbox
    • Leave the other default settings
  2. Click Save fields settings

Note: Before adding a field for the embedded video, you need to configure embedded media field first.

Path to Embedded Media Field:

  1. Go to Admin > Content management > Embedded Media Field Configuration

Configure Embedded Media Field

  1. Find Embedded Video Field at the buttom of the page.
  2. Click Embedded Video Field.
  3. Click Providers fieldset.
  4. Select the type of providers you want to embed video and configure the provider settings.
  5. Click Save configuration button.

Add Embedded video url field

  1. Go to Admin > Content types > Ddblock embedded video.
  2. Click manage field link.
  3. Fill in the following:
    • Label - Embedded video url
    • Field name - embedded_video_url
    • Type of data to store - Select Embedded Video
    • Form element to edit the data - Select 3rd Party Video
  4. Click Save button

Configure Embedded video url field

  1. Under Providers Supported fieldset, check e.g (Youtube) checkbox.
  2. Leave other default settings.
  3. Click Save fields settings.

Arrange fields

  1. Drag and drop the fields into their orders:
    • Title
    • Custom pager text
    • Slider text
    • Embedded video url
    • Body
  2. Click Save button

Display fields

  1. Click Display fields button at the right of Manage fields button.
  2. Set the following:
    1. Custom pager text
      • Label -- Hidden
      • Teaser -- Default
      • Exclude -- Uncheck
      • Full node -- Hidden
    2. Slider text
      • Label -- Hidden
      • Teaser -- Default
      • Exclude -- Uncheck
      • Full node -- Hidden
    3. Embedded video url
      • Label -- Hidden
      • Teaser -- Image thumbnail
      • Exclude -- Uncheck
      • Full node -- Full Size Video
  3. Click Save button.

Create a node to provide content for the slideshow

Note: You have to create more than one node to make the slideshow work (e. g 6 nodes).

Path to create a node Ddblock embedded video:

  1. Go to Admin > Create content > Ddblock Embedded video

Create a node for ddblock embedded video

  1. Fill in the following fields:
    • Title - Used for the title of a slide and the title of the full node view.
    • Custom pager text - Used for the text of a custom pager item.
    • Slider text - Used for the text on a slider/slide.
    • Embedded video url: - the embedded video code from the provider like youtube.
    • Note: You need to change the embed code weight and height the same width and height for the slider image. This depends the height and the width of the image from the css of the upright free themes.

    • Body - Used for the text of the full node view.
  2. Click Save button.


Create a view
There are two ways you can create the view for the slideshow with embedded videos.

  • Import the predefined view.
  • Create the view manually.

Import ddblock_embedded_video view

  1. From the Download page , Download ddblock_embedded_video_export.zip, and extract the contents.
  2. Open dblock_embedded_video_views_export.txt and copy the content.
  3. Go to Administer > Site Building > Views > Import.
  4. Paste the copied file content into the "Past View Code here" field.
  5. Leave the View Name blank.
  6. Click Import, and this will create the ddblock_embedded_video view.
  7. Click Save to save the view.

Alternatively, you can use the manual view creation instructions that follow.

Detailed instruction on how to Create ddblock_embedded_video views block manually

Path to add Ddblock embedded video view page:

  1. Navigate to Administer > Site building > Views.
  2. Click the Add tab button at the top of the page.

Create Ddblock embedded video views block:

  1. Fill in the form fields.
    • View name - ddblock_embedded_video
    • View description - Embedded video used for a Dynamic display block slideshow.
    • View tag - embedded video
    • View type - choose Node
  2. Click Next button.

Have a look at this overview of the Views setting page to give you idea of how the screenshots looks like.

Configure ddblock_embedded_video

Add block views

  1. Select Block as display type in the select box at the left side of the page.
  2. Click Add display button.

Views Basic setting

  1. Click Name: Block link in the Basic settings fieldset.
  2. Fill in ddblock embedded video .
  3. Click Item to display - e.g (6) here you can set the number of slide from the node ddblock embedded video to cycle.
  4. Click Update button.

Views Block settings

  1. Click Admin:Block link in the Block settings fieldset.
  2. Fill in ddblock embedded video .
  3. Click Update button.

Views Fields

  1. Click the + sign button next to Fields setting.
  2. Select Node in the Groups select box.
  3. Select the following:
    • Node: Title
    • Node: Body (optional, only if you add text for your body when you create a node for the ddblock embedded video).
  4. Click Update button.
  5. Leave the default settings for configuring the Node: Title and Node: Body.
  6. Click Update default display button.
  7. Click the + sign button.
  8. Select Content in the Groups select box.
  9. Select the following:
    • Content: Custom pager text (field_custom_pager_text)
    • Content: Slider text (field_slider_text)
    • Content: Embedded video url (field_embedded_video_url)
  10. Click Add button.
  11. Fill in the Defaults: Configure field content: Custom pager text (field_custom_pager_text)settings.
    • Label: -- in the checkboxes choose Widget label (Pager item text)
    • Format: -- select Plain text
    • Leave the other default settings
  12. Click Update button.
  13. Fill in the Defaults: Configure field Content: Slider text (field_slider_text) settings.
    • Label: -- in the checkboxes choose Widget label (Slide text)
    • Format : -- select Plain text
    • Leave the other default settings
  14. Click Update button.
  15. Fill in the Defaults: Configure field Content: Embedded video url (field_embedded_video_url) setting.
    • Label: -- in the checkboxes choose Widget label (Embedded video url)
    • Format: -- select Full Size Video
    • Leave the other default settings
  16. Click Update button.

Note: Click Save button for now to save the settings you have made.

Arrange fields

  1. Click the arrow sign button in the Fields setting next to + sign button.
  2. Drag and drop the fields into their orders:
    • Node: Title
    • Content: Custom pager text (field_custom_pager_text)
    • Content: Slider text (field_slider_text)
    • Content: Embedded video url (field_embedded_video_url)
    • Node: Body Body
  3. Click Update button.

Views Sort criteria

  1. Click plus sign button next to Sort Criteria fieldset.
  2. Select Node under Group select box option.
  3. Choose Node: Post date.
  4. Click Add button.
  5. Leave the Default: Configure sort criterion Node: Post date settings.
  6. Click Update button.

Views Filter

  1. Click + sign button next to Filters.
  2. Select Node under Group.
  3. Choose the following:
    • Node: Published
    • Node: Type
  4. Click Add button.
  5. Under Default: Configure filter Node: Published check Published/check Published checkbox to Yes.
  6. Click Update button.
  7. Set the following under Default: Configure filter Node: Type.
    • Operator - Is one of
    • Node type - check Ddblock embedded video
  8. Click Update button.

Note: Click Save button to be ready for the block instance of the ddblock_embedded_video for advanced Dynamic display block slideshow.

Create and configure instance

Before you create a dynamic display block instance you have to enable the Ddblock embedded video content type and the ddblock_embedded_video view for the Dynamic display block module. You do this on the settings page of the Dynamic display block module.

Path to dynamic display block settings page:

  1. Navigate to Administer > Site configuration > Dynamic display block.
  2. Click Settings tab.
  3. Enable Ddblock embedded video content type and Ddblock embedded video view

    1. Select the checkbox next to: Ddblock embedded video under Content types.
    2. Select the checkbox next to: views - ddblock embedded video.
    3. Click Save configuration button


    Create Dynamic display block instance of the Ddblock embedded video view

    Path to dynamic display block instance page:

    1. Navigate to Administer > Site configuration > Dynamic display block.
    2. Click Instance tab.

    Create instance

    1. Type a unique instance title e.g (Embedded content slideshow example) in the Instance title textfield.
    2. Select views - ddblock embedded video in the Block type select box field.
    3. Click Add Instance button.

    Configure the block - Embedded content slideshow example

    Path to Dynamic display block configuration page:

    1. Navigate to Administer > Site configuration > Dynamic display block in the admin menu.
    2. Find Embedded content slideshow example in the list of your block instance.
    3. Click Configure block link.

    Follow the detailed instruction on how to Create and configure instance page, only starts from Note: There are two options to configure a block instance.


    Install Dynamic display block themes
    Follow the detailed instruction of the
    Dynamic display block theme page.


    Add Preprocess functions

    Follow the detailed instruction of the Preprocess functions page.

    Note:

    1. Download the preprocess function and export file for the ddblock embedded video slideshow at the Download page.
    2. The preprocess function at template.php.txt file is already in the package of the ddblock_embedded_video_export.zip file.

    Important: If you already have an advanced slideshow working add an if statement in the preprocess function for the ddblock_embedded_video view in your template.php file.


    Display advanced Dynamic display block slideshow

    Follow the detailed instruction on how to display advanced Ddblock embedded video in the block region/page at the Dynamic display block slideshow page.

    Note: In the how to display Dynamic display block slideshow tutorial page, you need to read Embedded content slideshow example instead of ddblock-News item slideshow.