Viewing 16 posts - 1 through 16 (of 16 total)
  • Author
    Posts
  • June 5, 2015 at 1:00 am #454852
    brooks

    HI

    Can you tell me how to add the phone number to the left of the menu items on my homepage (Between the logo and the menu items).
    I want it to look the same as it does above the menu items.

    Thanks
    Mike

    June 5, 2015 at 6:50 pm #455244
    Elliott

    Hey brooks!

    Do this, http://kriesi.at/documentation/enfold/adding-a-widget-area-to-the-header/, and let us know when your done and we’ll give you some CSS to position it.

    You can drag a text widget to the new widget area and add your phone number in that way.

    Regards,
    Elliott

    • This reply was modified 8 years, 10 months ago by Elliott.
    June 5, 2015 at 7:47 pm #455270
    brooks

    Elliot, thank you!

    Ive added the widget. Can you provide some css to position. The phone number was 24px.

    Cheers

    June 5, 2015 at 7:50 pm #455272
    Yigit

    Hi!

    Please add following code to Quick CSS 

    #header .textwidget {
  font-size: 24px;
}

    Regards,
    Yigit

    June 5, 2015 at 7:54 pm #455277
    brooks

    Added. Did nothing

    June 5, 2015 at 7:57 pm #455280
    Yigit

    Hi!

    I moved the code to the top of Style.css file and it worked. Please review your website now.

    Best regards,
    Yigit

    June 5, 2015 at 8:23 pm #455292
    brooks

    Thanks Yigit!

    How do I centralize between the menu and the logo?

    As a side note, what going on with the style.css and having to place the code at the top?

    Cheers!

    June 8, 2015 at 5:39 am #455704
    Rikard

    Hi!

    Please try adding the following as well:

    #header .widget {
  left: 30%;
  transform: translate(0%);
}

    Regards,
    Rikard

    June 8, 2015 at 6:52 pm #456287
    brooks

    Thanks Rikard – Works well!

    Only problem, it clashes with menu and logo on mobile. Is there a way around this? Maybe get it to not display?

    Thanks

    June 9, 2015 at 6:46 am #456453
    Rikard

    Hi!

    Please use the following to hide it on mobile devices:

    @media only screen and (max-width: 767px) {
#header .widget {
display:none !important;
}
}

    Regards,
    Rikard

    August 27, 2015 at 5:03 pm #494328
    koszachos

    Hi Rikard,

    I followed the above instructions and works well. In fact as I needed to add an image rather than text I used the text widget and added the following in the Content area:
    <img src="http://domainname/locationoffile.jpg" />
    Anyway, what I would like to ask you is how to make it disappear when scrolling OR make it smaller similar to how the logo and menu work while scrolling down.

    Thanks

    August 28, 2015 at 8:34 am #494679
    Rikard

    Hi,

    I couldn’t see an image in the header on your site but you can try the following:

    .header-scrolled #header .widget {
display:none !important;
}

    Regards,
    Rikard

    August 28, 2015 at 9:05 am #494685
    koszachos

    Thanks for your reply Rikard, but this didn’t work. It looks like the correct code, my widget is called ‘header’. Have you got another idea what could work?
    Thanks

    August 28, 2015 at 5:34 pm #495024
    Yigit

    Hi!

    Can you please move the code Rikard posted to the top of Quick CSS field and check if that helps?

    Cheers!
    Yigit

    August 29, 2015 at 7:10 am #495191
    koszachos

    Alas, still not working.

    August 31, 2015 at 1:59 pm #495775
    Andy

    Hi!

    send us a link showing your header widget and we take a look.

    Regards,
    Andy

  • Author
    Posts
Viewing 16 posts - 1 through 16 (of 16 total)
  • You must be logged in to reply to this topic.