How to use the Segmented Slider Module?

Webayt The Sectional Slider Module in CMS is used to create advanced slider areas on your website that include images, titles, descriptions, and buttons. This module allows you to create not only visual banners but also more descriptive sections with text and navigation areas.

The Segmented Slider Module is particularly useful for homepages, service presentations, campaign areas, product or package introductions, and eye-catching navigation sections. For each slider element, you can manage the image, title, description, button text, button link, color settings, group selection, order, and status information.

What is the purpose of the Segmented Slider Module?

The Sectional Slider Module allows you to create richer slider sections on your website. Unlike standard slider structures, each slider element can include not only an image but also a title, description, buttons, and color settings.

This way, instead of simply showing a visual to the visitor, you can provide a short message supporting the image, descriptive text, and a button that directs them to the relevant page.

For example, the Segmented Slider Module can be used to promote a service, highlight a campaign, announce a new feature, or direct a user to a specific page.

How can I access the Segmented Slider Module page?

To access the Segmented Slider Module, go to the Modules section in the left menu of the Webayt admin panel and enter the Segmented Slider Module page.

 Modules → Segmented Slider Module

This page lists previously added slider elements. You can add new slider elements, edit existing sliders, or delete them if necessary.

Slider Listing Screen

The segmented slider module displays added slider elements in a table format on its main screen. This list includes the slider image, title, group information, sequence value, and status information.

The following actions can generally be performed on the listing screen:

• Viewing the current slider elements
• Go to the new slider adding screen.
• Editing slider elements
• Deleting slider elements
• Controlling the active or inactive status of sliders.

This screen allows you to quickly control which elements are included in the segmented slider area and in what order they are displayed.

How to Add a New Multi-Segment Slider?

To add a new segmented slider element, use the Insert Slider tab. On this screen, you can define the slider's text, image, button information, color settings, group selection, order value, and status.

1. Log in to the Webayt admin panel.
2. Open the Modules section from the left-hand menu.
3. Go to the Sectional Slider Module page.
4. Click the Add Slider tab.
5. Please fill in the title and description fields for the slider.
6. Enter button text and a button link if necessary.
7. Upload or select an image for your slider.
8. Choose the background, title, and description colors.
9. Choose a group if necessary.
10. Set the slider's order value.
11. Set its status to on or off.
12. Save the slider element by clicking the Add button.

Once the slider is added, it becomes available in the relevant module area.

How to Use the Title Field?

The title field is used to display the main message highlighted on the slider. Since it's one of the first pieces of text a visitor notices, it's recommended to keep it short, clear, and easy to understand.

The title field can be used to highlight the service, campaign, feature, or referral message you want to promote.

How to Use the Description Field?

The description field is used to enter more detailed text that supports the title. This field can briefly explain what the slider is about, what it offers the user, or why it's important.

It is recommended that the description text not be too long. Since slider areas are generally sections that need to be read quickly, short and effective texts yield better results.

How to Use Button Text and Button Links?

Button Text is used to determine the text of the button that will be displayed on the slider. For example, short directional texts such as "View Details", "Get a Quote", "Start Now" or "Contact Us" can be preferred.

The Button Link specifies the link to the page the user will be redirected to when they click the button. This field can redirect to a service page, package page, contact page, or other content.

If a button is not going to be used, the button text or button link can be left blank depending on the theme structure. However, if a button is going to be used, make sure the link directs to the correct page.

How to Use the Visual Space?

In the Sectional Slider Module, an image can be selected for each slider element. The image enhances the visual impact of the slider and provides a narrative that supports the text.

When uploading images, attention should be paid to file size and supported file types. Images that comply with the file rules specified in the panel should be preferred.

For detailed information on general image uploading procedures, you can review the "How to Upload Images in the Webayt Panel?" guide.

What is the purpose of background color?

The Background Color setting is used to determine the background color of the relevant slider element. This allows you to create a different visual atmosphere for each slider element.

When choosing a background color, care should be taken to ensure it is compatible with the image, title, and description text colors. If very dark or very light colors are used, the readability of the text should also be checked.

How to Use Headline Color and Description Text Color?

Title Color determines the color in which the slider title is displayed. Description Text Color manages the color of the text in the description area.

These colors should match the slider's background color. Readability can be improved by using light text against dark backgrounds and dark text against light backgrounds.

When choosing colors, it's important to consider both brand consistency and user experience.

What is the purpose of group selection?

Group Selection allows you to associate a slider element with a specific group. This field can be used to separate segmented slider elements according to different use cases or to list sliders belonging to a specific group in the relevant module display.

If you want to display only slider elements from a specific group on a page, you can select that group. For general use, the default group can be chosen.

For more detailed information about groups, you can review the How to Use Groups guide.

What is the purpose of the queue area?

The order field is used to determine the order in which the slider elements are displayed.

If there are multiple slider elements, their order value can affect their arrangement on the front end. Slider elements with lower order values may be displayed earlier depending on the theme structure.

To ensure a smooth slider flow, it's helpful to plan the sequence values systematically.

What is the purpose of the Status field?

The Status field determines whether the slider element will be displayed on the site.

• Open: The slider element is visible on the site.
• Closed: The slider element remains saved in the panel but is not displayed on the site.

Instead of deleting slider elements you want to temporarily disable, you can set them to a closed state. This way, you can reactivate them later.

How to Update a Sectional Slider?

To update an existing segmented slider element, you can click the Edit button next to the element in the listing screen.

On the slider update screen, you can edit the title, description, button text, button link, image, color settings, group selection, order, and status fields. After making changes, click the Update button to save the slider.

The slider update screen may also include a "Lists to Update" field. This field is used to specify which language lists to update in multilingual environments.

For more detailed information on this topic, you can review the guide "How to Use Update Lists?" .

Deleting a Segmented Slider

If a slider element is no longer needed, it can be deleted using the Delete button on the listing screen.

When a slider is deleted, the corresponding item is removed from the segmented slider list. If it might be needed again later, it might be safer to set its status to "Closed" instead of deleting it.

How to Add a Sectional Slider Module to Pages?

Creating slider elements in the Segmented Slider Module makes these elements available in the system. However, for these slider elements to be displayed on a page, the segmented slider module may need to be used in the Module Management area of that page.

For detailed information on how to add modules to pages, you can review the "How to Add Modules to Pages?" guide.

The Difference Between a Segmented Slider and a Slider Module

The Slider Module is primarily used to manage visual banners. The Segmented Slider Module, on the other hand, offers additional areas alongside the image, such as a title, description, buttons, and color settings.

Briefly:

• Slider Module: Used for visual banner-focused slider structures.
• Sectional Slider Module: Used for more descriptive slider areas containing images, text, buttons, and color settings.

What should be considered when using a segmented slider?

Sectional slider areas are one of the key elements that capture a visitor's attention. Therefore, the visuals, text, and colors must be harmonious as a whole.

• Write a short and catchy title.
• Do not make the description text unnecessarily long.
• Create button text with clear directional phrases.
• Check that the button link redirects to the correct page.
• Make sure the image is compatible with the slider design.
• Ensure that the background and text colors are readable.
• Determine the order values in a planned manner.
• Instead of deleting unused slider elements, consider turning them off.
• If group selection is used, make sure the correct group is selected.
• After making the update, check how the page appears on the front end.

Summary

The Segmented Slider Module is used in Webayt CMS to create advanced slider areas containing images, titles, descriptions, buttons, and color settings.

This module allows you to make slider elements more descriptive and direct visitors to specific pages. It is recommended to perform a post-update front-end check to ensure slider elements are displayed in the correct order, with the correct color, the correct image, and the correct link.