How do I add a homepage hero slider to PrestaShop?

Question published 150 views

Use the module's homepage slider to render a hero carousel on PrestaShop's displayHome hook. The code resolves the default slider by the homepage identifier, loads its active banners, joins current language/shop text fields when available, and outputs the carousel only when usable images exist.

On installation the module seeds an active slider with the identifier homepage. To show a homepage hero, create or edit banners for that slider, upload at least one valid image, keep the banner active, and make sure the module remains hooked to displayHome. The hook calls the same widget renderer with slider = homepage, so the homepage output follows the same rules as embedded widgets.

The carousel query loads active banners assigned to the selected slider and orders them by position and then by banner ID. The language/shop row is joined with a LEFT JOIN, so title, subtitle and CTA text are taken from the current language and shop when that row exists, but a banner is not rejected merely because the language/shop text row is missing. That means an untranslated image-only banner can still render.

If no active banner has an existing desktop or mobile image file, the module returns an empty string instead of rendering a broken hero area.

Display behavior comes from the module configuration. The default speed is 5000 milliseconds, autoplay is enabled, controls and indicators are enabled, the transition is slide, Ken Burns styling is enabled, and the default height is 500. The template also gives the first slide eager loading and fetch priority, while later slides are lazy-loaded to reduce initial page weight.

Was this answer helpful?

Related products

Still have questions?

Can't find what you're looking for? Send us your question and we'll get back to you.

Loading...
Back to top