Magento Tutorials

Learn Magento with us

How to create new slideshow in Magento

  1. From Magento Admin panel to CMS→Slideshow→Manage Slideshow
  2. On top right click "Add New Slideshow"
  3. Fill in General Information
  4. Click "Save Slideshow" button

Slideshows can definitely make your store pop!

Slideshow may contain pictures of your products, your special offers – pretty much everything you imagine can be slideshow content.

In this tutorial we will show you how to add one from Magento admin panel.

In the beginning we showed our store’s home page, so you can see what it consist of at this point.

All we have on our homepage is our menu and our products.

Now we will go ahead and take you through the process of adding slideshow.

Head over to admin panel and navigate to CMS, hover over Slideshow and click on Manage Slideshow menu item. (see the screenshot).

Note that CMS menu item will be available only if you download our Magento Simple Menu module (for free of course) as it is not included in the default Magento installation.

Add slideshow in Magento
Locate Add New Slideshow orange button in order to create new slideshow, and start entering General Informations about your slideshow – it’s title, choose from the dropdown menu whether it will consist of pictures or something else, and in the end, choose its position.

Add new slideshow button

You should also pay attention to a dropdown menu next to Active tab since choosing Yes or No will determine whether the slideshow will be visible or not.

Last thing, under General information, is to choose in which store will your slideshow appear, assuming that you run multiple Magento stores for your business.

It will appear like this:

Add new slideshow in Magento

Next you need to set up your Global Slideshow Setting. You can determine whether you will show text on your slideshow, what will be its width and height and set up the transitions from the dropdown menu.

Also, make sure you choose when will the slideshow start and how long will take for the slides to change (animation speed).

global-slideshow-setting
Once you’re done, head over to left hand side menu and choose Slideshow images menu item.

Add slideshow images
Go ahead and click on Browse Files orange button, find wanted files in your computer and click orange Upload Files orange button next to it to start the upload. (take a look at the screenshot below)

Browse and upload images
Define the order of the photos by entering numbers in Sort Order tab.

Also, you should notice that at this point you are able to disable or remove one or multiple images by simply marking the checkbox next to the image that you want to remove.

As you probably assume – disable button will leave the image in place but will not make it visible on your store’s slideshow, and remove button will completely delete it.

Next time you would want to use it, you are going to need to upload it again from the beginning.

Again, you should head over to the left hand side menu and choose Display on Pages menu item in order to decide where will your slideshow appear.

Click to open dropdown menu and make a selection.

We opted for Home page.

Positioning the slideshow on home page
In the end, as always, click on Save Slideshow orange button in the upper right part of the page and save your slideshow.

Next steps – your store’s address, refresh button et voilà!

Your slideshow is amazing and rocking the page!

Good job!

Save slideshow button

And this is how it looks like on our store’s front end:

slideshow-front-end

Note: You can easily remove your slideshow by navigating to CMS Slideshow, clicking on slideshow that you wish to remove, and simply click on red Delete Slideshow button as shown on the screenshot above.

  • Was this helpful?
  • Yes   No