Knowledge Base

How do I add a custom social icon?

The color of the social icons on your site is dependent on the theme you are using. 

 

Step 1 - Find the social media icons that you would like to use, and upload them to your Media Library. Then, go to My Site → Site → Media → Add New then upload all of the icons to your site.

 

Step 2. Add a Text widget or Custom HTML widget and format your buttons using HTML. Go to My Sites → Design → Customize → Widgets → Select the widget area to which you’d like to add social icons and click Add a Widget. Find the Text Widget or Custom HTML Widget and click the widget name to add it.

 

Add a title to your widget if you like, and then add HTML to your widget following the structure below:

 

 

 

 

Facebook

 

 

Replace the https://facebook.com/WordPresscom address in the above example with your specific social profile link. For the full links, paste the link that you want the button to point to. Make sure each link begins with http:// or https://. For example, for your Facebook page, the link would be:

 

https://facebook.com/myfacebook

 

For the image URLs, find the Social Icon in your Media Library by going to My Site → Site → Media and then click on the image of your social icon and choose Edit. Then click Copy to save the URL and choose Back or Done to exit the image.

 

Social Icons - Finding URL of Image for custom icons

Repeat the code for links and image URLs for each social icon you want to add. If you’d like to add or remove services or display them in a different order, you can edit the code as necessary. You might need to tinker with the width and height values to make all of your icons display neatly in your sidebar. We’ve provided 35×35 above as an example, but you can replace that with any values you like.

 

Step 3. Once you are finished, click Publish and check out your pretty new social media buttons!