Home / Forums / DynamiX Support / creating a topbar for phone number and content above header like infobar

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts

  • ASHLEY COE WENDLAND
    Participant

    Hi, I have been playing with multiple ways to add a phone number to the left and some content to the right on same line at the very top of my site ABOVE my header which contains menu and logo.

    I used some advice from 2013 you gave a person about shortcode from visual composer and pasting the code in customization HTML shortcode area. This advice has put the top bar on the top of the header but not above the logo and menu header.

    This advice would work but I want the top bar to be a different color than my header. The header and top bar kinda mesh together this way also.

    the other way I tried is using the info bar using CSS custom for changing the background color which at default is the link color and then using the info bar setting offered on each page which I used this on my front page. This got the top bar above the header but now I can’t use the visual composer shortcode for positioning elements etc.

    When I mixed the two options here by adding the shortcode into the info bar it puts my content in 2 vertical columns instead of horizontally phone number on the right and content on the left

    Just want a clean top bar for content and phone number. Like this with separate background color from header
    <left side of site>Proud to serve yad yada<lots of space>right side of page<phone number>

    I can do this by using just info bar but then i can’t space out my content like VC elements and I’m afraid if i use lots of spaces then it won’t be responsive

    I hope this all makes since

    Thanks


    ASHLEY COE WENDLAND
    Participant

    Am I able to use VC to do my layout then take the text or shortcode and paste it in the infobar on my front page?
    I tried this and it is putting my content in the 2 left columns and displaying my content vertically.

    Thanks


    ASHLEY COE WENDLAND
    Participant

    I fixed the issue with the vertical content. it was the setting in VC to Stretched row I set to default and it made my content horizontal.

    take a look at my infobar at http://www.wendlandmasonry.com the very top you will see the font awesome icon is down low and also the height is not matching the content size for a nice 50px bar. the info bar in mobile view look bad too. the icon is not with the number.

    any help or direction will be appreciated. Ive been on this for quite some time

    Thanks

    Hi @coew1167

    It looks like you installed a plugin or a code that prevents right-clicking or F12 on your site, so I can’t check the site’s code.

    Can you please send over your login credentials so I can disable this plugin and check what’s causing this?

    Thanks!


    ASHLEY COE WENDLAND
    Participant
    This reply has been marked as private.

    Hi @coew1167

    Please copy and paste this CSS into Theme Options > Customize > Custom CSS

    .vc_row.wpb_row.row.vc_custom_1490924258818 {
        margin-bottom: 0;
    }
    
    span.infobar-close {
        visibility: hidden;
    }

    This will decrease the height of the bar then hide the close button.

    You can decrease the height further if you use smaller fonts on the phone number.

    Regards,


    ASHLEY COE WENDLAND
    Participant

    Hello, Is there a fix for the span.infobar-close? the visibility: hidden; only hides the element and still takes up space.

    Reason is my content is not center on PC or smartphones.

    Thanks

    Hi @coew1167

    Try to use this CSS instead:

    span.infobar-close {
       display: none;
    }

    Regards,

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.