To add Tiktok Icon next to Site Title, like this.
#1. Use this code to Custom CSS box.
If code doesn’t work, you can comment below, message or email me.
div.header-title-text {
display: flex;
align-items: center;
}
a.second-button {
width: 30px;
margin-left: 20px;
}
#2. Use this code to Code Injection > Footer. Remember to change Tiktok URL.
<script>
window.tiktokUrl = 'https://tiktok.com/';
window.tiktokIcon = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M448 209.9a210.1 210.1 0 0 1 -122.8-39.3V349.4A162.6 162.6 0 1 1 185 188.3V278.2a74.6 74.6 0 1 0 52.2 71.2V0l88 0a121.2 121.2 0 0 0 1.9 22.2h0A122.2 122.2 0 0 0 381 102.4a121.4 121.4 0 0 0 67 20.1z"/></svg>';
function createSocialIcon() {
let siteTitles = document.querySelectorAll('#site-title');
siteTitles.forEach(function(siteTitle) {
let link = document.createElement('a');
link.href = window.tiktokUrl;
link.className = 'second-button';
link.innerHTML = window.tiktokIcon;
siteTitle.parentNode.insertBefore(link, siteTitle.nextSibling);
});
}
document.addEventListener('DOMContentLoaded', function() {
createSocialIcon();
});
</script>
