There is a default Follow Me module in HubSpot that directs users away from your site to your respective social media pages. Learn more about this module and how to add icons here.
We styled the icons in the Follow Me module, so by default they look like this:
You can add the social-icons
class to your Follow Me module to apply your theme styles:
If placed inside a White Content wrapper, the icons are white in color, automatically:
There are a few additional classes that you can add along social-icons
to change styles:
CSS Class | Sample (with the default colors) |
---|---|
social-icons theme | |
social-icons dark | |
social-icons white | |
social-icons full theme | |
social-icons full dark | |
social-icons full white |
You may probably find some limitations with the default Follow Me module. You cannot reorder icons by default or list different icons for different instances of the module. That's why we created our own customized module, named Act21 Social Icons, where you can add as many icons as you want, reorder, even add custom icons with custom colors:
The styling is the same as before — by default the icons look like this:
And you can apply the same classes we've shown on the Follow Me module above to change styles and make the icons more consistent with your theme, but this time you can add the classes in the module itself, where we included a Custom class field. This is great on Flexible Columns, where you cannot add CSS classes by default.
You can still add the classes using the default CSS class field:
Here are all the available options:
CSS Class | Sample (with the default colors) |
---|---|
social-icons theme | |
social-icons dark | |
social-icons white | |
social-icons full theme | |
social-icons full dark | |
social-icons full white |