Mobile Vew title help for Independent Publisher theme?

  • Unknown's avatar
    lindsaydell · Member ·

    Help!

    My

      site title

    is getting broken in the mobile version on an iPhone 5s. What CSS could I add to make the title a little smaller so it stays on one line?

    I’m using the

      independent publisher theme

    and am hoping to make a few tweaks so I can upgrade to a business plan, transfer my domain name, and share this site widely in a couple of days. The current url is:

    http://lindsayhpassmore.wordpress.com.

    Many thanks in advance for help from any and all of you!

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

  • Unknown's avatar
    thesacredpath · Member ·

    Hi there, since there isn’t a space, the software can’t figure out where to break the title, so it just peels off the last letters as needed. We can make the font size of the site title smaller for narrower screens with CSS, but that would require the WordPress.com Premium Plan or WordPress.com Business plan upgrade.

    You can try out and preview custom CSS before you buy as explained here. This would be the CSS. 

    @media screen and (max-width: 400px) {
#hero-header .site-title {
    font-size: 2.0rem;
}
}
  • Unknown's avatar
    lindsaydell · Member ·

    Thank you! I added a space after the colon — which really doesn’t belong in my title, but I see the need for it here — and also put in the CSS.

    This theme actually does have a little CSS editor that you can use without the premium upgrade. I will be upgrading in a few days as soon as my domain gets transferred to my new registrar anyway. But I’m glad I don’t have to wait for it to look proper on mobile devices anyway. This is perfect!

  • Unknown's avatar
    thesacredpath · Member ·

    It sounds like you are going self-hosted, and there are forums specifically for self-hosted WordPress users at http://wordpress.org/support/ . For your self-hosted site, it is best to ask there as there are some things you can do with self-hosted that you cannot here at WordPress.com.

    Glad that worked out for you.

    If you have not yet done so, I would suggest creating a child theme so that any customizations you make will not be overwritten by a future theme update. Alternately you can use the Edit CSS function in the Jetpack plugin, or use one of the other Custom CSS plugins that will keep CSS changes from being overwritten.

    Child Themes
    Child Theme creation plugins
    Jetpack plugin
    Custom CSS plugins

  • The topic ‘Mobile Vew title help for Independent Publisher theme?’ is closed to new replies.