Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #23661

    Hi,

    I want to add telephone number in between the space where you have logo and the social media icons. Please help.

    I am using enfold and currently using the ‘ Header with social media icons and bottom’ – Header Type.

    Thanks in advance

    #120696

    Hi,

    Edit header.php then find this code

    $phone = avia_get_option('phone');
    $phone_class = !empty($nav) ? "with_nav" : "";
    if($phone) echo "<div class='phone-info {$phone_class}'><span>{$phone}</span></div>";

    Cut that and place it below this code

    echo avia_logo(AVIA_BASE_URL.'images/layout/logo.png', false, 'strong');

    Add this on your custom.css or Quick CSS

    .social_header .phone-info {
    font-weight: bold;
    height: 30px;
    line-height: 10px;
    right: 200px;
    top: 40px;
    position: absolute;
    }

    .social_header .phone-info.with_nav span {
    border: none;
    }

    Cheers,

    Ismael

    #120697

    Hi,

    The code above placed another logo on the top right hand side of the website. Here is what I want:

    I want to add some text carrying phone number, Cart sign etc on the empty white space that exist between the top left logo and the social media icons.

    Here is a link to my site:

    http://tinyurl.com/oj6mp9n

    Regards,

    MK

    #120698

    Hi,

    You didn’t follow the instructions correctly. Cut this code

    $phone = avia_get_option('phone');
    $phone_class = !empty($nav) ? "with_nav" : "";
    if($phone) echo "<div class='phone-info {$phone_class}'><span>{$phone}</span></div>";

    Now, paste it under this code which is the code responsible for the logo.

    echo avia_logo(AVIA_BASE_URL.'images/layout/logo.png', false, 'strong');

    Add this on your custom.css to position the phone number correctly.

    .social_header .phone-info {
    font-weight: bold;
    height: 30px;
    line-height: 10px;
    right: 200px;
    top: 40px;
    position: absolute;
    }

    .social_header .phone-info.with_nav span {
    border: none;
    }

    Regards,

    Ismael

    #120699

    Hi i have done this and it works. however, in mobile mode.. the number clashes with the logo.. how do i edit the css to shift it downwards in mobile responsive mode

    #120700

    Hi anyone?

    #120701

    Hi!

    Try following code

    @media only screen and (max-width: 767px) {
    #header_meta {
    min-height: 45px;
    }
    }

    Best regards,

    Peter

Viewing 7 posts - 1 through 7 (of 7 total)
  • The topic ‘Phone number bwtween logo and social media icon sppace’ is closed to new replies.