How can I get a TikTok icon in the top of the page. Theme: Singl

• 

  eriknymoen93 · Member · Nov 3, 2021 at 10:30 am

  • Copy link
  • Add topic to favorites

  I’m using the Singl theme and they have a lot of social icons on the top of the page. One of my clients wants to get TikTok there as well.

  Can someone help me with that?

  The blog I need help with is: (visible only to logged in users)

• 

  staff-totoro · Staff · Nov 3, 2021 at 7:01 pm

  • Copy link

  Hi there,

  The Singl theme was created before TikTok was around, so the theme settings lack the ability to add this icon (and there is not a setting to add custom icons) which makes it tricky to add a new icon like this.

  Because of this, I’d first recommend a more modern theme like this one: https://wordpress.com/theme/sigler/

  Our newer themes make use of the full feature set of the block editor, so you would be able to add TikTok as a social icon using this block for example: https://wordpress.com/support/wordpress-editor/blocks/social-links-block/

  If you are unable to switch themes, there is a workaround you could try using CSS. To do that, go to your theme options (where the other icons are set) and add your TikTOk URL to the setting for “Twitter” which will make the Twitter icon appear.

  Next you can add the following CSS to change the Twitter icon to a TikTok icon:

  .fa-twitter:before {
      content: url("https://serzomusic.files.wordpress.com/2021/11/tiktok-black-share-icon.jpg");
      display: block;
      padding-top: 2px;
  }
  

  Note that the other icons are vector art (much sharper) so this substitution method does work, but the JPG icon is not as sharp as the others. It’s the best that can be done with this older theme however.

  Hope this helps!