Add phone number to header next to social media

[sphereteam]

hi,

Can you please tell us how to add a phone number next to social media icons on right hand side. Here is our site: http://www.sphereco.co/spheredev2/
I have added a screenshot to the post to show you where i want the phone number to appear.

thank you in advance.

[sphereteam]

hi, can you please give me an update?

[Veena]

Pls add the below line of code at line no:63 of file header.php

<div id="phonenum"><?php echo'99999'; ?> </div>

And use the below custom CSS in themeoptions –

 #phonenum {
    position: relative;
    float: right;
    margin-right: 150px;
    top: 40px;
}

You may need to adjust these values.

[sphereteam]

hi, thank you for the code. It looks good, however, when in mobile device it looks different. Is there any way to display phone numbers right below the logo? Right now if you look at the picture, the phone numbers are being displayed on menu bar.

thank you for your prompt response.

[Veena]

Pls use the below custom CSS –

@media only screen and (max-width: 767px){
#phonenum {
    display: block;
    text-align: center;
    position: relative;
    top: 0;
}}

[sphereteam]

hi, thank you for you fast response. The css code works great, but the text does not align and i would like to have the text between the logo and social media icons. Can you please tell me if its possible?
See image attached.

http://www.sphereco.co/spheredev2/

[Veena]

Pls use this modified custom CSS-

@media only screen and (max-width: 767px){
#phonenum {
    float: none;
    display: block;
    text-align: center;
    position: relative;
    top: -60px;
    margin-right: 0;
}
#header .social-container {
    top: 40px;
}
}

[sphereteam]

Thank you so much, this is awesome!

[Author]

Posts