Magento Forum

   
Page 1 of 4
Adding new features - video and .pdf documents on the detailed product view page
 
norbolig
Guru
 
Total Posts:  328
Joined:  2008-03-15
 

For many products, in the selling process, it will be useful to offer the customer more information such as Product Videos and Written Documentation (like .PDF documents).

I am using the Modern Theme, and have these suggestions:

1) Setting a Default View in the Detailed Product View

Today, the user can chose between 4 tabs; the ‘Product Description’, ‘We Also Recommend’, ‘Product Tags’ and ‘Additional Information’.

Through the backend, I would like to decide the default tab view (if possible I would like to set that up for each product). For some products I know that the customer will be more interested in the ‘Additional Information’.

I also suggest that the tab ‘Product Tags’ should be the last one, as this probably is the least interesting tab (from a selling point). 

2) It should be easy to add several videos and .PDF documents for each product

Through the backend, I would like to have the possibility to add several videos and several .PDF documents to each product (such as User Manuals, Technical Specifications, etc.).

I suggest to implement a fifth tab on the product detail view, and name it the ‘Product support” tab or “Video / documentation” tab (the shop owner should be able to name the label).

Under the new tab, I would like to be able to list something like this:

Video:

Product Demonstration (3 Mb) (updated 14.03.2008)
Maintenance Video (1 Mb) (updated 27.12.2007)

Documents:

Owners Manual, English (1,2 Mb) (rev. 03-2008)
Owners Manual, Norwegian (1,3 Mb) (rev. 01-2007)
Parts Manual, English (723 Kb) (updated 12-2007)

It should be easy to upload the videos and the documents from the backend to the server.

Maybe this is already possible, but is overlooked by me?

 
Magento Community Magento Community
Magento Community
Magento Community
 
Moshe
Magento Team
 
Avatar
Total Posts:  1770
Joined:  2007-08-07
Los Angeles
 

This is definitely possible by:
a) creating a custom text attribute and put there custom HTML with links to your documents
b) creating custom attributes for each link type and having a template in your tab that will use file names in these attributes to create list of links and descriptions.

 
Magento Community Magento Community
Magento Community
Magento Community
 
norbolig
Guru
 
Total Posts:  328
Joined:  2008-03-15
 

Thanks for the fast reply and suggestions as to how these features can be implemented.

If this is asked for by other users as well, what I hope to see in a later version of Magnento, is a full implementation of this in the back end system. Then shop owner can then easily upload any videos and .PDF documents he would prefer.

 
Magento Community Magento Community
Magento Community
Magento Community
 
norbolig
Guru
 
Total Posts:  328
Joined:  2008-03-15
 

Some follow up Questions about my wish for implementing .PDF product documents and product videos at my web store as attachments per product):

I run on a hosted server.

1.  Where should I store my documents and videos

I have uploaded my .PDF Documents to this catalog:  /mydomain.com/public_html/media/catalog/product/adobe/productbrand1
I have uploaded my Flash Video Documents to this catalog:  /mydomain.com/public_html/media/catalog/product/video/productbrand1

The complete path is:

http://mydomain.com:2222/CMD_FILE_MANAGER/domains/mydomain.com/public_html/media/catalog/product/adobe/productbrand1
http://mydomain.com:2222/CMD_FILE_MANAGER/domains/mydomain.com/public_html/media/catalog/product/video/productbrand1
The permission for the folder is set to 775, and the permission for the file is set to 664.

I added this code to my detailed product page, to be able to download and open the document / video in a separete window:

<a href="http://mydomain.com:2222/CMD_FILE_MANAGER/domains/mydomain.com/public_html/media/catalog/product/adobe/productbrand1/Product1.pdf" target="_blank" title="Download Product1 User Manual" onMouseOver="window.status='Product1 User Manual'; return true" onMouseOut="window.status=' '"><b>User Manual</b></a> (528 Kb) .pdf Adobe Reader Document<br />

<
a href="http://mydomain.com:2222/CMD_FILE_MANAGER/domains/mydomain.com/public_html/media/catalog/product/video/productbrand1/Subtraction.flv" target="_blank" title="Product Video  |  Product1  |  More comments here" onMouseOver="window.status='Product Video  |  Product1  |  More comments here'; return true" onMouseOut="window.status=' '"><b>Product1 Advanced training</b></a>  (0,9 MbFlash Video format</div>
Unfortunately, this does not work. Instead the visitor are asked to log into my server admin panel ... !

What am I missing here?

This would be an easy and nice way to add .PDF documents and Videos to Magento.

2.  Cashe folder

I also noticed a cashe folder (with permission set to 777), that contains all the uploaded product images, in different sizes.
http://mydomain.com:2222/CMD_FILE_MANAGER/domains/mydomain.com/public_html/media/catalog/product/cache

What is the function of the cashe folder? (is this just holdning the recently used pictures?)

3.  Magento Speed with Downloadable Videos on the same server

Will the speed of my web shop be noticeably reduced if several documents / videos are downloaded by customers simultaniously. Is it better to host videos and documents on another server?

 
Magento Community Magento Community
Magento Community
Magento Community
 
tradiArt
Guru
 
Avatar
Total Posts:  379
Joined:  2008-04-28
Spain
 

Hello!

I’m looking exactly for the same feature. I need to attach pdf and video files to my products (instructions and labels).

Moshe, can you please elaborate a bit more your answer? At this moment I’m a but confused with your explanation, and I have the same question as norbolig. Where do we have to store all the attached files?

Thank you very much for this nice application. grin

 
Magento Community Magento Community
Magento Community
Magento Community
 
harry12bar
Sr. Member
 
Avatar
Total Posts:  168
Joined:  2008-01-07
 
Moshe - 29 April 2008 02:00 PM

This is definitely possible by:
a) creating a custom text attribute and put there custom HTML with links to your documents
b) creating custom attributes for each link type and having a template in your tab that will use file names in these attributes to create list of links and descriptions.

Yes this is correct… I have had mine up and running for a couple of weeks...I’ll bookmark this page and put link in when site is is launched..in around a week! Very pleased with the flexibility of attributes.
Cheers
Alex

 
Magento Community Magento Community
Magento Community
Magento Community
 
norbolig
Guru
 
Total Posts:  328
Joined:  2008-03-15
 

A Beginners Guide as to how to simly add .PDF documents and videos to your Magento detailed product page and CMS page:

HOW TO ADD .PDF DOCUMENTS

1) Where to upload the .PDF document

By default, all uploaded product images are stored in the /public_html/media/catalog/product/ folder. A logic place to store the pdf documents, would then be to create a pdf folder under the product folder. If you choose to add a folder for each product brand, the ‘any_pdf_document.pdf’ can be stored here:

http://mydomain.com:2222/CMD_FILE_MANAGER/domains/mydomain.com/public_html/media/catalog/product/pdf/productbrand_1/any_pdf_document.pdf

2) How to find the url to a uploaded .PDF document

If you want to link to the document from any web page, the url reference will then be: “http://www.mydomain.com/public_html/media/catalog/product/pdf/productbrand_1/any_pdf_document.pdf”

I prefer to sort the documents by product (brand), to make it more structured.

Please note that you can store your Documents in any folder in the public_html area, for example you might consider to make your own pdf and video folders direct under the public_html folder, like this:

http://mydomain.com:2222/CMD_FILE_MANAGER/domains/mydomain.com/public_html/pdf/
To link to the same pdf document, use this url: http://mydomain.com/public_html/pdf/

http://mydomain.com:2222/CMD_FILE_MANAGER/domains/mydomain.com/public_html/video/
And to link to the video, use this url: http://mydomain.com/public_html/video/

If you prefer to sort your documents and videos by product brand, it will look like this:

http://mydomain.com:2222/CMD_FILE_MANAGER/domains/mydomain.com/public_html/pdf/brand/
To link to the pdf document, use this url: http://mydomain.com/public_html/pdf/brand/
That will look like this in the url address bar: http://mydomain.com/pdf/brand/

http://mydomain.com:2222/CMD_FILE_MANAGER/domains/mydomain.com/public_html/video/brand/
And to link to the video, use this url: http://mydomain.com/public_html/video/brand/
That will look like this in the url address bar: http://mydomain.com/video/brand/

3.  How to link to a .PDF document within Magento

To link to my_document.pdf on the detailed product page or on a cms page, you may use this code:

<h4>Downloads / Support / Product Videos:</h4> <a href="http://www.mydomain.com/pdf/brand/my_document.pdf" target="_blank" title="Download Product User Manual” onMouseOver="window.status=’Product User Manual; return true” onMouseOut="window.status=’ ‘“><b>User Manual</b></a> (528 Kb) .pdf Adobe Reader document

If you add the code to your product under the ‘Product Information, Decriptions, Short Decription’, you have now added a link to a pdf product document (that opens in its own window) on the detailed product page. With Modern Theme Layout installed, the link will appear below the ADD TO CART button (please see the enclosed screen photo).

You can also easily add a CMS page that display a collection of Document links, by creating a new ‘Product Documents Title’ in the CMS section, under the ‘Manage Pages’.

HOW TO ADD VIDEOS

A) WHERE TO STORE THE VIDEOS

In order not to slow down my own web site, I have uploaded my videos to google video, and store them as unlisted. (you can open a free account here: http://www.video.google.com).
The Upload area state that they accept AVI, MPEG, Quicktime, Real and Windows Media. However, also .fvi flash video seems to work great.

Any other video hosting service that will take your video format will probably work great.

B) HOW TO GET THE DOCID FROM GOOGLE

After you have uploaded the video, you should replay the video to check that it has been uploaded properly and is ready.
As you replay the video, you can obtain the embed video, that will look similar to this:

<embed id="VideoPlayback" style="width:400px;height:326px" allowFullScreen="true" flashvars="fs=true" src="http://video.google.com/googleplayer.swf?docid=-4102452462673192857&hl;=no" type="application/x-shockwave-flash"> </embed>

You will need the docid (in this example: -4102452462673192857) for your our own code below. Make sure you also use the -sign if your id shows that:

C) HOW TO LINK TO THE CMS PAGE THAT WILL DOWNLOAD THE VIDEO

This time, I am linking to a CMS page from the detailed product page.

This code will do the job:

<a href="http://www.mydomain.com/product1-video" target="_blank" title="Product Video | Product Name | More explanations” onMouseOver="window.status=’Product Video | Product Name | More explanations’; return true” onMouseOut="window.status=’ ‘“><b>Product Name - More explanations</b></a> (0,6 Mb) Flash Video format

D) DOWNLOADING THE VIDEO FROM THE CMS SECTION

In the CMS, General Information, I add a new page for each video. Each CMS page get a unique url identifier, such as my product1-video.

Under the ‘Content’ field, add this code to open up a new window and allow for playback of the flash video:

<body style="margin: 0px; padding: 0px">
<
embed style="width:400px; height:326px;" id="VideoPlayback" type="application/x-shockwave-flash" src="http://video.google.com/googleplayer.swf?docId=-4102452462673192857&hl;=no" flashvars="autoPlay=true"> </embed>
</
body>
</
html>

Under the ‘Custom Design’, I have chosen 1-column Layout. The playback window for the video now looks like the main web window (see the attached screen photo).

I am sure this can be done both better and easier. Hopefully some programmers can comment.

And still, I have no idea how to make my own tab on the detailed product page, besides the ‘Product Description | We Also Recommend | Product Tags | Additional Information’ tabs , that in my case I would name ‘Downloads / Support / Product Video.

Image Attachments
Magneto_Window_1.JPGMagneto_Window_3.JPG
 
Magento Community Magento Community
Magento Community
Magento Community
 
tradiArt
Guru
 
Avatar
Total Posts:  379
Joined:  2008-04-28
Spain
 

Thank you very much norbolig for all your help.

Anyway, will be nice to automate the process from the admin area… this is only a provisional solution for a powerful ecommerce platform like Magento (I hope).

Best regards.

 
Magento Community Magento Community
Magento Community
Magento Community
 
Tarunjot
Jr. Member
 
Total Posts:  3
Joined:  2008-06-12
 

I’ve tried adding this feature by including .pdf extension where we upload images in admin.I am able to upload the PDF file and its also getting saved in the database but i don’t know how to display it on front end..I am unable to find the URL i should include for my PDF to get displayed...If anybody knows the answer please reply asap..its really urgent.

PS:It will be highly appreciable if anybody gives me the code for implementing it.

 
Magento Community Magento Community
Magento Community
Magento Community
 
norbolig
Guru
 
Total Posts:  328
Joined:  2008-03-15
 

@Tarunjot: You should find the path using the file manager.
If you saved the .pdf document where you upload images, you should look in that area ...

 
Magento Community Magento Community
Magento Community
Magento Community
 
harish
Jr. Member
 
Total Posts:  23
Joined:  2008-04-01
 

Hi Tarunjot,

i have also change the extension in
Mage/Adminhtml/Block/Catalog/Product/Helper/Form/Gallery/Content.php
and in
Mage/Adminhtml/Block/Media/Uploader.php but it did not upload.

its also do not save any info in a database

can you tell how you have done this?

 
Magento Community Magento Community
Magento Community
Magento Community
 
Josh Mormann
Jr. Member
 
Total Posts:  13
Joined:  2008-09-24
 
Moshe - 29 April 2008 02:00 PM

This is definitely possible by:
b) creating custom attributes for each link type and having a template in your tab that will use file names in these attributes to create list of links and descriptions.

@Moshe

Is there any additional information somewhere on creating a template that will work with attributes within a tab. This sounds exactly like what I want to do, but I’m not sure where to begin.

Could you point me to any tutorials?

Thanks!

 
Magento Community Magento Community
Magento Community
Magento Community
 
doctorlogos
Sr. Member
 
Avatar
Total Posts:  178
Joined:  2008-05-06
 

It seems this subjet is not over.

It would be great attach a PDF file from the Image Product TAB or something similar.

 
Magento Community Magento Community
Magento Community
Magento Community
 
mrtech
Sr. Member
 
Total Posts:  87
Joined:  2008-06-30
 

i also need this if anyone works on it please let me know

 
Magento Community Magento Community
Magento Community
Magento Community
 
maxq
Sr. Member
 
Avatar
Total Posts:  126
Joined:  2008-10-27
Florida
 

I’m also looking for how to add an additional information tab, I thought I could do this through Attributes but I’m new to Magento and don’t really have a clue yet!
Seems like a powerful cart but it’s always hard when starting on a new one.
Anyone help?

 
Magento Community Magento Community
Magento Community
Magento Community
 
prxbl
Jr. Member
 
Total Posts:  1
Joined:  2008-09-18
 

If anyone gets this feature working from the admin menu please share it.

 
Magento Community Magento Community
Magento Community
Magento Community
Magento Community
Magento Community
    Back to top
Page 1 of 4