Create a banner group

Consider how we can create a group of banners on OkayCMS, create slides for the group, analyze the banner settings and display it in our template.

The first step is to create a group of banners

We go to the OkayCMS admin panel, in the left side menu we find the item “Banners” and in it “Banner groups

In the banner group, we will see all current banner groups, on which pages or products this group is displayed and activity.

Next, click on the “Add banner group” button:

Now let's set up a new group of banners

Be sure to set the name, you can write in Cyrillic, the name will be displayed only in our admin. panels.

For example, we will have a group with smartphones, we write the name “Smartphones”

We can also configure the activity of a group of banners, set the switch to active.

The banner group ID is a unique key by which we can interact with banners. It is recommended to write in lowercase and in Latin letters, let's call it:

smartphones_banners_group

Individual shortcode - this item allows us to create shortcodes, we will need this to display it on the page, enable it, click “Apply”

After that, we will create a shortcode, we will return to it a little later.

Next, we can configure the display of banners on pages, product categories or brands on individual or display for everyone, we will display for everyone.

The last thing we will configure in the banner group will be the display itself on the site:

1. Banner group as a slider - allows you to enable / disable the slider functionality based on Swiper.JS
   Autoplay slides (autoplay) - slides will automatically change by themselves
   Infinite slider (loop) - when you reach the last slide and scroll to the next one, we will return to the first slide
   Slide arrows
   Navigation points (bullets/dots)
   Slide change speed - the parameter is responsible for the speed at which the slides will be turned over, set in ms.

Customize for yourself and click the "Apply" button:

The second step will be creating separate banners and linking to a new group of banners

In the side menu we find the item “Slides”, they are also a banner. Here we will display all the created banners, we can also manage the activity of each individual banner, quickly bind to a group and manage the display order.

Click on the "Add banner" button

In the settings of the new banner, we need to enter the name of the banner and link it to our group “Smartphones”, as well as in the “Address (URL)” field we can add an arbitrary link to a third-party resource or to the pages of our site.

Consider additional banner settings:

Image - Most raster and vector image formats are available.

Display Option - determines how the arrangement of texts looks.

Banner resizing - converts an image from one resolution to another. For example, from 1200x700 to 800x480.

Text for the banner - here we can set the Title, Text and Image Title (Alt for SEO)

Fill out and click apply. We have a group of banners and a banner, it remains to display them on the page.

Let's go back to our banner group and copy the name of the shortcode.

Then go to the admin panel menu item Design> Template files and find the main.tpl file (the main page of the site).

It remains only to insert our shortcode.

Ready! The group of banners is displayed in the right place