Customize Consent Preferences

We use cookies to help you navigate efficiently and perform certain functions. You will find detailed information about all cookies under each consent category below.

The cookies that are categorized as "Necessary" are stored on your browser as they are essential for enabling the basic functionalities of the site. ... 

Always Active

Necessary cookies are required to enable the basic features of this site, such as providing secure log-in or adjusting your consent preferences. These cookies do not store any personally identifiable data.

No cookies to display.

Functional cookies help perform certain functionalities like sharing the content of the website on social media platforms, collecting feedback, and other third-party features.

No cookies to display.

Analytical cookies are used to understand how visitors interact with the website. These cookies help provide information on metrics such as the number of visitors, bounce rate, traffic source, etc.

No cookies to display.

Performance cookies are used to understand and analyze the key performance indexes of the website which helps in delivering a better user experience for the visitors.

No cookies to display.

Advertisement cookies are used to provide visitors with customized advertisements based on the pages you visited previously and to analyze the effectiveness of the ad campaigns.

No cookies to display.

Friday , March 14 2025
Breaking News

Display video instead of preview in K2 Joomla material

The task is to display a video from YouTube on the K2 material page instead of the uploaded image.

The output of the image on the site is like this:

<?php if($this->item->params->get('itemImage') && !empty($this->item->image)): ?>
		  <!-- Item Image -->
		  <div class="itemImageBlock">
			  <span class="itemImage">
			  	<a class="modal" rel="{handler: 'image'}" href="<?php echo $this->item->imageXLarge; ?>" title="<?php echo JText::_('K2_CLICK_TO_PREVIEW_IMAGE'); ?>">
			  		<img src="<?php echo $this->item->image; ?>" alt="<?php if(!empty($this->item->image_caption)) echo K2HelperUtilities::cleanHtml($this->item->image_caption); else echo K2HelperUtilities::cleanHtml($this->item->title); ?>" />
			  	</a>
			  </span>

			  <?php if($this->item->params->get('itemImageMainCaption') && !empty($this->item->image_caption)): ?>
			  <!-- Image caption -->
			  <span class="itemImageCaption"><?php echo $this->item->image_caption; ?></span>
			  <?php endif; ?>

			  <?php if($this->item->params->get('itemImageMainCredits') && !empty($this->item->image_credits)): ?>
			  <!-- Image credits -->
			  <span class="itemImageCredits"><?php echo $this->item->image_credits; ?></span>
			  <?php endif; ?>

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

In the admin panel, I created an additional field for K2, called it videolink. On the page, I displayed in this field a link to a video on youtube, in the format https://www.youtube.com/watch?here_id_video (important: the domain youtu.be/*** will give an error and you need to use the first option).

After testing different conditions, in the item.php output file around the code above, I added a condition with a replacement:

<?php if(isset($this->item->extraFields->videolink->value) === true  && empty($this->item->extraFields->videolink->value) === false): ?>
<div class="itemExtraFieldsValue">
<iframe width="350" height="197" src="<?php echo $this->item->extraFields->videolink->value; ?>" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class="clr"></div>

<?php else: ?>

/*here is the code with the output of the picture, I published it at the beginning of the post*/

<?php endif; ?>

If you need to display the video in the list of materials in the category, use this article: Display video instead of preview in K2 Joomla category.

About iryna

I'm Iryna, a web developer from Ukraine with a decade of experience solving complex technical challenges in the world of freelance. Throughout my career, I've worked on everything from troubleshooting server-side issues and optimizing website performance to enhancing user interfaces. On this blog, I share detailed solutions to the technical problems I’ve encountered and methods that have worked best for me. In addition to my technical expertise, I’m also passionate about digital drawing. I hope the tutorials and insights I provide here will help both fellow developers and creatives alike in their own projects.

Check Also

How to get a link in an email where the form is filled out via Chronoforms

This task is very simple, for normal CMS. For Joomla, I publish the solution in …

Leave a Reply

Your email address will not be published. Required fields are marked *