Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • January 2, 2018 at 1:39 pm #892474
    dinmix

    Hi
    I like to have an extra columns to my header so that I can add widget or text on the right side. Something similar to the attached file.
    http://i67.tinypic.com/2j5dwjr.jpg

    Is this possible?

    Best Regards
    Din

    • This topic was modified 6 years, 10 months ago by dinmix.
    January 3, 2018 at 1:27 pm #892812
    Victoria

    Hey dinmix,

    Here is a tutorial on how to do it

    Adding a widget area to the header

    If you need further assistance please let us know.
    Best regards,
    Victoria

    January 15, 2018 at 2:45 pm #897544
    dinmix

    Thanks Victoria

    I have followed the instruction and manage to get the text widget on the right. However, the text widget overlapped on the logo when view on mobile device. How can I make it break to another line. You can have a look here https://goo.gl/aTv3W7

    Best Regards
    Din

    January 17, 2018 at 11:12 pm #898746
    Basilis

    Hi,

    It will not work to make it a new line, you will still drop everything from the first user interaction.
    A suggestion for mobile, hide it on top and make it visible before the footer.
    User wants other information and it will also be a pain to align it properly and resize it.

    Best regards,
    Basilis

    February 21, 2018 at 6:34 am #915300
    dinmix

    Hi Basilis

    Mind sharing how I can achieve this?
    A suggestion for mobile, hide it on top and make it visible before the footer.

    I tried but cant get this to happen. Thanks.

    Best Regards
    Din

    February 21, 2018 at 2:08 pm #915443
    Victoria

    Hi Din,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    

@media only screen and (max-width: 767px) {
  .responsive #top #wrap_all #header {
    height: 130px;
  }
  #header #text-10.widget {
    right: -170px ;
    padding-top: 0;
    position: absolute;
    top: 45px;
  }
  #has-right {
    margin-left: 9px;
  }
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    February 21, 2018 at 3:02 pm #915483
    dinmix

    Hi Victoria

    Thank you very much. This is exactly what I was trying to achieve for the last few weeks.

    Once again, thank you.

    Best Regards
    Din

    February 21, 2018 at 3:29 pm #915505
    Victoria

    Hi Din,

    Glad we got it working for you! :)

    If you need further assistance please let us know.

    Best regards,
    Victoria

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