Add phone number to header next to social media

Support Forums for LiveMesh Themes & Plugins Forums Squash Theme Support Add phone number to header next to social media

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #26749
    Sphereteamsphereteam
    Participant

    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.

    Attachments:
    #26758
    Sphereteamsphereteam
    Participant

    hi, can you please give me an update?

    #26759
    VeenaVeena
    Moderator

    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.

    #26794
    Sphereteamsphereteam
    Participant

    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.

    Attachments:
    #26811
    VeenaVeena
    Moderator

    Pls use the below custom CSS –

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

    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/

    Attachments:
    #26816
    VeenaVeena
    Moderator

    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;
    }
    }
    
    #26819
    Sphereteamsphereteam
    Participant

    Thank you so much, this is awesome!

Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Add phone number to header next to social media’ is closed to new replies.