Responsiveness isn't applied with my Lodestar site

  • Unknown's avatar
    journeyofchampions · Member ·

    My site doesn’t look good on mobile devices even though the site should be responsive. What should I do to fix this issue?

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

  • Unknown's avatar
    musicdoc1 · Member ·

    Hi,

    The Lodestar theme is responsive, and your site looks not unlike the Lodestar demo on a mobile screen. The main difference that I see is that on the demo the site title and tagline extend the height of the visible portion of the header image a bit compared to yours, which evidently has the site title and tagline hidden.

  • Unknown's avatar
    musicdoc1 · Member ·

    Perhaps you could explain in which way or ways you find that your site doesn’t look good on mobile devices.

  • Unknown's avatar
    musicdoc1 · Member ·

    Lodestar is listed among the responsive layout themes in the WordPress.com Themes Showcase. Therefore, unlike an older theme which would require enabling the mobile theme as described in the Mobile Themes support page, no enabling is required for Lodestar.

    Your site tests positively at Google’s Mobile Friendly Test site.

  • Unknown's avatar
    journeyofchampions · Member ·

    I see what you’re saying. The site does work in one sense.

    What concerns me most is how my blogs look on mobile; in particular some of the titles and some of the words in post. Instead of the site shrinking the word to fit its own space, it will separate the word by letter. Its just horrible to look at.

    check this out for ex. https://wp.me/p2wfie-15j

    Second, but not that important, is the loss of the parallax feature on home page when viewed on mobile.

  • Unknown's avatar
    journeyofchampions · Member ·

    Thanks for taking the time to respond! Appreciate it :)

  • Unknown's avatar
    musicdoc1 · Member ·

    You’re welcome, and my regards to the little slugger!

    All sites such as your with paid plans include access to live chat support. See the Live Chat Support support page, and particularly its How to Access Live Chat Support section, or go directly to the Contact Us page and follow the instructions there for chat support.

    What concerns me most is how my blogs look on mobile; in particular some of the titles and some of the words in post. Instead of the site shrinking the word to fit its own space, it will separate the word by letter.

    I see what you mean. On both your site and the demo I find that on some mobile devices words in the site titles are sometimes broken up. I’ll call for staff attention to the topic. Staff will respond here, but it may be easier for you and more expeditious to use the live chat option.

  • Unknown's avatar
    musicdoc1 · Member ·

    Oops! I meant “post titles,” not “site titles.”

  • supernovia · Staff ·

    Hi, live chat can likely answer this just as quickly, but I think in this case maybe you might want to make the titles slightly smaller on mobile. You can do that with CSS. You can also use CSS to force the words not to break.

    Try adding this via Customize > CSS, for example:

    @media screen and (max-width: 500px) {
  h1.entry-title {
    word-break: keep-all !important;
    font-size: 1.5em;
  }
}

    That way when the screen is narrower, the font sizes will shrink a bit. We’ll do our best to keep all words together without breaking or hyphenating them at all in titles, too, though if the word is still too long to fit the line, it will break, and you would need a smaller font size still.

    And, as @musicdoc1 mentioned, you’re entitled to chat when you need it, so please do reach out here if you need more help:

    Contact

  • The topic ‘Responsiveness isn't applied with my Lodestar site’ is closed to new replies.