WordPress.org

Ready to get started?Download WordPress

Forums

Untitled
[resolved] [closed] How to Remove the header from posts in Untitled Theme? (19 posts)

  1. kelibzon
    Member
    Posted 1 year ago #

    Hi guys! I am a bit new on WordPress. I installed the untitled theme for my blog earnsmartonline.com and currently, the header appears on all posts, which makes it to overlap with the featured image.

    I would like the header to be on the home page only but not on the posts (blog page). Each post should have the featured image in place of the header just like on this site that uses the same theme: allthingsebonybrown.com. Any simple way to fix this issue? I really appreciate your feedback :)

    Kelibzon

  2. Hi Kelibzon, I'm not able to see your site as it says it's down for maintenance. Is it possible to let me see it?

  3. kelibzon
    Member
    Posted 1 year ago #

    Hi Kathryn. Sorry, I had forgotten to remove the offline mode because of some changes I've been doing. But right now, it's online; please check it out and try to click on the posts.

    You'll realize the header appears just after the featured image and I would rather only the featured image appeared as the header and then the main header moved to the home page. I really appreciate your help!

  4. Thanks! This bit of CSS should hide the header on your single (individual) posts:

    .single .header-image {
     display: none;
    }

    An easy way to add this CSS without touching your theme is through Jetpack. Just activate the Custom CSS module if it's not already active, and paste this CSS there. This way, your CSS won't be overwritten when you update the theme.

    Let me know how it goes!

  5. kelibzon
    Member
    Posted 1 year ago #

    Hi Kathryn. Thanks for your great feedback! Now, where exactly do i paste this code. Is it under editor > single post (single.php) or how do i know if the custom CSS is active or not? Sorry if this sounds like a no-brainer but i am not very familiar with coding but I can edit it under guidance. Thank you.

  6. kelibzon
    Member
    Posted 1 year ago #

    I am trying to follow through the link you game me on custom css to fix this issue. I hope this will help out. I will keep you posted shortly.

  7. kelibzon
    Member
    Posted 1 year ago #

    Hi Kathryn. I have come across the following in the CSS editing window:

    /*
    Welcome to Custom CSS!
    
    CSS (Cascading Style Sheets) is a kind of code that tells the browser how
    to render a web page. You may delete these comments and get started with
    your customizations.
    
    By default, your stylesheet will be loaded after the theme stylesheets,
    which means that your rules can take precedence and override the theme CSS
    rules. Just write here what you want to change, you don't need to copy all
    your theme's stylesheet content.
    */

    Now, do I simply paste the code you gave earlier below this message?

    Thanks
    Kelibzon

  8. Now, do I simply paste the code you gave earlier below this message?

    Yes, exactly. :-)

  9. kelibzon
    Member
    Posted 1 year ago #

    Whaat! It has worked out like crazy :) I was a bit slow to effect the changes because CSS usually delicate and it messed me up a while ago.

    Now, one more thing: My header on the home page has some a black padding on the left side yet i uploaded an image, which should fit on the header window exactly (the image width is 1440px). I would like the header to cover that section from one end to the other end.

    Lastly, the post images (now appearing as individual post headers)seem a bit huge and a bit cut off at the top section. Is there a way of auto resizing this or how do i adjust that so that they appear as clear as those in allthingsebonybrown.com?

    Thank you!
    Kelibzon

  10. Hi Kelibzon, this code should stretch out your header image:

    .site-header img {
    	max-width: none;
    	width: 100%;
    	height: auto;
    }
    
    #masthead {
    	max-width: none !important;
    }
    
    #masthead #logo {
    	float: none !important;
    }
  11. If you also then want to re-align your menu, you can add this as well:

    .nav-wrap {
         float: none ! important;
         margin: 0px auto ! important;
         width: 1000px ! important;
    }
    
    .main-navigation {
         float: left !important;
    }
  12. kelibzon
    Member
    Posted 1 year ago #

    Thanks a bunch for the info Kathryn! A quick question: where exactly in the editor should I post the codes you just sent?

    Thanks again!
    Kelibzon

  13. esmi
    Forum Moderator
    Posted 1 year ago #

    At the bottom of your Custom CSS file.

  14. kelibzon
    Member
    Posted 1 year ago #

    Hi esmi. Thanks for your great input here:) I have pasted the code there and I can see a warning saying "Be careful when using important declaration".

    Di ignore this warning and save the changes?

  15. esmi
    Forum Moderator
    Posted 1 year ago #

    Yes.

  16. kelibzon
    Member
    Posted 1 year ago #

    Thanks a lot! This forum is extremely amazing with great experts. My issues are all solved. Did i mention all the codes Kathryn suggested worked out perfectly? My site is now looking awesome! In case of anything, I'll be back :D

    Cheers!
    Kelibzon

  17. esmi
    Forum Moderator
    Posted 1 year ago #

    Glad to hear that we were able to help. :-)

  18. theterminalpigeon
    Member
    Posted 7 months ago #

    Hi folks,

    Like Kelibzon, I'm running the Untitled theme for theterminalpigeon.com and only want post titles to appear on my home page, not on the blog page. I've tried the above solution but, devastatingly, it doesn't seem to be working from me!

    Any thoughts? Pulling my hair out!

  19. esmi
    Forum Moderator
    Posted 7 months ago #

    @theterminalpigeon: If you require assistance then, as per the Forum Welcome, please post your own topic.

    This 4 month old topic references an old version of WordPress.

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic