Aller au contenu principal

Tabs & Description Placement

Adds a dedicated video section in the lower part of the product page — either inside the product tab bar, in the product footer area, or at a custom position in your theme — with a full embedded player or a clickable thumbnail list.

remarque

Available since v3.0.0

Overview

This placement is designed for longer videos and detailed product demonstrations where you want the video content separated from the gallery and the add-to-cart area. Instead of competing for attention near the product images, videos appear lower on the page where customers who want more detail will naturally scroll.

You have three location options: inside the product tab bar (alongside Description, Details, and other native tabs), in the product footer area just below the tab block, or via a custom hook that you can drop anywhere in your theme template. Within each location you can choose between a full embedded player and a thumbnail grid that opens a pop-up lightbox.

The section is only rendered for products that actually have videos assigned. Products without videos show no tab, no footer block, and no hook output, so you will never see an empty "Videos" tab.

Configuration

Go to Modules > Module Manager > Product Video > Configure, then open the Tabs & Description section.

Enable

FieldValuesDefaultDescription
Enable / disable this featureYes / NoNoMaster switch. Turn this on to activate the Tabs & Description placement.
Display onAll devices / Desktop only / Mobile and Tablets onlyAll devicesLimit this placement to specific device types. Use this if another placement already covers mobile and you only want the tab on desktop, or vice versa.

Location & Style

FieldValuesDefaultDescription
LocationProduct Tabs / Product Footer / DisplayProductVideosContent hookProduct FooterWhere the video section appears on the product page. See "How It Works" below for details on each option.
DisplayPlayer with videos below / Click-to-popup thumbnail listPlayer with videos belowHow the videos are presented. The player embeds directly on the page; the thumbnail list shows a clickable grid that opens each video in a pop-up lightbox.

Player Dimensions

These two fields are ignored when Make Video Responsive is enabled.

FieldValuesDefaultDescription
Video widthNumber (pixels, no px suffix)720Width of the embedded player.
Video heightNumber (pixels, no px suffix)520Height of the embedded player.
Make Video ResponsiveYes / NoYesScales the player to fill the container width while maintaining aspect ratio. Recommended for modern responsive themes.

Thumbnail Grid

This setting applies only when Display is set to "Click-to-popup thumbnail list".

FieldValuesDefaultDescription
Number of videos per line4 / 5 / 6 / 7 / 86How many thumbnail columns appear in the grid.

Save your changes after adjusting any setting. The preview on the front office updates immediately after clearing any Smarty cache your theme uses.

How It Works

Product Tabs location

When you select Product Tabs, the module hooks into displayProductTab and displayProductTabContent (PS 1.6) or displayProductExtraContent (PS 1.7+) to inject a "Videos" tab alongside the built-in product tabs. On PrestaShop 1.7 and later, the tab title is set to "Videos" automatically via the ProductExtraContent API, which also means it integrates cleanly with tab ordering and CSS styling handled by your theme.

The tab only appears when at least one video is assigned to the product. If the product has no videos, the tab is not rendered at all — your customers will never see an empty Videos tab.

Product Tabs requires that your theme calls the relevant hooks in its product template. The default Classic theme (PS 1.7+) and most commercial themes support this. If the tab does not appear after enabling, your theme likely does not implement these hooks — switch to Product Footer instead.

When you select Product Footer, the module uses displayFooterProduct. The video section renders below all tabs and description content, before the page footer. This option works with virtually every PrestaShop theme because displayFooterProduct is a standard hook present since PS 1.6.

On PS 1.6, the hookProductFooter alias is also registered, so both naming conventions are covered automatically.

DisplayProductVideosContent hook (custom placement)

When you select the DisplayProductVideosContent hook option, the module responds to the custom displayProductVideosContent hook but outputs nothing until you add the hook call to your theme template yourself. This gives you full control over exactly where on the product page the video section appears.

To activate it, open your theme's product.tpl (or the equivalent file in your theme) and add this line at the position you want:

{hook h='displayProductVideosContent' product=$product}

This is the only location option that requires a manual template edit. The other two options work without touching theme files.

Responsive vs fixed dimensions

With Make Video Responsive enabled (the default), the player stretches to fill 100 % of its container's width and adjusts its height proportionally. The Video width and Video height values are ignored entirely in this mode.

With Make Video Responsive disabled, the player is rendered at exactly the pixel dimensions you specify. Use this when your layout has a fixed-width container and you need the player to match a precise size — for example, to align with a sidebar or a specific grid column.

Device filtering

The Display on setting is evaluated server-side using PrestaShop's mobile detection. Setting it to "Desktop only" hides the section completely on phones and tablets; "Mobile and Tablets only" hides it on desktop browsers. Use this to avoid duplicating video content when you have already enabled another placement (such as the side panel) for one device class.

Usage Examples

Example: Adding a Videos tab alongside Description and Details

You sell camera lenses. Each lens has a 3-minute review video. Enable this feature, set Location to "Product Tabs", leave Display as "Player with videos below", and enable Make Video Responsive. Customers see a "Videos" tab next to "Description" and click it to watch the review without leaving the page.

Example: Footer thumbnail grid for a product with many videos

You sell online courses and each product has 6 preview clip thumbnails. Set Location to "Product Footer", Display to "Click-to-popup thumbnail list", and Number of videos per line to 6. All six thumbnails appear in a single row below the description. Customers click any thumbnail to open that clip in a lightbox.

Example: Fixed-size player in a narrow column layout

Your theme has a two-column layout on the product page and the right column is 480 px wide. Set Location to "Product Footer", disable Make Video Responsive, and set Video width to 460 and Video height to 260. The player fits neatly inside the column without overflow.

Important Notes

  • On PrestaShop 1.6, the "Product Tabs" option uses displayProductTab / displayProductTabContent. On PS 1.7+, it uses displayProductExtraContent. Both are handled automatically — you do not need to change anything when upgrading.
  • The responsive option note in the Back Office reads "Only works for TAB and Product Description Options" — this means it applies to the Tabs & Description placement only and does not affect the Image Gallery or Side Panel placements.
  • This placement is multi-shop aware. Settings are stored per-shop context, so you can enable it on one shop and disable it on another.
  • If the Display on device filter is active and you are testing in a desktop browser, switch to "All devices" temporarily to confirm the section renders correctly before re-applying device filtering.
  • The PV_VIDEOW and PV_VIDEOH config keys are also used by the AMP carousel feature when AMP support is enabled. Changing them here affects both.

Troubleshooting

ProblemSolution
The Videos tab never appearsConfirm your theme calls {hook h='displayProductTab'} and {hook h='displayProductTabContent'} in its product template. If it does not, switch Location to "Product Footer".
Tab appears on PS 1.7 but is emptyCheck that at least one video is assigned to the product in the product edit page. The hook returns empty output for products without videos, but the tab frame may still render depending on your theme.
The player is too wide and overflowsEnable Make Video Responsive so the player scales to fit the container, or reduce Video width to match your layout.
The player dimensions seem to have no effectMake Video Responsive is probably enabled. Disable it to use the fixed width and height values.
Custom hook option shows nothingYou need to manually add {hook h='displayProductVideosContent' product=$product} to your theme's product.tpl. The hook only outputs content after you add this line.
Videos appear on mobile when set to Desktop onlyClear your theme's Smarty template cache. The device detection is server-side but cached templates may serve stale output.

Frequently Asked Questions

Q: Will a Videos tab appear for products that have no videos? A: No. The tab and footer block are only rendered when the product has at least one video assigned. Products without videos produce no output from this placement.

Q: What is the difference between "Player with videos below" and "Click-to-popup thumbnail list"? A: The player option embeds a full video player directly on the page so customers can watch without any extra click. The thumbnail list shows a grid of video thumbnails; customers click a thumbnail to open the video in a pop-up lightbox. Use the player when you have one main video per product, and the thumbnail list when products have several videos you want to browse.

Q: My theme uses a page builder and the product tab hook is not available. What should I do? A: Select the DisplayProductVideosContent hook option and add {hook h='displayProductVideosContent' product=$product} to the product page layout in your page builder's template editor. If your page builder does not support hook injection, use Product Footer instead — it works with almost every theme and builder.

Q: Does enabling this placement slow down product pages? A: The module only loads video data and renders output on product pages where this placement is active. For products with no videos the hook returns an empty string immediately, so there is no query overhead for video-free products.

Q: Can I show the tab on desktop and the footer on mobile at the same time? A: Not with a single instance of this placement. To achieve device-specific locations, set this placement to one location and use the Side Panel or another placement for the other device class, controlling each with the Display on device filter.

Q: The "Number of videos per line" setting does nothing. Why? A: This setting only applies when Display is set to "Click-to-popup thumbnail list". If you are using the "Player with videos below" option, the column count has no effect.