As an initial caveat, the site was built by a previous employee and I am just picking up the pieces as it were, we are working on a complete site redesign as a seperate project, but I’m trying to tidy up these little issues in the meantime.
I’m looking to change the below social media icons on our website:
I can find the appropriate module in the content editor as part of the ‘Global Header’ as well as finding it in the template editor, with it name listed as ‘{{ Social Connections’, with the CSS Class showing as ‘socialIcons topsocial-icon’. However when I go to edit this module, be it in the content editor or the editing the HTML source in the template editor, all it shows is this code in both instances:
Which of course is fine to change the actual links, but not to change the icons. As you’ll likely notice, the Twitter icon is actually pushing to our Instagram, but again, no obvious way to see how to change it.
Any thoughts?
Many thanks
Si
Hey @CA-Marketing-SP this is really down to how the original template was created, each one can be created in various different ways so it’s impossible to tell from just a screenshot. My best guess however is that these are added in via CSS in your stylesheet using something like font awesome.
If this is the case, you’ll need to access the stylesheet which is adding these in and change the code in your line of css to use an updated icon (font-awesome have a list here).
You’ll need some experience with stylesheets and finding these to update this so you may want to reach out to your web developer to get this updated!
Thanks for your quick response Tom. Typically I can’t see that any CSS or Stylesheets have been added, although I’m purely checking via the settings in our account:
Hey @CA-Marketing-SP there’s definitely some stylesheets attached somewhere, there’s a few different places within HubSpot these can be added, the knowledgebase has a helpful guide on these here!
Thanks for your help here. I eventually found where I needed to be after I explored your mention of Font Awesome. Found the code I needed in the overall template css, then once I figured out that I needed to replace the Font Awesome unicodes with what I wanted, that did the job.
All changed and working well.
Cheers
Si
