Social Icons

Content Controls

Content

These controls let you manage social network links on your site. Add different social networks, customize their icons, and define their appearance to align with your brand’s aesthetic.

  • Social Networks – Use this to add and manage different social network profiles.
    • Link – Specify the URL for each social network profile.
    • Type – Choose the type of social network from a dropdown menu to automatically fetch its default icon.
    • Icon – Customize the icon for a social network (only available when a custom icon type is selected).
    • Icon Color – Change the color of the social network icon (only available for custom icons).
    • Background – Set a background color for the social network icon (only available for custom icons).

Design Controls

Icons

Customize the visual style of your social media icons, including color, size, and shape, to ensure they seamlessly integrate with your site’s design.

  • Icon Color – Change the color of your social media icons.
  • Background – Set a background color for the icons.
  • Size – Adjust the size of the icons.
  • Padding – Control the space around the icons.
  • Shape – Choose from preset shapes or create a custom one for your icons.
  • Radius – Define the corner radius of your icons (available only for custom shapes).

Layout

Arrange how your social media icons are displayed on your site, including their orientation and spacing, for a clean and organized look.

  • Direction – Choose the layout direction of the icons.
  • Space Between – Adjust the space between individual icons.

Effect

Enhance the interactivity of your icons with effects like hover animations and opacity changes to create a dynamic user experience.

  • Transition Duration – Set how long the transition effects take to complete.
  • Scale On Hover – Adjust the scale of icons when hovered over.
  • Opacity – Control the opacity level of the icons.

Spacing

Manage the external spacing of your social icons to ensure they fit perfectly within your site’s layout.

  • Margin Top – Adjust the top margin of your social icons.
  • Margin Bottom – Adjust the bottom margin of your social icons.