In Arcade theme can header appear in full when clicking on categories (top menu)

  • I had a custom header designed for my Arcade them wordpress site. It is great on the home page but if you click any of the categories you only see half of the header and the title is completely cut in two. Is there any way of resolving this so that the whole header can be seen (taing up less space than it does on front page, naturally) Also is it possible to move the “See More” button on Front Page?

    The blog I need help with is: (visible only to logged in users)

  • Hi there!

    It looks like the cutoff you described was happening on other pages as well (like “About” and not just categories.

    This CSS should be a good start – because of the responsive nature of the theme, and the way the header image adapts to various screen sizes, it may still get cut off a bit here and there, but it should be much better!

    body:not(.home) img.header-img {
     top: -100px !important;   
    }
    
    body:not(.home) .title-card{
        height: 400px !important;
    }
    
    @media screen and (max-width: 910px) {
        body:not(.home) img.header-img {
      		top: 0px !important
        }
    }

    Let me know how it looks!

  • Also is it possible to move the “See More” button on Front Page?

    Yep!

    Take this style:

    #more-site {
        margin-top: 50px;
    }

    And increase the 50 to push the button down the page. I’m assuming you wanted it moved down :)

  • Hi Marie,

    This css should do the trick with your banner image:

    body .title-card-wrapper .title-card {
    	min-height: 100vh !important;
    }
    
    body .title-card-wrapper .title-card img {
    	top: 0 !important;
    }

    It might still be slightly wonky, depending on browser width, but it will mostly be okay.

    Let me know how it looks :)

  • chad; tried that but what its done is move image so now im seeing the top of it on subsequent pages but not the bottom. I see the word’ raw’ and half the word ‘woman’ Other ideas. Will attempt other option..

  • Nope … that doesn’t work either . In fact ‘body’ on second line and ‘img’ same line are coming up red. I think that means there’s something wrong there anyway. Do I need to reset anything else on CSS page… ie Pixels?

  • OK. My mistake grvrulz. Missed a line of code. I now have a full image on every page. A relief to say the least. But I would prefer to cut it at the neck just below the head of the woman so that it doesn’t occupy full page on anything but the home page. Otherwise its kind of overwhelming. Would love to crop the graphic as much as possible without losing head of woman and tiny bit of neck and see all the words. Possible?

  • Almost like cutting a little more than a third of the full image off the bottom.

  • Or about a third. I think you’ll see what I mean if you look at it. Anyway feeling good. Like this could actually be accomplished. Thanks.

  • Almost like cutting a little more than a third of the full image off the bottom.
    Or about a third. I think you’ll see what I mean if you look at it. Anyway feeling good. Like this could actually be accomplished. Thanks.

    Try adding this to the CSS @grvrulz gave you :)

    body:not(.blog) .title-card {
        margin-bottom: -33vh;
    }

    Should give you a tall image on the front page, and then two-thirds height image everywhere else

  • That worked! only one more thing. Now the ‘See More’ Button has disappeared from front page! Now that all this other stuff is resolved, I definitely want it there. How do I get it back?

  • Under My Site > Customize > Static Front Page, you should either select “Your Latest Posts” or chose a static front page :)

    Right now you’ve set it to display a static front page, but you haven’t actually selected one, so you’re kind of in the middle between the two options.

  • The topic ‘In Arcade theme can header appear in full when clicking on categories (top menu)’ is closed to new replies.