Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].
I have searched for help with this but can’t find a solution.
I’m using Vantage free theme and I love it. The header, slider, footer, mobile menu, all work fine.
However, the body of the page is a mess when viewed on my phone.
The page title goes to 2 lines (which is fine) but the words run up into each other.
The entire page is about one word wide all the way down. Any lists are shown one character wide.
It displays this way on every browser I tried.
I have read several threads here and tried the suggestions but to no avail.
I have disabled plugins to test but no change.
I have cleared caches, changed W3 Cache settings, etc. but can’t get the page to look right on my phone.
Can someone please help me figure this out?
Nothing? I realize that priority goes to paid members but is there nobody who can help me? I love Vantage and don’t really want to have to change themes. It just won’t display properly on phones.
Just an update.
I deactivated all WordPress plugins except Site Origin ones. The site still does not display correctly on my phone.
Hi In2Blues,
Unfortunately, we’re unable to timely assist with all free support requests due to the very high volume. As such, it’ll take some time for us to reply to all threads. This is sadly unavoidable for us (it’s simply down to limited manhours), but you can jump to the front of the queue by purchasing Download: SiteOrigin Premium
Regardless of the above, the issues you’ve highlighted are due to widget settings and content structure. For example, the custom page title you’ve added using the SiteOrigin Headline widget appears like that due to the line-height – it’s 1.4em. To increase this amount, please open the SiteOrigin Headline widget and open the Headline settings group. Set the line-height field to 2em. How does that look? You’ll likely want to fine-tune this setting to get the desired amount of spacing. Alternatively, you can increase the FitText Compressor setting which will make the text resizing more aggressive which should allow for the text to appear solely on one line.
Regarding the paragraphs (the text you added to SiteOrigin Editor widget), that’s happening due to paragraph margin. Consider using a single-spaced lines (shift + enter) rather than a double-spaced line (enter) to avoid this. If you want to forcefully override this with CSS, you can but it’s not something we would recommend.
If you navigate to AppearanceCustom CSS, you’ll get our custom CSS editor. Add (and adjust) the following CSS:
.entry-content p { margin: 1em 0; }You might also need to install the SiteOrigin CSS Editor.
Hi Alex,
Thanks for your reply. I understand what you said about free support.
I tried your suggestion about line height and played with the settings but didn’t like the results. So I changed the FitText Compressor from 0.85 to 1 and it looks fantastic on mobile.
I also discovered the problem with the paragraphs. I had an 80px left and right margin set to reduce the width in desktop view. Unfortunately, it really looked terrible in mobile view. So, I deleted that setting and it looks perfect on mobile. The desktop is a little wider than I like but it’s fine.
Thanks for your help.