How to Display and Customize Social Media Icons on Your Website
Social media icons are customizable elements that can be displayed on your website header. Here's how to manage them effectively:
Displaying Social Media Icons
For Version 7.1:
- Open page menu and click Edit
- Hover over header and select Edit Website Header
- Click Add Elements
- Toggle Social Media Links switch
- Save changes
For Version 7.0: Icons appear automatically in these template groups:
- Aviator
- Bedford
- Brine
- Farro
- Montauk
- Pacific
- Skye
- Tremont
- York
Customizing Icons
Size and Border:
- Access Header Editor
- Click social media links
- Select Design tab
- Adjust size using slider
- Choose border shape (Outline or Filled)
- Set border thickness if using Outline
Color Settings:
For Solid/Gradient Headers:
- Open Header Editor
- Click Edit Design > Color
- Modify Navigation Color
- Adjust Primary Button Background for hover effects
For Adaptive Headers:
- Access Website Styles > Colors
- Edit selected color scheme
- Modify Navigation Links
- Update Primary Button Background for hover effects
Additional Style Options:
- Shape options: Round, Square, Normal (brand default)
- Custom colors
- Size variations
- Border styles
Hiding Icons
Version 7.1:
- Edit Website Header
- Click Add Elements
- Toggle off Social Media Links
- Save changes
Version 7.0:
- Open Website Styles
- Locate Social adjustment
- Select hide option
- Save changes
Remember that social media icons appear after adding social media links to your website. Use social link blocks to add icons in other website areas.