This guide explains how you add social media links to your website in Website Builder using the Social links component.
- Step 1 - Add a social links component to your site
- Step 2 - Add your social media links
- Step 3 - Adjust the style of your icons
- Step 4 - Publish your changes
Step 1 - Add a social links component to your site
- Open Website Builder from the one.com control panel.
- From the menu on the left, click Social and drag one of the component options to your workspace.
Step 2 - Add your social media links
Edit the links so they lead to your own social media pages. You can do this by selecting the component and clicking Edit icons > Links.
-
- Click the icon with the three dots to edit, hide or delete a social media icon. Hiding a link only affects that specific social media component, while deleting it affects all other social components you may have on your site.
- Change the order of the icons by clicking on a link and dragging it up and down while holding your mouse button.
- Type in an email or URL to one of your social media pages to add a new icon. You can add links to Facebook, Instagram, Twitter, Pinterest, LinkedIn, YouTube, Email, Yelp, Vimeo, Snapchat, Reddit, Tumblr, Tripadvisor and Foursquare.
Step 3 - Adjust the style of your icons
Adjust the look of the icons under Edit icons > Style.
- Change the shape of the icons; you can choose regular (default), circle, square or rounded.
- You can choose between an icon with a solid colour (fill) or a transparent area (knockout) showing your background.
- Under Colour, choose Multi colour to show social media default colours, or in black (dark) or white (light).
Adjust the Size and Spacing of the icons to your liking and choose where you want to place them on your site. Place the component in your header or footer if the icons should be visible on all pages.
Step 4 - Publish your changes
Click Save and Publish to make your changes visible on your website.
Tip: If you want to show social icons vertically, you can do so by adding a separate social links component for each icon, and hiding all but one. Then place them above one another.
Don't have access to Website Builder? You can try it out for free for 14 days and create a website in no time. Start your free trial now
Related articles: