Divide Theme

Resource strings:

divide.blog.readmore - READ MORE

divide.nomore-products - NO MORE PRODUCTS...

divide.sale - SALE

divide.gotoproduct - Go to product

divide.newproducts.more - More

divide.newproducts.see - See

divide.picker.set - Set

divide.showmore - SHOW MORE

New Products slider

1. On the product details page check option "Mark as new" and set the Start date of a new product.

2. Go to Settings -> Catalog and check "Show 'New products' on the home page"

3. Set the number of products to display on the home page

Megamenu gallery

* only for the first submenu

1. On the main category edition page add new User Fields:

- Key: gallery, Value: true

2. On "Main Subcategories" (first categories in each gallery menu columns) add User Fields:

- Key: showImage, Value: true

* Use that option if you want to show images of that subcategories.

Parallax banner

System name: ParallaxBanner_Divide, ParallaxBanner2_Divide

Example code: 

<div class="parallax-banner" data-selector=".layer" data-hover-only="true" data-relative-input="true" data-pointer-events="true">
        <div class="content layer" data-depth="0.1">
            <div class="title">
                <span class="up">SHOES</span>
                <span class="down">With coupon "SALE"</span>
            </div>
            <div class="promo">
                <div class="number">35</div>
                <div class="off">
                    <div>%</div>
                    <div>OFF</div>
                </div>
            </div>
<div><a href="#" class="btn btn-secondary mt-2">SHOP NOW</a></div>
        </div>
        <div class="img-container"><img src="/assets/images/uploaded/shoes1.png" class="layer" data-depth="0.3"></div>
    </div>

Icons

1. Using font SimpleLineIcons:

-  https://simplelineicons.github.io/

2. In Admin panel go to the  category and fill field named Icon, for example:

<span class="icons icon-user-female"></span>

Product Flags

1. Go to the Product details page -> General tab -> Fill the Flag field like in this example:

<span class="danger">AUCTION</span>

Badge background-color List:

- danger (#dc3545)

- success (rgb(169, 204, 0))

- warning (#ffc107)

- dark (#212529)

- purple (#673AB7)

- teal (#50b890)

- green (#4CAF50)

- orange (#EF6C00)

- indigo (#3F51B5)

* You can use different classes like danger, orange, success. If a product has old price, "SALE" flag will be added automatically

Color picker

1. In the admin panel go to the Customers -> Customer groups -> Administrators > User Fields and set

Key: showPicker, Value: true

Key: usePicker, Value: true

* if you want to disable set values to false

 <div class="parallax-banner" data-selector=".layer" data-hover-only="true" data-relative-input="true" data-pointer-events="true">
        <div class="content layer" data-depth="0.1">
            <div class="title">
                <span class="up">Handbags</span>
                <span class="down">With coupon "SALE"</span>
            </div>
            <div class="promo">
                <div class="numberr">45</div>
                <div class="off">
                    <div>%</div>
                    <div>OFF</div>
                </div>
            </div>
<div><a href="#" class="btn btn-secondary mt-2">SHOP NOW</a></div>
        </div>
        <div class="img-container"><img src="/assets/images/uploaded/bag1-2.png" class="layer" data-depth="0.3"></div>
    </div>