Magic Scroll for PrestaShop

Key features

Over 45 000 happy customers use Magic Toolbox

Magic Scroll is the go-to choice for image thumbnail scrolling for Prestashop. Easy and elegant, it'll make your store's user experience intuitive and smooth.

Helpful support

Our friendly support team is always there for you. If you encounter any problems, be sure to message us and we'll solve your issues in no time.

Live demos

Bullazo

Screenshots

Installation

1. Download the PrestaShop module for Magic Scroll (free and fully functional demo version).
2. Either upload it via your PrestaShop admin area. Or unzip the file on your computer and FTP the magicscroll folder to the /modules/ directory of your store, keeping the file and folder structure intact.
3. Activate the module via the Modules menu Modules > Other Modules > Install.
4. The demo version is now installed!
5. Customize Magic Scroll as you wish.
6. Magic Scroll can be enabled on any page or section you choose.
7. Buy Magic Scroll To upgrade your free and fully functional trial version of Magic Scroll (which removes the "Trial version" text), buy Magic Scroll and overwrite following file with the same one from your licensed version:

   /modules/magicscroll/magicscroll.js

Multiple images

Swapping between the main product image and thumbnail images is a standard feature of our PrestaShop image zoom tools (Magic Zoom Plus, Magic Zoom & Magic Thumb). But what happens when you have lots of images for the same product? An easy way to keep thumbnail images contained is to use Magic Scroll.

Magic Scroll allows customers to scroll through each product image using arrows. It's the perfect way to keep any product page layout looking slick.

The example below shows Magic Zoom Plus combined with Magic Scroll:

To achieve this look, simply:

1. Install and buy Magic Zoom Plus for PrestaShop.
2. Activate Magic Scroll option on the Magic Zoom Plus settings page in PrestaShop.
3. To remove the Magic Scroll trial version message, buy discounted license from Magic Zoom Plus order page:
   a) Log in to your Magic Toolbox Account.
   b) Click 'Download/View' button next to your Magic Zoom Plus order.
   c) Click orange button: Purchase Magic Scroll 35% discount (pay £18.85 instead of £29).
   d) Follow payment process.
4. Download magicscroll.js file from your license and upload to /modules/magiczoomplus/views/js/magicscroll.js on your server.
5. Clear browser cache. The 'Trial version' message will disappear.

Home page carousel

Add an amazing carousel to your homepage in just a couple of clicks:

1. Go to the module options page: Admin > Modules > Modules > Magic Scroll > Configure.
2. Go to 'Home page/custom slideshow' tab.
3. Enable Home page Slideshow section.
4. Select Upload images and browse your computer for your set of slideshow images.
5. Your carousel is now working!
6. To set a specific carousel size, change Scroll width (pixels) and Scroll height (pixels) options.
7. Enjoy carousel customizations. Try them all and see which works best for your site.

Carousel in CMS area

1. Go to the module options page: Admin > Modules > Modules > Magic Scroll > Configure.
2. Go to 'Defaults' section > General > Include headers on all pages > Click 'tick' > Save settings.
3. Go to 'Home page/custom slideshow' section.
4. Upload carousel images > Save settings.
5. Insert the carousel shortcode [magicscroll] where you want it to show on any CMS page.
6. If you want to show slideshow with specific images only, please use shortcode [magicscroll id=1,2,5] where 1, 2 and 5 are the numbers of images from the ID column.

Uninstallation

Thanks for trying Magic Scroll on your PrestaShop site! What did you hope Magic Scroll could do? How can we improve it? Let us know, we're always improving our tools based on customer feedback.

1. Deactivate Magic Scroll via the Modules and Services > Module and Services > Other Modules > Uninstall.
2. Delete Magic Scroll via the Modules and Services > Module and Services > Other Modules > Delete.
3. Magic Scroll is now uninstalled.

FAQ

1. Can I change background colour of carousel?

   Yes! By default, the Carousel & Cover-Flow modes use a grey/black background colour. You can change the Hex Colour to anything you want. With over 16,000 hex colours available, you'll be spoilt for choice. Simply add the CSS code you need to the Magic Scroll CSS file.

   Carousel background

   .MagicScroll[data-mode="carousel"] {
       background-color: <your-colour>;
   }
   

   Cover-flow background

   .MagicScroll[data-mode="cover-flow"] {
       background-color: <your-colour>;
   }
   

Other PrestaShop modules

Try our other great image effects!

Magic Zoom

Magic Zoom Plus

Magic Thumb

Magic Slideshow

Magic 360

This PrestaShop carousel software can insert scrollers anywhere on your site. If you get stuck, please contact us and we will help you.

This JavaScript carousel module was created for PrestaShop, the open source ecommerce solution. It is one of a range of gorgeous modules to make your images look beautiful.