Support » Themes and Templates » Publish » Hide title tagline in desktop mode only

Viewing 6 replies - 1 through 6 (of 6 total)
  • you will need to add a media query to hide the title and tagline when site is displayed over a certain size.

    You will probably want to look at the theme’s existing css to see where the “break points” are for desktop display so that everything changes together, but it will look something like:

    @media (min-width: 800px) {
    .site-tittle, .site-description {
    display: none;
    }
    }

    paulwpxp

    (@paulwp)


    Font hero


    Use CSS clip, for SEO and site accessibility.

    @media only screen and (max-width : 901px) {
    	.site-title,
    	.site-description {
    		position: absolute !important;
    		clip: rect(1px 1px 1px 1px); /* IE7 */
    		clip: rect(1px, 1px, 1px, 1px);
    	}
    }

    Thanks a lot JHill & Paul!

    – Paul’s code works the other way around though: it hides title/description in Mobile mode.
    – JHill’s code works fine for the site-description, but keeps showing the site’s title.

    Suggestions?

    And (details..) the logo and title/description don’t align very well:
    imgur.com/oabtN6E.png
    I think I prefer hiding the logo in Mobile view.

    Merci deluxe!

    paulwpxp

    (@paulwp)


    Font hero


    – Paul’s code works the other way around though: it hides title/description in Mobile mode.

    Change max-width to min-width.

    of course.. so simple. Tried that before, but probably had some other code bugging this part.

    However, I’m afraid it still doesn’t work for me, because it now meshes up the menu by pushing all menu items into the left column: http://i.imgur.com/ppRul6i.jpg

    paulwpxp

    (@paulwp)


    Font hero


    Yes, the code works for Publish theme as is.

    It works for official theme demo.
    http://wp-themes.com/publish/

    It might not work for a modified version of the theme, or one with other adjustment in child stylesheet.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Hide title tagline in desktop mode only’ is closed to new replies.