How to Configure the Separator Web Part

This webpart is part of the Percy Web Parts app which is included in the Percy site templates. If you do not see this webpart, add the Percy Web Parts app to your site.

The Separator web part is a great way to structure and break up content on your page. It adds a divider line and some padding in between your web parts to give you a bit more flexibility in the spacing you have. 

On top of this, our separator webpart can also bring in text and icons rather than just being a divider line for even more flexibility. 

  1. Add the webpart by editing your page and selecting Separator
    separator-setup-1
  2. By default, it will give you the divider and padding like so:

  3. If you want to configure it further, click on the edit pen on the webpart panel to display these options



    separator-setup-2

  4. The panel will provide you with the following options:
    1. Text - Adds some text to the line, depending on the allignment settings
    2. Icon - Type the name of a Microsoft-provided icon to add to the separator. Use the link below the text box to see the list of available icons
    3. Use icon - Replaces the text with an icon
    4. Alignment - To change where the text/icon appears
    5. Size - To adjust the size of the text/icon being used
    6. Text Colour - Changes the colour of the divider text. Your theme colours are shown, and you can use hex codes to use a custom colour
    7. Separator Colour - Changes the colour of the divider line. Your theme colours are shown, and you can use hex codes to use a custom colour