Need help? Check out our Support site, then


Header Options

  1. Hi,
    As you see on mobile, that there is a header, that stays in the heading area (as normal). I wanted the menu to be a sticky menu (on mobile) since this already happens on desktops. I hope you can help me out.

    Thanks,
    Jamie.

    The blog I need help with is realsimpleway.com.

  2. Try this code in the custom css

    .header-small {
        position: fixed !important;
    }

    Also it looks like you are hosted on Peer1 hosting. These forum are for WordPress.com site. I think you are looking for WordPress.org support which can be found here
    https://wordpress.org/support/

    Here is an article explaining the difference between WordPress.com and WordPress.com
    https://en.support.wordpress.com/com-vs-org/

  3. Hi,

    Thanks! I use WordPress.com, so I don’t have to worry about that. Thanks for your help. I wanted help from a Happiness Engineer/Staff, do they could better understand our problem, and our issue.

    Thanks,
    Jamie.

  4. You might need to write a media query for that also I only tried it in the inspector on my browser.

    so something like
    @media only screen and (max-width: 768px) {
    .header-small {
    position: fixed !important;
    }
    }

  5. Thank you! It helped! I appreciate your help with me today :)

  6. Can you also please make the header menu much smaller on desktop + be able and make it shorter on mobile with some CSS as well please?

  7. For desktop, find this in your custom CSS and change the max-height to 90px.

    #header{
        max-height:90px;
    }

    Then add the following two rules.

    #header.header-large .menu-container {
        padding-top: 30px;
        padding-bottom: 30px;
    }
    .content.no-thumb, .no-thumb {
        padding-top: 80px;
    }

    Then for mobile, add the following and see what you think.

    @media screen and (max-width: 1024px) {
        .content.no-thumb {
            padding-top: 0;
        }
    }
  8. Hi! It worked for desktop, but not for mobile. Thanks for that CSS. Please help me out.

    Thanks,
    Jamie

  9. When you say, mobile, are you talking about the height of the header, or the height of the menu itself after you click on the menu button?

  10. The Height of the Header.

  11. The height of the header on your site, as I see it now, looks good. Did you get this resolved? I looked at it on iPhone and Android device and they look the same.

  12. Hi,

    Thanks! It is good :) So, ad your looking on your iPhone, you will see that the site title is too big for the logo and title to fit in one line. Is there a way to decrease the size for: ONLY for the site title, and ONLY for mobile?

    Thanks!
    Jamie.

  13. Hi there, I'm not seeing a logo, only a site title and the menu icon when viewing on mobile. The following will allow you to adjust the site title only on mobile (I've used 480px as the media query break point). You can adjust the 20px value as desired. Originally it was 28px.

    @media screen and (max-width: 480px) {
    	.site-title a {
    		font-size: 20px;
    	}
    }
  14. Hi,

    As you go on the website, on a mobile device (maybe computer) you will see the difference. The site logo, is above the title, which I don’t like.

    Can you please help me out?

    Thank you!

  15. Hi @realsimpleway, could you get a screenshot of what you're seeing?

    Also, have you considered using the text in your logo image itself? That way you'll have more control over it.

  16. Hi,

    Sure! Here is a screenshot;

    blob:https://wordpress.com/fcfd661b-c940-43e9-a047-385a4baeece7

    We didn’t use the text in the logo, since we don’t feel confident in it.

    Thanks,
    Billy!

  17. That link wasn't formed correctly.

    If you want the text to align with the logo in a particular way, you will want to include it with the logo.

  18. Hi,

    Thanks. Can I please get some CSS help on how to change my site header title color(s) (Navigation Menu, and Site title) to change the colors? Currently, it’s dark purple.

  19. Are you unable to change that in Customize > Colors ?

  20. Hi,

    You can change it in the Customizer? If so, can you show me the steps to get the color changed for the site header color,

  21. That's where the purple is coming from anyway. Normally that's under Customize > Colors.

    It may be different though with your other configurations. I can't log into your site because the membership plugin is causing issues for us, but if you can temporarily turn that off we can find the exact steps for you and test to see whether it works with your current plugins and settings.

You must log in to post.

About this Topic