How To Add More Social Media Icons
In every template purchased from SimplyTheStudio are pre-written links to Instagram, Twitter, Pinterest, Bloglovin and Email. However, you can easily add more icons — and display all of your social media platforms. First, open your Blogger Dashboard, go to the “Layout” section and open the “Social Media” gadget.
Most common icons
Here are more most commonly used icons — to another platforms you may want to include in your “Social Media” gadgets on your blog.
- Create a new line in the code where you want to add the icon. Do not paste it after
</div>, because it will not be displayed correctly. Therefore, if you want to add it as the last icon in the list, you have to paste it before</div>. - Copy the code:
Facebook — <a href='LINK' target='_blank'><i class='fab fa-facebook-f'></i></a>
GoodReads — <a href='LINK' target='_blank'><i class='fab fa-goodreads-g'></i></a>
LinkedIn — <a href='LINK' target='_blank'><i class='fab fa-linkedin-in'></i></a>
Snapchat — <a href='LINK' target='_blank'><i class='fab fa-snapchat-ghost'></i></a>
SoundCloud — <a href='LINK' target='_blank'><i class='fab fa-soundcloud'></i></a>
Spotify — <a href='LINK' target='_blank'><i class='fab fa-spotify'></i></a>
Tumblr — <a href='LINK' target='_blank'><i class='fab fa-tumblr'></i></a>
YouTube — <a href='LINK' target='_blank'><i class='fab fa-youtube'></i></a>
- Replace “LINK” with the link to your social media account. Do not delete the quotation marks! Tip: Copy it directly from the browser.
- Save the widget!
More icons
If the icon you want to add is not in the list above, do not worry — you can add your own.
- Create a new line in the code where you want to add the icon. Do not paste it after
</div>, because it will not be displayed correctly. Therefore, if you want to add it as the last icon in the list, you have to paste it before</div>. - Copy and paste
<a href='LINK' target='_blank'>— this creates a link that opens on a new page. - Replace “LINK” with the link to your social media account. Do not delete the quotation marks! Tip: Copy it directly from the browser.
- Go to Font Awesome page and find the icon you’re looking for.
- Underneath the name of the icon you can see its category, icon version, shortcode and the HTML code, which looks something like this —
<i class='fab fa-blogger'></i>. - Click on it — this copies the code.
- Go back to the open social media widget where you’re adding a new icon — and paste the code.
- Copy and paste
</a>— this closes the link to your new icon. - Save the widget!
Is this not what you were looking for?
Perhaps you need a different tutorial. Return to the main Tutorials page and also browse through our Troubleshooting pages and FAQ for most common solutions.