WordPress.org

Ready to get started?Download WordPress

Forums

Publish
Hide title + tagline in desktop mode only (7 posts)

  1. siedui
    Member
    Posted 1 year ago #

    I just read Hiding the blog's title
    Is there a css code for hiding the Tagline too?

    In fact I'd like to hide the title + tagline in the desktop view only. Is this possible?

    (ps I'm using Jetpack for custom CSS)

  2. JHillDesign
    Member
    Posted 1 year ago #

    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;
    }
    }

  3. paulwpxp
    Font hero
    Posted 1 year ago #

    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);
    	}
    }
  4. siedui
    Member
    Posted 1 year ago #

    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!

  5. paulwpxp
    Font hero
    Posted 1 year ago #

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

    Change max-width to min-width.

  6. siedui
    Member
    Posted 1 year ago #

    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

  7. paulwpxp
    Font hero
    Posted 1 year ago #

    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.

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic