How Do I Use the Separator With Text Element in SoCast?

Who Is This For?

• All users who have access to pages, blogs, contests, and sidebars.
• Applicable to all themes.

This article provides step-by-step instructions for using the Separator With Text element in SoCast. This element lets you add a styled separator with optional text and icons to your pages, blogs, contests, or sidebars.

Step-by-Step Guide

1. Title: Enter the text you want to display in the separator.
2. Add Icon: Choose whether to add an icon to the separator. If selected, the Icon Settings tab will appear.
3. Title Position: Select the alignment for the title. Options: Left, Right, or Center.
4. Separator Alignment: Choose the alignment for the separator. Options: Left, Right, or Center.
5. Color: Select a color scheme from the drop-down menu.
6. Style: Choose a display style for the separator. Options: Border, Dashed, Dotted, Double, or Shadow.
7. Border Width: Set the border width in pixels (1px–10px).
8. Element Width: Set the separator width as a percentage (10%–100%).
9. Element ID: Enter a unique and valid element ID according to W3C specifications.
10. Extra Class Name: Add a custom class name if you want to apply additional CSS styling to this element.

Icon Settings

1. Icon Library: Select the icon set you want to use (similar to choosing a style of emoji).
2. Icon: The available icon options will change based on the library you selected.
3. Icon Color: Choose a color for the icon from the drop-down menu.
4. Background Shape: Select the background shape and style for the icon. Options: None, Circle, Square, Rounded, Outline Circle, Outline Square, Outline Rounded.
5. Size: Choose the icon size. Options: Mini, Small, Normal, Large, Extra Large.