Adding two clickable phone numbers to header contact info

#1

Hi Guys,

I would like have two phone numbers in the ‘header contact info’ of my site -
http://www.boardinglounge.com.au.

I would like both phone numbers to be clickable on mobile devises.

Is this possible to do? If you could help that would be great!

Thanks.

#2

Hello,

First, please add the first number as usual in Customize > Rocked Pro options > Header contact info section.

Then you can try to use the following CSS code in order to add the second number right after the first one.

You can add CSS code in Dashboard → Appearance → Customize → Additional CSS.

.header-contact .header-phone::after {
    content: '+1 (555) 555-5555';
    margin-left: 10px;
}

Also you might want to check this tutorial:

Please feel free to ask any other questions that you might have.

Kind Regards, Roman.

#3

Thanks Roman,

I need to have the name of the branch in front of each of the phone numbers. I have added the word ‘Coomera’ successfully in front of the phone number in the Rocked Pro Options however when I add the second branch ‘Currumbin’ in front of the second phone number in the code you gave me the number is not clickable.

I would also like the phone symbol (without the box around it) in front of the second contact as well.

Also, how do I make each phone number appear on separate lines on mobile e.g. one underneath the other?

#4

Hello,

It looks like these issues require some coding and testing on different screen resolutions, this goes beyond our support policy. It’s considered advanced customization. As an option, you can contact Codeable for this kind of service, or find a reputable freelancer on Upwork.

Kind Regards, Roman.

#5

No problems, thanks Roman.

#6

You are welcome, and thank you for understanding.

Kind Regards, Roman.

closed #7