Can an Article display a video instead of an image?

Hello,

I would like to initially express my gratitude to the developers and their support.

My question is as follows:

When creating an article, we have the option of having an image to be shown on the home screen and on the article itself, with that nice mouse over effect that is provided.
My question is could we possibly have a video "either local or web-link(youtube, vimeo, etc..)" where it would be also possible to click play while viewing the Home page where all the articles are? And of course even when inside the article itself.

Many thanks in advance.

Best Regards,

Hi

I would need to Your site first, but if You are using K2 than after installing All Video player You will be able to add media from couple of sources. Unfortunately none of module which cam in quiskstar is not able to display video. Try using category view insted.

Hi,

Please check your PM

Thanks

Hi

Ok. An explenation in PM was good. Unfortunately You will need a different module for that. NSP has no such functionality. To change order in K2 article You need to edit /html/com_k2/templates/default/item.php and copy the code for video somewhere on top.

Thanks for your reply, but this would require to edit every time the php code to implement the video on all articles which in this case would be quite troublesome due to the fact that the articles will be altered almost every 2-3 days.
You mention for a different module, could you please point out a module which has this capability in which is compatible with this current template layout in which I could then insert the article in each module box.

Thanks in advance,

Hi again,

Additionally, in the Template Options, there is a social API which shows that Pinterest is ON, but I do not see any pinterest button.
Please help.

Hi

No no. In K2 You ca specifie a video code, so when I wrote I meant the php code which is processing the code for video. This code looks like this:

Code: Select all

         <?php if($params->get('itemVideo') && !empty($this->item->video)): ?>
         <div class="itemVideoBlock" id="itemVideoAnchor">
                  <h3><?php echo JText::_('K2_MEDIA'); ?></h3>
                  <?php if($this->item->videoType=='embedded'): ?>
                  <div class="itemVideoEmbedded">
                           <?php echo $this->item->video; ?>
                  </div>
                  <?php else: ?>
                  <span class="itemVideo"><?php echo $this->item->video; ?></span>
                  <?php endif; ?>
                  <?php if($params->get('itemVideoCaption') && !empty($this->item->video_caption)): ?>
                  <span class="itemVideoCaption"><?php echo $this->item->video_caption; ?></span>
                  <?php endif; ?>
                  <?php if($params->get('itemVideoCredits') && !empty($this->item->video_credits)): ?>
                  <span class="itemVideoCredits"><?php echo $this->item->video_credits; ?></span>
                  <?php endif; ?>
         </div>
         <?php endif; ?>


Hello,

So you mean that I were to install a Custom HTML/PHP Module and implement the above code within the Module and then display it on the page.
It would keep the current theme layout correct?
Do you recommend any good custom html module?

Br,

Hi

No. You do not need a custom html module. This code is already in K2 article layout. The only thing I'm advicing is to move it near the top of the article, because it's being displayed under the content by default. Please use a text editor and edit file which You will find in /html/com_k2/templates/defaut/item.php. Than cut/paste the code I've mentioned to be used right under the article title or even above. So when someone will watch this article video will be the first to be displayed.

Hello Teitbite,

Now I understood, so in other words I move the Media content under the article title code.
Is the Media option in the K2 articles responsive?

Thanks again.!

Hi

I do not think it's responsive, but when You will make this change try using an iframe way to embed videos and show me such article than. I'll tell You what code to use to make it respond to device screen.

Hello Teitbite,

I am looking at the item.php and cannot pinpoint the code you are mentioning.
Attached is my item.php

item.rar

Please help

Many thanks

Additionally I performed the following to enable the video in the media section to be responsive.

I added to the override.css the following:

Code: Select all

.videoWrapper {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  padding-top: 25px;
  height: 0;
}
.videoWrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

And then while in the K2 Item in the Media Tab I use Embed and put the following with iframe:

Code: Select all

<div class="videoWrapper">
    <iframe width="580" height="360" src="http://player.vimeo.com/video/24535619" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowfullscreen></iframe>
</div>

This makes the video in the media section totally responsive.

Br,

Hi

Code to load video is:

Code: Select all

  <?php if($this->item->params->get('itemVideo') && !empty($this->item->video)): ?>
  <!-- Item video -->
  <a name="itemVideoAnchor" id="itemVideoAnchor"></a>

  <div class="itemVideoBlock">
     <h3><?php echo JText::_('K2_MEDIA'); ?></h3>

      <?php if($this->item->videoType=='embedded'): ?>
      <div class="itemVideoEmbedded">
         <?php echo $this->item->video; ?>
      </div>
      <?php else: ?>
      <span class="itemVideo"><?php echo $this->item->video; ?></span>
      <?php endif; ?>

     <?php if($this->item->params->get('itemVideoCaption') && !empty($this->item->video_caption)): ?>
     <span class="itemVideoCaption"><?php echo $this->item->video_caption; ?></span>
     <?php endif; ?>

     <?php if($this->item->params->get('itemVideoCredits') && !empty($this->item->video_credits)): ?>
     <span class="itemVideoCredits"><?php echo $this->item->video_credits; ?></span>
     <?php endif; ?>

     <div class="clr"></div>
  </div>
  <?php endif; ?>



it's picking up an emped code from K2 items, so please do not use embed code inside php files.