Support » Theme: Tracks » Add phone number in the header of the page

  • Resolved mitran

    (@mitran)


    Hi Ben,

    I love this theme so much and I like the way the simplicity of the theme create perfection.

    There is only 1 thing which I want to customize for the theme. It is adding my business number in the header of the page and make it hyperlink. It means that if a user sees the website on phone, they can simply click the phone number on the home page without going anywhere.

    I am honestly new to WordPress so I do not whether or not my requirement is possible to do. If not, I totally understand and still consider your theme one of the best.

    Thanks for your support!

Viewing 10 replies - 1 through 10 (of 10 total)
  • Theme Author Ben Sibley

    (@bensibley)

    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:

    1. Visit your site’s dashboard
    2. Go to the Appearance menu
    3. Click on the “Add New” button at the top of the page
    4. Click on the “Upload Theme” button at the top of the page
    5. Click on the “Choose File” button
    6. Select the tracks-child.zip file you downloaded from the link above
    7. 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.

    Theme Author Ben Sibley

    (@bensibley)

    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?

    Theme Author Ben Sibley

    (@bensibley)

    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!

    Theme Author Ben Sibley

    (@bensibley)

    You’re welcome, I’m happy to help 🙂

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘Add phone number in the header of the page’ is closed to new replies.