Additional Social Media

Thanks for using Tracks!

It is possible, but it will take some custom code. If you’re up for it, I can point you in the right direction. Otherwise, I recommend codeable.io for finding help with WordPress customizations.

Dear Ben,

I am ready for that (although I don’t know PHP or so but i do have some programming background), I tried to look at the php files but unfortunately i cannot find where I can start it from.

Thanks!

Okay great, to do this you’ll want to first download an empty Tracks child theme (click here). Then, add an empty “content” folder in your child theme. Next, copy the “social-icons.php” file from the Tracks “content” folder into your child theme’s content folder.

At this point, your child theme’s version of the social-icons.php will be loaded. You can actually replace all the PHP logic in the social-icons.php file with plain HTML since you don’t need to dynamically include icons.

An icon font is being used for all of the icons, but you can use an <img /> instead for 500px.com.

Hi Ben I tried to add a new font (https://www.socicon.com/) to the site but, obviously, I failed to make it to work even i did modify the script.php and upload the whole package. I would like to use this font since I will provide better visual effect then upload a png, see if you can help me with that otherwise I will go with your suggestion with plain html! Thanks!

Okay it’s hard to say without seeing the code, but I would first make sure the font has been declared in the child theme’s style.css file.

Then, double check that your markup matches their example:

<a href="https://twitter.com/qimzu"><span class="socicon">a</span> @qimzu</a>

Currently, the social-icons.php has PHP that gets the user input and dynamically adds the icons, but you can hard-code in the values making things much simpler. The social-icons.php file in your child theme could simply look something like this:

<ul class="social-media-icons">
	<li><a href="https://twitter.com/qimzu"><span class="socicon">a</span> @qimzu</a></li>
	<li><a href="https://twitter.com/qimzu"><span class="socicon">a</span> @qimzu</a></li>
	<li><a href="https://twitter.com/qimzu"><span class="socicon">a</span> @qimzu</a></li>
</ul>

Using the child theme is a bit more work, but it will future-proof your changes. Otherwise, when you update Tracks will overwrite the changes you’ve made to it.