Creative Slider Modification in Prestashop 1.6

Apr 2, 2015156Lena Tsybulenko
Creative Slider Modification in Prestashop 1.6

In this article I’ll describe how I modified the Homepage slider for Traveler Prestashop 1.6 Responsive Template I’ve created.

Here is the Traveler Theme demo:

It’s quite simple. First, we’ll achieve full width (read article in our blog “How to create full width image slider”).

Then, set slider max width to 275px in the admin panel.

Set maxSlides in homeslider.js:

Partner With Us Let's discuss how to grow your business. Get a Free Quote.
Talk to Andrey

Then prepare your images and add some CSS. In order to achieve effect like Traveler, add CSS:

That’s it.


Partner With Us Looking for a partner that will help you to grow your business? We are the right company to develop your webstore. Feel free to get in touch with us. We will be happy to discuss your business opportunities and provide you with a Free Quote. Talk to Andrey

7 Comments

  1. Nice to share this. But the css implementation (effect like Traveller) did not worked for me. I added the code in themes/default-bootstrap/css/modules/homeslider/homeslider.css and I had no result.

  2. Adrian,

    Take a look carefully at your code, it should work. Or share your link and I’ll take a look.

  3. Adrian,

    Everything is OK, just need some more css

    Scale images a little, add opacity and transition.

  4. Thank you, Lena.
    I think I have problems seing my page in Firefox, even i see well the traveler theme. No transitional effect, there is a white space between images and the fade in/out does’t work. And, of course, I don’t know css :). But, again, thank you for your time and effort to look at it and answer.

  5. Hi Lena

    I have got this same problem with the code.
    Css implementation (effect like Traveller) did not worked for me.

    Please help me.

Post a new comment

top
BelVG Newsletter
Subscribe to our mailing list and get interesting stuff and updates to your email inbox.
Email *