Embedding Video in K2 Item

Hi,

I'm trying to embed a YouTube video in a K2 item and get it to display a specific way. I was able to create the item, associate it with the K2 category which is associated with the Joomla Menu Item currently set as Home.

The problem can be seen easily here.

I would like for the video to display exactly like the photo in article below it; after the title and before the "Read More" button.

if someone could point me in the right direction i would be grateful.

Following layout is your video article.

Code: Select all

<article class="itemView">
     <header>
     <div class="itemBody">
     <div class="itemLinks">
     <div class="itemVideoBlock">
</article>


Following layout is your photo article.

Code: Select all

<article class="itemView">
     <header>
     <div class="itemImageBlock">
     <div class="itemBody">
     <div class="itemLinks">
</article>


Depending on how you implemented this either plugin or editing view files. You just need to move "itemVideoBlock" to under "header" element. If this was a plugin you need to edit K2 view files and move plugin call to under header element. If this is a custom edited then simply move the container where itemVideoBlock is and move it under header element.

Alternatively you can send me your edited file or plugin and I ll take a look.

See you around...

normanUK,

I see what you're referring to within the html when using FireBug, but I'm at a loss as to where it can be adjusted.

You mentioned that I should "edit K2 view files and move plugin call to under header element." Would I find this option under Extensions, possibly Plug-in manager or module manager?

Also, if this were to be custom edited where would I make the edit? Should I be looking in K2.css because its a K2 container?

thank you for your time.

@normanUK

I think I've found the file I need to edit. html/com_k2/templates/default/latest_item.php and item.php.

Would it be easier to "move the plugin call," or to play around with the php file?

Both appear to be out of my realm of understanding, and I'm still trying to find where I can change the plugin call.

thanks

I ll take a look at this when I have time either today or on monday.

By the way tell me how you setup your video so I can create the same in my server to make sure everything is working once I modify files.
Example: Download this plugin from this website etc...

See you around...

After modifying latest_item.php the video is good.

It can be seen here.

My only problem now is the container the video is in. It does not resize when viewing on different resolutions displays (i believe the term is responsive layout).

thanks for your help. i'll post the details of my installation this weekend.

Please add following css code to your css/override.css and check with your browser ( resize window ) and with mobile devices. If adding to override.css does not work in mobile devices then also add the same code to mobile.css and tablet.css

Code: Select all

.itemVideoBlock {
    padding-bottom: 56.6%!important;
    padding-top: 30px!important;
    position: relative!important;
    height: 0!important;
    overflow: hidden!important;
}
.itemVideoBlock iframe, .itemVideoBlock object, .itemVideoBlock embed {
    position: absolute!important;
    top: 0!important;
    left: 0!important;
    width: 100%!important;
    height: 100%!important;
}


See you around...

Search terms: K2 Responsive Video .

thank you a thousand times.

case closed; solution above.

No problem at all, see you around...