Monday , December 11 2017
Home >> All tutorial >> How to display video on Magento product page

How to display video on Magento product page

One picture is better than a thousand words. You will find this common truth in any textbook on marketing.

One video is better than a thousand pictures and even than a thousand words. Any SEO expert will tell you this.

One can find in the Internet many ready to use Magento extensions (both free and paid)  that allow to add a video to the product page.

Unfortunately, sometimes the extensions do not meet our requirements or design tasks.

In this post you will learn how to add a video to a Magento product page exactly where it should be according to the design or other requirements.

Let’s place a video onto Magento product page. With sharing videos made easy on Youtube, just copy the iframe code and paste it into the product description. That’s it. Video will be shown on the product page under the product description.

If this seems to be too easy, let’s make it differently. We will create “video” text input attribute. Add it to appropriate attribute set and don’t forget to reindex your data. Now you should find the place in the following file where you want the video to appear: app/design/frontend/yourpackage/yourtheme/template/catalog/product/view.phtml
In this example we will place it under the product name.

Find:

{code type=xml}

{/code}

Add below:
{code type=php}getVideo()): ?>

{/code}

All we have to do now in order to show the video is to paste video UID (unique identifier) into the video attribute field.

For example, UID of the http://www.youtube.com/watch?v=U0CGsw6h60k is U0CGsw6h60k

Thats it.

Need something different? Product video on your product page sidebar? No problem. We need to create video template and use product “XML Layout Update” in order to insert videos into sidebar columns.

Create: app/design/frontend/yourpackage/yourtheme/template/catalog/product/video.phtml

With:
{code type=xml}

{/code}
Now insert the following code into product XML Layout Update under Design tab on Edit Product page:
{code type=xml}

U0CGsw6h60k

{/code}
Note that we are using standard action method setLinkUrl, just like in callout blocks.
This post demonstrates how the action method could be easily used to serve our purposes.

We also contribute great content of Magento Download for FREE (all versions)

DON'T MISS THE CHANCE!

magento download

About Champ

Leave a Reply

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

Heap | Mobile and Web Analytics