Managing Social Icon Integration in Website Headers: A Guide
Here's the rewritten article:
View your site's integrated social icons in the header after adding social links. Learn how to customize and manage these icons effectively.
Viewing Social Icons
For Version 7.1:
- Open Pages panel and click Edit on any page
- Hover over header and click Edit site header
- Click Add elements
- Activate Social link option
- Save changes
For Version 7.0, icons appear automatically in these templates:
- Aviator
- Bedford
- Brine
- Farro
- Montauk
- Pacific
- Skye
- Tremont
- York
Customizing Icon Style
Size and Border Adjustments:
- Click Edit on any page
- Select Edit site header
- Click social links and the pencil icon
- Choose Design
- Adjust Social icon size slider
- Select border shape (Outline or Solid color)
- Modify border thickness if using Outline
Color Customization:
For Solid/Gradient Headers:
- Open header editor
- Click Edit design > Color
- Modify Navigation color
For Adaptive Headers:
- Open Site styles > Colors
- Click pencil icon on header color combination
- Adjust Navigation link settings
Hiding Social Icons
Version 7.1:
- Edit any page
- Click Edit site header
- Select Add elements
- Disable Social link option
- Save changes
Version 7.0:
- Open Site styles panel
- Locate Social tweaks
- Select hide option
- Save changes
Additional styling options vary by template, including icon shapes (Round, Square, or Normal branding shape) and positioning preferences.
Note: Icon hover colors can be modified through the Main button background settings in your site's color theme.