One of the latest HTML 5 child themes for StudioPress is named Centric Pro. In this post, i’ll answer a question relating to customizing the Centric Pro theme. Here’s the question:
Hi,
I would like to replace the arrow button on the homepage with a text button. Any ideas?
Thank you,
Tom
Here’s the default which uses the arrow:
If you open up the home.js file located inside the js folder of the Centric Pro theme, you’ll find this Javascript code:
What you need to do is change the code on line 8 so the entire code block looks like this:
Here’s the result:
Basically all we’ve done here is swap out the class for the arrow Dashicon with a class for the button. The class for the button will use your themes existing CSS to style the button so no extra CSS code is needed.
From this:
To this:
A simple and effective solution don’t you think?
Add Arrow Icon To Button
Another option is to add a arrow icon before your button text using Dashicons. Here’s the result first and then the code:
And here’s all the code:
Leave a Reply
You must be logged in to post a comment.