User Guide: Magento 2 Banner Slider

User guide of Banner Slider for Magento 2

In this guide, I will show you how to insert A banner slider into Homepage of Magento 2 store.

Step 1: Add new banners

First of all, you should add banners into your store.

From Magento 2 Admin > Banner Slider > Banners > Add New Banner

Fill information, upload image file to Upload File file.

Then Click Save Banner

You can add as many banners as you want. After finish adding banners, you can go to next step: add a new slider.

Step 2: Add a new slider

From Magento 2 Admin > Banner Slider > Sliders > Add New Slider

Fill Slider information as the following:

Click on Banners tab, and choose uploaded banners. You also can sort order by position.

Then Save Banner, you can see slider_id in this example is 1

Step 3: Insert into Homepage

{{block class="Mageplaza\BetterSlider\Block\Slider" template="Mageplaza_BetterSlider::slider.phtml" banner_id="1" }}

You can change your own banner_id value depend on your store.

Then click Save Page.

Step 4: Flush Cache and Check result

To flush Magento cache, you can follow this guide: Magento 2 how to flush cache

Navigate your browser to Magento homepage and check result. Here is what we get.

How to insert Banner Slider in layout file

In Xml file, you can insert the following block of code:

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../../../../../lib/internal/Magento/Framework/View/Layout/etc/page_configuration.xsd">

    <referenceContainer name="content">
        <block template="slider.phtml" class="Mageplaza\BetterSlider\Block\Slider" name="mageplaza_betterslider"/>
    </referenceContainer>
</page>