Hi, I looked through queue and FAQ, thinking I had seen this question asked in the past; however, I couldn't find it so my apologies in advance if the answer to this is already listed elsewhere.

Is there a way to include both image and video slides in a single DD block? Perhaps one or two video nodes and 4 image nodes (for example)?

Thanks in advance!

Comments

ppblaauw’s picture

Status: Active » Postponed (maintainer needs more info)

Yes, it is possible to use images and video in the ddblock module, see examples: http://themes.myalbums.biz/content/embedded-content-example

Hope this helps you further, please let me know.

bstrange’s picture

Can I just follow the Advanced slideshow Embeded Video (http://ddblock.myalbums.biz/node/859) tutorial to achieve the results you linked, or would additional modifications be required?

bstrange’s picture

bump.

I know I posted this a while ago, but I am finally comfortable enough with DD Block to try embedding a couple video nodes.

Is there a mixed content tutorial or do I just follow the embedded video tutorial?

Thanks, and sorry to necro an old issue (though it wasn't closed) but I thought that was better than creating a 2nd post about the same thing.

Thanks in advance!

ppblaauw’s picture

No, there is no dedicated tutorial for this
You would need to make different if statements for the fields.

Your content type has e.g. a field for an image and a video

Example for preprocess function

If video field has a value
add video field for the theme
elseif image field has a value
add image field for the theme

In the normal preprocess function you can find how to add an image field.
In the preprocess function of the tutorial for embedded videos you can find how to add an embedded video field.

Hope this helps you further, please let me know.

bstrange’s picture

StatusFileSize
new10.91 KB

I am not having much luck making this work. The page is http://www.villacollectionsdesign.com/content/dd-block-vid-test

The drupal_set_message is

'news_items2'stdClass::__set_state(array(
   'nid' => '334',
   'node_title' => 'Villa Collections Home & Design',
   'node_data_field_pager_item_text_field_pager_item_text_value' => 'Villa Collections',
   'node_type' => 'ddblock_news_item2',
   'node_vid' => '333',
   'node_data_field_slide_text_field_slide_text_value' => 'Villa Collections Home & Design.',
   'node_data_field_image_field_image_fid' => NULL,
   'node_data_field_image_field_image_list' => NULL,
   'node_data_field_image_field_image_data' => NULL,
   'node_data_field_embedded_video_url_field_embedded_video_url_embed' => 'http://www.youtube.com/watch?v=ZDiq9H4jfRw',
   'node_data_field_embedded_video_url_field_embedded_video_url_value' => 'ZDiq9H4jfRw',
   'node_data_field_embedded_video_url_field_embedded_video_url_provider' => 'youtube',
   'node_data_field_embedded_video_url_field_embedded_video_url_data' => <<SNIPPED 50 LINES + of youtube url data to save your eyes>>

   'node_revisions_format' => '3',
   'node_sticky' => '1',
   'node_promote' => '1',
   '_random' => '0.412562159274297',
))

I attached my template.php... I am not sure I am doing the elseif statement correctly (my guess is I am not)

The associate nodes (made 2) are http://www.villacollectionsdesign.com/content/luxury-master-bathroom-1 and http://www.villacollectionsdesign.com/content/villa-collections-home-design (they seem to work just fine in their own nodes and in the view preview)

Any help you could give would be greatly appreciated!
Thanks in advance :)

bstrange’s picture

StatusFileSize
new11.93 KB

Ok, I cleaned up the template.php.

When I replicated the if ($vars['settings']['view_name'] == 'news_items') { section to allow code for a second content type (news_items2), I mistakenly coppied

$vars['slider_items'] = $slider_items;
  }
}  

as part of the news_items code. This caused the entire

function VillaTaupe2_preprocess_ddblock_cycle_block_content(&$vars) {
  if ($vars['output_type'] == 'view_fields') {

to close after the initial news_items, so everything I added for the second content type was disregarded, and/or threw 'unexpected } on line xxx' errors.

So in that regard, my template.php code is cleaned up now; however I am still not seeing images, pager, etc in the second content type. Is the second content type to be set up with an elseif statement as well as the second content type's additional fields?
I.e. elseif ($vars['settings']['view_name'] == 'news_items2') {

Attaching somewhat fixed template.php, please disregard the jumble of code that was my first attempt attached above :P

ppblaauw’s picture

Your preprocess function in the template.php fiel looks ok.
In your setup, you will need to use the object code of the embedded video from youtube instead of the URL

Hope this helps you further, please let me know.

bstrange’s picture

Thanks for the reply, and hope you had a good weekend!

Actually there were a couple }'s out of place in the last template.php, but I got them reconfigured and now http://www.villacollectionsdesign.com/content/dd-block-vid-test actually shows the image file and the slider text when you refresh it enough to get the image.

Now, here it gets a little confusing, when I uncomment only

function VillaTaupe2_preprocess_ddblock_cycle_pager_content(&$vars) {
  if (($vars['output_type'] == 'view_fields') && ($vars['pager_settings']['pager'] == 'custom-pager')){
    $content = array();
    // Add pager_items for the template 
    // If you use the devel module uncomment the following lines to see the theme variables
    // dsm($vars['pager_settings']['view_name']);     
    // dsm($vars['content'][0]);     
    // If you don't use the devel module uncomment the following lines to see the theme variables
     drupal_set_message('<pre>' . var_export($vars['pager_settings'], true) . '</pre>');
     drupal_set_message('<pre>' . var_export($vars['content'][0], true) . '</pre>');
    if ($vars['pager_settings']['view_name'] == 'news_items') {

when I look at the original on the homepage, it shows cycle pager preprocess debugging, but NOT on the new one... If I can figure out a way to see the debugging, I think I'll be in good shape.

2 questions:

1. Does the second content type go in as an elseif? or a simple if i.e.

if ($vars['pager_settings']['view_name'] == 'news_items2') {
or
elseif ($vars['pager_settings']['view_name'] == 'news_items2') {

2. Where do I get the object code for the embedded video?

I didn't see it anywhere in the debugging

'news_items2'stdClass::__set_state(array(
   'nid' => '334',
   'node_title' => 'Villa Collections Home & Design',
   'node_data_field_pager_item_text_field_pager_item_text_value' => 'Villa Collections',
   'node_type' => 'ddblock_news_item2',
   'node_vid' => '333',
   'node_data_field_slide_text_field_slide_text_value' => 'Villa Collections Home & Design.',
   'node_data_field_image_field_image_fid' => NULL,
   'node_data_field_image_field_image_list' => NULL,
   'node_data_field_image_field_image_data' => NULL,
   'node_data_field_embedded_video_url_field_embedded_video_url_embed' => 'http://www.youtube.com/watch?v=ZDiq9H4jfRw',
   'node_data_field_embedded_video_url_field_embedded_video_url_value' => 'ZDiq9H4jfRw',
   'node_data_field_embedded_video_url_field_embedded_video_url_provider' => 'youtube',
   'node_data_field_embedded_video_url_field_embedded_video_url_data' => <<SNIPPED 50 LINES + of youtube url data to save your eyes>>

Thanks in advance! :)

ppblaauw’s picture

1.) if you want to combine content from both content types you need to use if instead of elseif

2.) in the node where you add the video from youtube, don't use the URL to the video, but use the whole object code. The object code of a video on youtube can be found when you have a look add the embed code on youtube itself. You need to copy the embed code and use it instead of the URL in the node to embed the video

3.) That you don't see the debug lines for the second content type is caused by the elseif.
you can also place the debug lines inside the if statements for each content type.
That way you have more control, for which content type to show the debug line.

the debug line to place inside the if statement for the different content types
drupal_set_message('

' . var_export($vars['settings']['view_name'], true) . '

');
drupal_set_message('

' . var_export($vars['content'][0], true) . '

');

delete these lines above the if statements for the content types

Hope this helps you further, please let me know.

bstrange’s picture

I put it in like below, but it threw an error, where exactly does the debug code go inside the if statement? Sorry to be so needy :(

function VillaTaupe2_preprocess_ddblock_cycle_block_content(&$vars) {
  if ($vars['output_type'] == 'view_fields') {
    $content = array();
    // Add slider_items for the template 
    // If you use the devel module uncomment the following line to see the theme variables
    // dsm($vars['settings']['view_name']);  
    // dsm($vars['content'][0]);
    // If you don't use the devel module uncomment the following line to see the theme variables
    
    if ($vars['settings']['view_name'] == 'news_items') {
      if (!empty($vars['content'])) {
        foreach ($vars['content'] as $key1 => $result) {
          // add slide_image variable 
          // drupal_set_message('' . var_export($vars['settings']['view_name'], true) . '');
          // drupal_set_message('' . var_export($vars['content'][0], true) . '');    
              $pager_items[$key1]['image'] = 
                '<img src="' . base_path() . $filepath . 
                '" alt="' . check_plain($result->node_data_field_image_field_image_fid) . 
                '"/>';     
            }          
          }
          // add pager_item _text variable
          if (isset($result->node_data_field_pager_item_text_field_pager_item_text_value)) {
            $pager_items[$key1]['text'] =  check_plain($result->node_data_field_pager_item_text_field_pager_item_text_value);
          }
        }
      }
    }
    
  if ($vars['pager_settings']['view_name'] == 'news_items2') {
      if (!empty($vars['content'])) {
        foreach ($vars['content'] as $key1 => $result) {
          // add pager_item_image variable
          drupal_set_message('' . var_export($vars['settings']['view_name'], true) . '');
          drupal_set_message('' . var_export($vars['content'][0], true) . ''); 
            if (isset($result->node_data_field_image_field_image_fid)) {
            $fid = $result->node_data_field_image_field_image_fid;
            $filepath = db_result(db_query("SELECT filepath FROM {files} WHERE fid = %d", $fid));
            $pager_items[$key1]['image'] = 
                '<img src="' . base_path() . $filepath . 
                '" alt="' . check_plain($result->node_data_field_image_field_image_fid) . 
                '"/>';     
            }
          // add youtube video thumbnail
          elseif (isset($result->node_data_field_embedded_video_url_field_embedded_video_url_embed)) {
          $data=unserialize($result->node_data_field_embedded_video_url_field_embedded_video_url_embed);
          if (isset($data['thumbnail']['url'])) {
            $pager_items[$key1]['image'] = '<img src="' .$data['thumbnail']['url'] . 
                '" alt="' . $result->node_data_field_custom_pager_text_field_custom_pager_text_value . 
                '"/>';
          }
        }
         // add pager_item _text variable
          if (isset($result->node_data_field_pager_item_text_field_pager_item_text_value)) {
            $pager_items[$key1]['text'] =  check_plain($result->node_data_field_pager_item_text_field_pager_item_text_value);
          }
         }
        }
      }
    
    $vars['pager_items'] = $pager_items;
  }   
}

Thanks again for all your help!

ppblaauw’s picture

StatusFileSize
new9.71 KB

Made the edits in the template.php part of the template.php file in post #6

Hope this helps you further, please let me know

bstrange’s picture

StatusFileSize
new12.23 KB

Thanks so much, I actually fell asleep in my chair working on this and didn't see this till this morning.

I have the code cleaned up and changes made to corespond to what I am seeing in debug; however, the video isn't in the block container, it is just floating, actually, in two places.

I believe one of the floating videos should be an image on the pager, but I'm not entirely sure on that.

The pager is working now for both image and video nodes.

I have left the debug code uncommented and you can see the results at the node below:

http://www.villacollectionsdesign.com/content/dd-block-vid-test

I have gone back and forth between and tried every combination of if/elseif statements for the following lines and there appears to be no difference no matter which is chosen

elseif ($vars['settings']['view_name'] == 'news_items2') {
elseif (isset($result->node_data_field_embedded_video_url_field_embedded_video_url_embed)) {
elseif ($vars['pager_settings']['view_name'] == 'news_items2') {
elseif (isset($result->node_data_field_embedded_video_url_field_embedded_video_url_embed)) {

Currently, they are all set to 'elseif', but I have tried:
-all 'if' statements
-'if' view name statements and 'elseif' result statements
-'elseif' view name statements and 'if' result statements

Even though it appears to have no effect, I'd like to make sure the preprocess is properly written, I 'think' from your replies previously, that the view name statements should be 'if' and the results statements should be 'elseif'.

I am attaching my most current template.php, everything is perfect in the original DD Block on homepage so I have commented the debug lines out and news_items is all good.

As stated earlier, everything is correct except for the video being out of the container so I left the debug uncommented as the node is in a 'out of the way' location and most likely won't be stumbled upon.

Thanks again for all your help in this! :)

bstrange’s picture

StatusFileSize
new12.28 KB

I have managed to get the image somewhat near the container, though it overhangs a bit and looks generally bad, and doesn't maintain the video format as seen on it's node page: http://www.villacollectionsdesign.com/content/villa-collections-home-design

I also found that the second 'floating' video is actually part of the debug code and goes away when the debug is commented out so that isn't an issue.

I suspect the error is in the following section, but I can't find it:

// add youtube video thumbnail
          elseif(isset($result->node_data_field_embedded_video_url_field_embedded_video_url_embed)) {
            $slider_items[$key1]['slide_image'] = $result->node_data_field_embedded_video_url_field_embedded_video_url_embed;
            }
            //print '<pre>';
            //print_r($data);
            //print '</pre>';
            if (isset($data['thumbnail']['url'])) {
              $slider_items[$key1]['slide_image'] = '<img src="' .$data['thumbnail']['url'] . 
                '" alt="' . $result->node_data_field_pager_item_text_field_pager_item_text_value . 
                '"/>';
            }

I have attached the latest template.php and of course the block page and debug code can still be seen at http://www.villacollectionsdesign.com/content/dd-block-vid-test

Thanks again!

bstrange’s picture

I am sure something is stil incorrect in my code, but I was able to at least simulat the functionality by setting the views format to Video Preview (instead of Full Video) and then changed the embeded media field's 'Video Preview Settings' to 480 width by 305 height. I also changed the object code <object width="482" height="307"><param name="movie" value="http://www.youtube.com/v/ZDiq9H4jfRw&hl=en_US&fs=1&"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/ZDiq9H4jfRw&hl=en_US&fs=1&" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="482" height="307"></embed></object> to match the dimensions.

Originally I had changed the dimensions to the exact slide-inner dimensions, but unfortunately it still looked slightly off so i had to make it slightly larger.

The problem is the container does not respect the formating for the video (i.e. no round corners, no border, etc) and I was pretty sure the video should resize itself to fit the slide inner container, regardless of the size listed in the object code.

Currently this is just a messy cobbled solution, but it got me something at least.

Is it possible that the code for the slide-inner img (pasted bleow) needs to be changed as it is a video and not an image?
div.ddblock-cycle-gradient-taupe50p div.slide-inner img{height:303px;margin:0!important;padding:0!important;width:478px;border-color:#604E3A;border-style:solid;border-width:2px 2px 6px;} from within ddblock-cycle-gradient-taupe50p.css? I know you don't give CSS customizations help, but it seems to me that this would be an issue with any type of content template whether customized or standard if that line has to be adjusted to accomidate video.

Of course that could be just a red herring as it may need to use 'slide-inner img' regardless of content type or media type... I really have no clue. I think I will disect a couple of the standard templates and see if they are written differently to accomidate videos instead of images.

Thanks!

ppblaauw’s picture

you can give the object a width and a height by adding:

div.ddblock-cycle-gradient-taupe50p div.slide-inner object {height:303px;width:478px;) to the stylesheet.

Maybe you need to add a padding and margin of 0 same as with the video.

I don't see a video in your slideshow, maybe you have the content permissions module enabled and did not give permissions for anonymous users to view the embedded media field.

Hope this helps you further, please let me know.

bstrange’s picture

Sorry about that, I had not given view permissions to anon viewers (makes helping me kind of tough). I did try it in the upright 50 default template to rule out stylesheet errors in my custom, and what is really obvious is that it applies the video OVER everything else (slide text, rounded corner graphics, etc), so I *think* that, based off the line of code you have given above, I need to create a line in any template I use that is similar to:

div.ddblock-cycle-gradient-taupe50p div.slide-inner object{height:303px;margin:0!important;padding:0!important;width:478px;border-color:#604E3A;border-style:solid;border-width:2px 2px 6px;}

That way the formating is applied to the object. This explains why images looked correct but video did not. Once that is done, it should respect DD Blocks object settings and not try to overlay the original full size video.

A quick question, would I put that line of code (above) into the ddblock-cycle-gradient-taupe50p.css stylesheet (or default upright 10-50) directly under the current

div.ddblock-cycle-gradient-taupe50p div.slide-inner img{height:303px;margin:0!important;padding:0!important;width:478px;border-color:#604E3A;border-style:solid;border-width:2px 2px 6px;}

line of code?

Thanks! :)

P.S. you should be able to see the video now.

ppblaauw’s picture

It does not matter where it is placed in the stylesheet. CSS rules will determine which rule is supplied to an element.

I see the video now.

bstrange’s picture

thanks for all the help. I added the line to the theme stylesheet and altered the height, width, etc in everywhere I could think of and no matter what I did, the video 'floats' to the top overlapping or obscuring any borders etc. I will keep playing with it and post what I find to hopefully help some others. Thanks again for all your help!