Mitran,
Thanks for the kind words, glad you like the theme!
I’ve put together a child theme for you that will add an HTML5 phone link that will dial when clicked on a mobile device. Download the child theme.
To activate the child theme:
- Visit your site’s dashboard
- Go to the Appearance menu
- Click on the “Add New” button at the top of the page
- Click on the “Upload Theme” button at the top of the page
- Click on the “Choose File” button
- Select the tracks-child.zip file you downloaded from the link above
- Click the blue “activate” link
The last step is to change the random phone number used to your own phone number.
To do this, go to the Editor screen under Appearance in your dashboard. Make sure you’re looking at the Tracks child theme, otherwise use the dropdown in the top-right to select it. Then choose the header.php file on the right-side of the screen. In that file locate the two places where the phone number shows and replace it with your own number.
Let me know if you need any assistance with those steps, I’m happy to help.
Thread Starter
mitran
(@mitran)
Thank you so much Ben! You have just made my day!
With all the great support you have given to me and others, I believe people will spread the words around for your theme and especially for the kindness in you.
I always believe that the more you share, the more you have!
Wish you all the best in life Ben!
Thread Starter
mitran
(@mitran)
Hi Ben,
Is that a chance you can help me to customize one more thing? I would like to write Contact Us 416 -416- xxxx and 1-866-873-9755. It means that I want to write something before the phone number and I want to add the toll-free number as well.
Sorry for the inconvenience, I should have told you at first.
No problem, thanks so much for the review you left!
Right now the phone number looks something like this:
<a href="tel:+13174562564">317-456-2564</a>
To add your updates, change it to this:
<span class="phone-link">Contact us <a href="tel:+13174562564">317-456-2564</a> and <a href="tel:+13174562564">317-456-2564</a></span>
You’ll just need to switch out the numbers and it should be good to go 🙂
EDIT
One more thing, add this to your child theme’s CSS:
.phone-link a,
.phone-link a:link,
.phone-link a:visited,
.phone-link a:hover,
.phone-link a:active,
.phone-link a:focus {
color: white;
}
You can add it by going to your Editor menu under Appearances in your dashboard, and pasting it into the bottom of the stylesheet you see there.
Thread Starter
mitran
(@mitran)
No Problem, Ben! I just left a review for what you should deserve.
Thanks for your quick reply.
I have followed your instructions but unfortunately, the header looks so weird and I don’t know where to fix it.
May you take a look at my website?
Thread Starter
mitran
(@mitran)
Thread Starter
mitran
(@mitran)
Besides, when you helped me to add the phone number in the header, I can not use the social media functions in the header or footer anymore.
Is that a chance I can keep both?
Hmm that changes things a bit, but yes you can have both. Let’s simplify and just start from the top.
I’ve got another child theme here that I’ve just tested and works with the social media icons. You can delete the one you’re using now and replace it with that one.
The numbers are random again and will need to be updated, but besides that it should work.
Thread Starter
mitran
(@mitran)
Thanks Ben for all the help. It works very well!
You’re welcome, I’m happy to help 🙂