Categories

Food Theme

The current situation forces us to take many radical actions. One of them may be opening an online store. Even if you own a grocery store, just do it! And everything will be easier with the new Food Theme.

How to create mega menu

As you can see on our demo, we've created a mega menu. It's a plain GrandNode feature, it's not a plugin. We've used our generic attributes feature. 

Go to the main category and in generic attributes tab create a new line named "menu-type" and set value "columns".

Next add new line "columns-number" with value "2", "3", "4" wich is number of columns in desktop.
If you want, you can set photo of the main category (it will be displayed in the right bottom corner of the mega menu in absolute position)

Show sub-categories with image

Go to the sub-category of the mega menu and type generic attribute "showImage" with value "true".

Featured Categories

As you can see on our demo, homepage categories are customized with a nice, hover effect. How can we achieve it? Basically, easily! Just set the following generic attributes:

Create a generic attribute called "alternativeName" and set value "true".
Now the description of this category will be displayed on the homepage categories slider.

How to create SHOP NOW button on that slider

Create a generic attribute named "showBtn" and set value "true".

And that's all. It's very easy, 

Categories Featured Products

Set alternative name/text

Create generic attribute called "alternativFeaturedName" and set value as you like

Example from demo:

<span style=" margin: 0 0 0 15px; font-size: 18px; font-weight: 500; color: #68a527; ">Cold</span><span style=" margin: 0 5px; font-size: 18px; font-weight: 500; ">&amp;</span><span style=" font-size: 18px; font-weight: 500; color: #68a527; ">Hot</span>

Promo Topic

You can edit this topic as you want to.

- if you want to set the countdown date

In source code of the topic, please find div's with attribute "data-countdown" and for all set value with the formatted date (ex. 2020-11-30 12:00)

Categories Templates

Left Side Bar

In admin panel -> catalog > category
set product template to "Product in Grid or Lines".

Right Side Bar

In admin panel -> catalog > category
set product template to "Product in Grid or Lines Right".

FullWith (Side Bar offcanvas)

In admin panel > category
set product template to "Product in Grid or Lines Full".

Product Templates

Simple

In Admin panel > Catalog -> Product 
set product template to "Simple product".

Scroll

In Admin panel > Catalog -> Product
set product template to "Scroll product".

Grouped

In Admin panel > Catalog -> Product 
set product template to "Grouped product (with variants)".

Image slider effect.

To change the slider effect (default is "fade"), please create a generic attrbiute called "sliderEffect" and set value "fade", "slide" or "cube".

Delivery hour

You can do this feature by creating a generic attribute with the name "deliveryHour" and value between "0-24".
If time passes this set hour you see an alert in the product overview. That the product won't be delivered tomorrow. 

back to top