- PrestaShop 兼容性
- 1.7.x
- 8.x
- 摘要
- display videos on the main image gallery to present your products to your customers
It’s a popular and fancy way to display videos on the main image gallery to present your products to your customers, which can increase your conversion rate.
If you are looking for the feature of playing videos on the category page, then check this module Easy Video - PrestaShop 1.7 and 8 product video module
Prestashop product videos module For PrestaShop 8 and PrestaShop 1.7 and PrestaShop 1.6
It's a popular and fancy way to use videos to present your items to your customers, using videos to present products can increase your conversion rate. Displaying videos on the main image gallery is the most natural way and most accessible way for your customers to watch them.[vc_single_image source="external_link" external_img_size="278x156" alignment="left" onclick="custom_link" img_link_target="_blank" lazy_loading="true" custom_src="[URL]https://www.sunnytoo.com/wp-content/uploads/2018/08/prestashop-product-videos-module-video-preview.jpg[/URL]" link="[URL]https://youtu.be/URvRwj8D8yc[/URL]"]
Global settings for demo product 1, 2 and 3.
- - Prepend video thumbnails to the beginning of image galleries.
- - Autoplay - ON.
- - Loop - ON.
- - Skin - Default.
- Compatible with the nice main image gallery and thumbnail gallery feature of panda theme and transformer theme.
- Multiple videos.
- Mixed MP4 and YouTube videos.
- Custom video thumbnails.
- Vertical align YouTube thumbnails.
- Autoplay and Loop is off on this video to show that those settings can be different on every video.
- Youtube videos with custom thumbnails.
- - Add play buttons to the first image of main image gallery and thumbnail gallery. Only the first video will be shown out.
- - Loop - ON.
- - Skin - Sublime.
- Autoplay - OFF
Demo product 5 (FR) - Multi-language support
- Different videos for EN and FR.
- Autoplay - ON
- Autoplay - ON
- Use Youtube native controls for Youtube videos.
- - Display a play button on the main image section, a player will show out when the user clicks on the button.
- - Skin - Youtube
- Autoplay - OFF
- Autoplay - ON
- - Append videos to the end of thumbnail gallery.
- - Skin - Facebook
- - Autoplay - OFF
Demo product 10 - Multi-YouTube videos
Seven ways to display videos.
- Display a play button on the main image section, a player will show out when the user clicks on the button. This module will only show one video per product when in this option. This module will be albe to be compatible with all themes with this option.
- Display a play button on the first image and its thumbnail. This module will only show one video per product when in this option. This module will be albe to be compatible with all themes with this option.
- Add video thumnails to the beginning of product thumbnail gallery. If a vidoe does not have thumbnail, then product cover image will be used.
- Add video thumnails to the end of product thumbnail gallery. If a vidoe does not have thumbnail, then product cover image will be used.
- Add play icons to the beginning of product thumbnail gallery. Custom video thumbnails will be shown out.
- Add play icons to the end of product thumbnail gallery. Custom video thumbnails will be shown out.
- Add videos to the top or bottom of product description.
2. By using the rest four ways of displaying videos, this module is compatible with most PrestaShop themes including
- Panda theme v1, v1 for thirtybees and Panda theme v2.
- Transformer theme v4
- PrestaShop 1.7's Classic
- PrestaShop 8's Classic
- PrestaShop 1.6's Default theme
- Alysum for PrestaShop 1.7
- Warehouse for PrestaShop 1.7
For Warehosue theme, edit the \themes\warehouse\templates\catalog\_partials\_product_partials\product-thumbnails.tpl file, remove this code gt 1 from it.
For Alysum theme, I guess you need to edit the \themes\alysum\templates\catalog\_partials\product-cover-thumbnails.tpl. file.
Panda theme and Transformer theme have an option to show thumbnail gallery out when a product just have one image, so no need to edit files.
3. This module can't work fine for products which have no images.
4. This module can't work with the displaying thumbnails in "Grid view" option of Transformer theme and Panda theme.
It might not be compatible with some highly customized PrestaShop themes, but we can provide free help for integration, if we can't make it work with your theme, you will get full refund.
Self-hosted .mp4 video and YouTube video.
Self-hosted .mp4 video- - For short videos, videos less than 1 minute
- - Fit perfect, by using slef-hosted videos, you can crop you videos to be the same ratio/size as product images, so the can fix perfect fine.
- - Don't worry to much of self-hosted are too large to be loaded. For example the size of panda theme's main gallery images is 370x423, the size of 1 minute video in 370x423 and in media quality can be very small about 6M.
- - Self-hosted videos will start to be downloaded when they are started to play, no video frames will be downloaded at the beginning, so your site won't be slowed down, don't worry.
- - Generally videos can be loaded faster than self-hosted videos.
- - No related videos when a YouTube video ends, in order to don't distract your customers.
- - YouTube videos are all in landscape, so in most cases they can't fit well.
Highly customizable video player.
Five predefined skins for video player, beside that there are dozens of options to change colors of play button and video controllers.
Autoplay feature is NOT a guarantee that your videos will autoplay, because of some browsers do not allow autoplay for some reason, sometimes slow network connection may also cause autoplay not working. Know more about autoplay
There is a section called "Advanced settings" on the back office of this module. If this module is not compatible with your theme by default, then advanced settings can be used to make the module be compatible with your theme without editing files, generally don't touch advanced settings, do changes under our instructions.
- "Autoplay", "loop" and "mute" these settings can be different on every video.
- Ability to use YouTube native controllers for YouTube videos.
- Show videos on the Quick view window.
- Custom CSS code
How to upgrade?
Use the "Upload a module" button on "BO > Modules" page to upload the new version to your site, it's the same as how to install, don't worry all your data will be safe, prestashop will just upload updated files to your site, it won't reinstall this module.
If you have any questions with the module, post them out on the prestashop module support forum, we'll help you out.
1. How to upload mp4 videos to my website.
Videos are often too large to be uploaded via browser, so upload them by via ftp, it's recommended to upload video to the /upload/ folder of your website.
2. Video format.
MP4 is the best, because all browsers support MP4. If your video are not in .mp4, then use this great tool to convert them to be in .mp4 MiroVideoConverter.
3. Why videos are not fitting well.
Because the dimension of your videos is not the same as your product images, in this case, videos will be placed in the middle center, that's why there are spaces on left&right sides or top&bottom sides. You can change the player background to change the color of those spaces.
4. Why videos and video thumbnails displaying in the wrong dimensions.
This may happen if a product has no images, because your "no-image" placeholders are in the wrong dimensions, which causes videos to be in the wrong dimensions, regenerating thumbnails for product images may be able to fix the problem.
5. Nothing happens when I click on video thumbnails, If I set the "Product thumbnails on desktop devices" setting to "Grid".
You need to set the "Thumbnail container" setting to
.pro_gallery_thumbs .swiper-wrapper
6. The video player is affected by the zoom feature.
If you are using a zoom feature that affects the video player from working, then increase the value of the "Z-index" field to a very large number, like 10000
7. Hide the vidoe control bar at runtime.
Put this code to the custom css code field.
