Social Media Buttons Widget

To use the Social Media Buttons widget, ensure it’s enabled in the Widgets Bundle dashboard at PluginsSiteOrigin Widgets. The Social Media Buttons widget can be inserted into any theme widget area at AppearanceWidgets or any page or post using Page Builder.

Once the Social Media Buttons widget has been inserted into your theme widget area or page/post using Page Builder, hover over it and click the Edit link to begin. You’ll find the following fields available:

Title
Enter a widget title if you’d like ti display one.

Networks

Use the Add button to add as many social networks as you need. On the right of each item you’ll find three icons. The down arrow opens the item, the page icon duplicates the item and the cross icon deletes the item.

Select network
Use the drop down menu to select the social network to be added.

URL
Enter the URL for your social network profile page. Use the full URL, for example if SiteOrigin was adding Twitter as a network, we’d use https://twitter.com/SiteOrigin.

Icon title
Enter a link title to be used. This title won’t be visible, it refers to the link title attribute.

Icon color
Select an icon color.

Background color
Select an icon background color.

Design and Layout

Open in a new window
Enable to open social network links in a new window.

Button theme
Select the design theme to be used. Choose between atom, flat or wire.

Use hover effects
Enable to use effects when the social network icon is hovered.

Rounding
Select the icon rounding to be used. Choose between none, slightly rounded, very rounded or completely rounded.

Padding
Select the level of padding to be used. Choose between low, medium, high or very high.

Align
Select the overall widget alignment. Choose between left, right, center or justify.

Mobile align
Select the overall widget alignment on mobile resolutions. Choose between left, right, center or justify. This resolution can be set at PluginsSiteOrigin Widgets, locate the Social Media Buttons widget and click the Settings button.

Margin
Select the margin between each social network icon. Choose between low, medium, high or very high.

Custom Networks

This section is available as part of SiteOrigin Premium.

Use this section to create your own social network icons. Start by clicking the Add button to add a new network. On the right of each item you’ll find three icons. The down arrow opens the item, the page icon duplicates the item and the cross icon deletes the item.

Name
Enter a name for your social network.

URL
Enter the URL for your social network.

Icon title
Enter a link title to be used. This title won’t be visible, it refers to the link title attribute.

Icon
Choose the icon to be used.

Icon color
Select the icon color to be used.

Icon image
If you’d prefer to use an image for your icon, use the Choose Media button to select one from your media library or use the Image Search button.