Home Forums Weaver Xtreme Theme More than one header area

This topic contains 19 replies, has 2 voices, and was last updated by  weaverfan 3 years, 10 months ago.

Viewing 16 posts - 1 through 16 (of 20 total)
  • Author
    Posts
  • #17476

    weaverfan
    Participant

    Hello,

    how can I use 2, 3 or more header areas simultaneously at one page?
    #20577

    scrambler
    Moderator

    You need to be more specific about what you mean and actually want to accomplish.

    There is only one header widget area that can be placed in various location, but that widget area can have any number of widgets arranged any number of ways (especially if you have plus with custom widget width), so within it you can create any layout you want.

    If you need a group of widgets in different location within the header, you can then use the various HTML insertion area for that. You can create your own widget layout within them. I have a generator below if you need complex widget layouts that are responsive and adaptive and you don’t wish to code them

    http://forum.weavertheme.com/discussion/9939/responsive-and-adaptive-columns-and-widgets-layouts-generators#latest

    Or if you are not using all of extreme Widget areas (like top / bottom…), you can use one of them with a per page widget area and a widget area shortcode as explained in Item B of the thread below

    http://forum.weavertheme.com/discussion/11220/weaver-xtreme-tips-and-tutorial-part-5

    If that does not answer your question, please provide a link and be more specific about what you wish to accomplish

    #20578

    weaverfan
    Participant

    a) I am trying to have 3 header pictures per page like this jpg:

    b) I want to define the header pictures per page. For example page 1 with header pictures a,b,c and page 2 with header pictures d,e,f.
    #20579

    scrambler
    Moderator

    Given they are on top of eachother, Is there a reason you cant just make them one big image for each page?

    Then simply select that big image as the featured image for the page and use the option to make the featured image replace the header image for that page.

    #20580

    weaverfan
    Participant

    This is impossible because one of them has to be a slideshow at some pages. At one page for example header 2 is the slideshow and at another page header e.

    #20581

    scrambler
    Moderator

    You then have several possibilities.

    You can use an HTML Insertion area on a page by page basis using the page custom Field, and put all your header images and slideshow in that area.

    If you are not familiar with page custom Fields read: http://forum.weavertheme.com/discussion/1281/custom-fields-on-pages-what-to-use-them-for-and-how-to-use-them

    As far as choosing an HTML insertion area look in the layout below: http://forum.weavertheme.com/discussion/10340/weaver-xtreme-layouts-and-insertion-areas-visualization

    Or you can use the Header Widget area with one widget for each header image (layout as one column), then create per page widget areas for each page that needs different content, and use the widget area replacement in the page options to replace the default header widget area by any of the per page widget are you define.

    #20582

    weaverfan
    Participant

    I tried it with the Header Widget area and it worked but I have a problem with the shadow. After I added the class wvrx-fullwidth there is no more shadow on the right and on the left side. But I need the grey full-width background. How can I get the shadow?

    Here is the screenshot:
    #20583

    scrambler
    Moderator

    I can quite figure out things with just that picture, we need a link to the page to really see how things are with details about what you are trying to do

    wvrx-fullwidth will extend the shadow if it is on the container where the class is, not if it is on a sub container.

    #20584

    weaverfan
    Participant

    The link is sekosgelnhausen.de. The site is under construction so you have to fill out the username 7890 and the password 454545

    #20585

    scrambler
    Moderator

    Interesting configuration…

    This is a case where what you want to do is not extend the header widget area container full width, as that goes over the wrapper’s border, so remove the wvrx-full-width class

    What you want is use XTreme Full Width BG feature on it.

    As the header widget area does not have the Full width BG box options, you need to use the custom CSS provided by weaver below with a few additions
    http://forum.weavertheme.com/discussion/9712/extending-bg-to-full-browser-width#latest

    .is-desktop #header-widget-area {
      position: relative;
      overflow:visible;
    }
    .is-desktop #header-widget-area:before {
        content: “”;
        position: absolute;
        top: 0;
        bottom: 0;
        left: -9999px;
        right: 0;
        border-left: 9999px solid #595A5B;
        box-shadow: 9999px 0 0 #595A5B;
        z-index:-1;
    }

    .is-desktop #branding {z-index:auto;}

    #20586

    weaverfan
    Participant

    Yes, I need a full width background. I tried it with the css in the custom css rules. But there is still no shadow. Can you tell me, what did I do wrong?

    #20587

    scrambler
    Moderator

    Sorry I had a typo in my branding rule the proper syntax is below.

    .is-desktop #branding {z-index:auto;}

    #20588

    weaverfan
    Participant

    Sorry, but it’s again the same one… 🙂

    #20589

    scrambler
    Moderator

    ???

    #20590

    weaverfan
    Participant

    Now it works. Sorry, but it is now late in Germany… Thank you very much!

    #20591

    weaverfan
    Participant

    I’m still searching how to use a third header. I’m looking for a solution to have one more header between the green one above and the image with the people. This header image has to have a full width background too. Do you have an idea how I can solve this?

    Here is a draft:
Viewing 16 posts - 1 through 16 (of 20 total)

You must be logged in to reply to this topic.