Home>Support>Issues with Influence theme on mobile

Issues with Influence theme on mobile

By Stine Friis Hals, 9 years ago. Last reply by Andrew Misplon, 9 years ago.

Hi!
I’m really happy with the Influence theme, but I am having some problems with the mobile version. The menu keeps showing up below the white bar on top. Is this because I made the bar smaller, and is it any ways to make the menu align better? The header text aligns to the bar – so I hope there’s a chance the menu will too.
If this is not possible to achieve – can I hide the menu just in the mobile version?
Also some of my headings get cut with like one letter. So the entire title is in one line – with the last letter on line two, which looks a bit weird. Is there any possibility for the font size to be smaller when there’s not enough room?
This is a blog, and half the readers come from mobile devices. So I really want to give them a good experience!

URL: http://www.stinefriis.com

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 9 years, 1 day ago Andrew Misplon
    Hi, I Work Here

    Hi Stine :)

    The problem is coming from the following rules in your Custom CSS:

    #masthead.site-header.has-shadow {
  height: 5px;
  position: fixed;
}

.site-header .site-title a {
  position: absolute;
  line-height: 5px;
  font-size: 20px;
  font-family: playfair display;
}

    If you remove those two the problem will be resolved.

    It doesn’t look like your importing Playfair Display so those rules aren’t working. Would you perhaps like to choose a font from https://www.google.com/fonts ? We could help with that.

  2. 9 years, 1 day ago Stine Friis Hals

    Hi, Andrew

    Thanks for responding so fast! I’ll check out the custom css, but also I really like the line beeing slimmer. Have to make up my mind regarding that.

    I thought the font was all set, but apparently is isn’t then. Haha! As far as I know playfair display is a part of the google fonts. But if you could guide me I’d love to know how I set it up properly.

  3. 9 years, 1 day ago Andrew Misplon
    Hi, I Work Here

    Thanks for the info.

    1. Head to Appearance > Customize > Fonts and choose Playfair Display from the two drop down menus in that section.
    If you don’t have Customize > Fonts then go to Appearance > Influence Plus and upgrade at no charge.

    2. To adjust the site header padding, insert the following at Appearance > Custom CSS:

    /* Site Header */

.site-header {
    padding: 25px 0;
}

    Adjust the padding value as required.

  4. 9 years, 1 day ago Stine Friis Hals

    Thanks! Now I think everything is running smoothly. And the sub-headings also look right.

    thank you so much! It will look much better on both screen and mobile now :)

  5. 9 years, 1 day ago Andrew Misplon
    Hi, I Work Here

    Awesome :) Glad to hear your site is looking better.

    All the best.

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More