Viewing 17 posts - 1 through 17 (of 17 total)
  • Author
    Posts
  • October 3, 2018 at 10:03 am #1017424
    sere

    Hi,
    I try to find an example to insert a title in the header with a widget, but I have not found what I need.

    Title in the HEADER (logo left + widget right + menu below) … I don’t find this example
    https://www.dropbox.com/s/c5tdhkz6ryuhsth/header.png?dl=0

    Title in the Shrinking Header, with title blu and smaller
    https://www.dropbox.com/s/dpxejy8yu38w0uc/Shrinking%20Header.png?dl=0

    Title in mobile menu
    https://www.dropbox.com/s/icu5kj4g1ygj0rn/mobile%20header.png?dl=0

    Can you help me?

    October 3, 2018 at 11:51 am #1017480
    Rikard

    Hey Serena,

    I’m not sure I understand what you are asking, do you want to add a widget to the header? If so then please refer to this: https://kriesi.at/documentation/enfold/header/#adding-a-header-widget-area

    Best regards,
    Rikard

    October 3, 2018 at 3:58 pm #1017553
    sere

    Hi Rikard,
    I try to follow this instruction, but the result is this

    https://www.dropbox.com/s/3vigp0o66jhbcc7/header_w.png?dl=0

    and not this

    https://www.dropbox.com/s/c5tdhkz6ryuhsth/header.png?dl=0

    October 4, 2018 at 6:04 am #1017693
    Vinay

    Hi,

    The layout you are looking to create is similar to https://kriesi.at/documentation/enfold/example-of-widget-area-next-to-the-logo/

    If you follow the instructions correctly the widget text should appear next to the logo. You can add the text and custom style the text.

    Please make sure you have cleared the cache to view the changes https://kriesi.at/documentation/enfold/how-to-clear-the-cache/

    Best regards,
    Vinay

    October 8, 2018 at 10:39 am #1018901
    sere

    Sorry Vinay, but I have the menu below not left like this example.

    October 8, 2018 at 8:10 pm #1019183
    Victoria

    Hi sere,

    Could you please give us a link to your website, we need more context to be able to help you.

    Best regards,
    Victoria

    October 11, 2018 at 10:51 am #1020261
    sere

    Hi Victoria,
    this is the link

    October 12, 2018 at 4:53 am #1020567
    Rikard

    Hi,

    Thanks for that, though it looks good on my end already. What I see is what I see in the screenshot in private. Is that correct or not?

    Best regards,
    Rikard

    October 12, 2018 at 9:04 am #1020641
    sere

    Hi Rikard, yes but only in home page because I add the Title in a Layer Slider. But in the header of the other pages and in the Shrinking Header there isn’t the title. I want to add the title also in this header, like this example:

    https://www.dropbox.com/s/dpxejy8yu38w0uc/Shrinking%20Header.png?dl=0

    And in the mobile like this:
    https://www.dropbox.com/s/icu5kj4g1ygj0rn/mobile%20header.png?dl=0

    I find the example with “widget area next to the logo”, but with menu at right, and I need the menu below.

    October 12, 2018 at 11:55 am #1020685
    sere

    Ok, I managed to fix it.
    There is only the problem of the Shrinking Header, that now I have disabled.
    There is a css style to change it?

    Thanks

    October 15, 2018 at 8:55 am #1021462
    Rikard

    Hi,

    Thanks for the update, though we will need to see that actual problem on your site in order to give you accurate CSS. I see that the widget is blue on pages which are not the home page, is that the only problem? If not then please activate the shrinking header again.

    Best regards,
    Rikard

    October 15, 2018 at 9:18 am #1021468
    sere

    Hi Rikard the widget blu in the other page and white in the home page is right!
    I’d like to active the shrinking header, but the problem is that the widget is biggest for it. There is a css to change the style of the widget only in the shrinking header? I didn’t find it.

    Thanks

    October 15, 2018 at 10:55 am #1021491
    Rikard

    Hi,

    You have this CSS, probably in Quick CSS:

    .page-id-10 #header .widget {
    color: #FFF !important;
    text-shadow: 1px 1px 6px #000000;
    top: 55px;
}

    If you remove .page-id-10 it will apply globally. You can try to target the after scroll state with CSS like this:

    .header-scrolled #header .widget {
    color: #FFF !important;
    text-shadow: 1px 1px 6px #000000;
    top: 55px;
}

    Best regards,
    Rikard

    October 15, 2018 at 11:11 am #1021501
    sere

    I have this css fot the normal header widget:

    #header .widget {
  left: 54%;
  padding-top: 0px;
  position: absolute;
  top: 55px;
  transform: translate(-50%);
  z-index: 999;
text-align:center;
color:#0095d5 !important;
font-size:18px;
font-weight:bold;
line-height:21px;
}

    this for the header widget of the home page (I need this for the trasparency page, there is a code fot this case? so I can remove ID and put the trasparency style)

    .page-id-10 #header .widget{
color:#FFF !important;
    text-shadow: 1px 1px 6px #000000;
  top: 55px;
}

    And this for tablet and mobile, where I use meta header.

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

@media only screen and (min-width: 990px){
#header_meta{
    display: none !important;
}
}

@media only screen and (min-width: 1024px){
#header .widget{
font-size:23px !important;
line-height:25px !important;
}
}

    The last code I need is for scroll state. I try to add this, but it doesnt’ work

    .header-scrolled #header .widget {
   font-size:12px !important;
   top: 20px !important;
   line-height:15px !important;
}
    October 16, 2018 at 4:54 pm #1022264
    Victoria

    Hi sere,

    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

    
.page-id-10 #header.header-scrolled #text-12 {
    top: 15px;
    width: 90%
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    October 17, 2018 at 9:45 am #1022653
    sere

    Thanks Victoria, it’s perfect!!!

    October 17, 2018 at 5:09 pm #1022905
    Jordan Shannon

    Hi,

    I’m glad this was resolved. If you need additional help, please let us know here in the forums.

    Best regards,
    Jordan Shannon

  • Author
    Posts
Viewing 17 posts - 1 through 17 (of 17 total)
  • The topic ‘Header title widget’ is closed to new replies.