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].
When viewed on an iPhone some paragraph spaces become very large. Typically just the top of the page is effected. For example see: http://nswvisitorguide.com.au/orange-region/self-contained-accommodation-orange-region-o-r/
On an iphone this first happens below ‘A Colour City Apartments’ the space is such that most of the iPhone 6e screen is blank below this line.
Any help will be appreciated.
Hi John,
You can change this with some custom CSS. If you navigate to AppearanceCustom CSS, you’ll get our custom CSS editor. Add (and adjust) the following CSS:
h1, h2, h3, h4, h5, h6, p { margin-top: 15px; margin-bottom: 15px; }How does that look?
You might also need to install the SiteOrigin CSS Editor.
Thanks Alex, I have made the CCS changes you suggested. The problem however still exists when viewed on iPhone in both Safari and Chrome, however the problem goes when you switch to desktop view in both browsers. Have I taken up your time for nothing? If so, sorry.
Hi John,
As mentioned, you’ll need to adjust the CSS to your desired spacing. Regardless, please change the CSS to:
@media (max-width: 600px) { h1, h2, h3, h4, h5, h6, p { margin-top: 15px; margin-bottom: 15px; } }That’ll prevent the CSS from affecting your desktop after you’ve adjusted it.
Hello Alex, I have changed the CSS to the latest version as you suggested.
Sorry but the same problem continues unless one changes the view to full site.
I have attached a screen grab of the problem showing before (with space)
and as it should be (desktop view).
And in case you were wondering… yes I did clear all previous data on the phones and its is the same with both Safari and Chrome. I have also experimented with various settings.
Thank you for your help, John
Hi John,
I suspect it’s not working due to your page cache. To clarify, did you clear the page cache after adding (and altering) the CSS? You can clear your page cache by navigating to WP AdminSettingsWP Super Cache and open the Contents tab. Click Delete Cache.
Hi Alex, Thank you, yes I have cleared cache several times on WP Super
Cache as well as clearing both browsers. But I'm sorry to say the problem still exists. Do you think it could possibly an iOS problem or conflict when site is responsive? John
Hi John,
That’s odd. I’m still seeing the previous CSS. To clarify, did you change the CSS over? If so, would it be possible for you to create a temporary admin account for us so we can log in and take a look?
To clarify, no I don’t think either of those are the case.
This is a private message.
Thank you Alex, I appreciate all your trouble. Have set up your account however I need need your private email address please. John
This is a private message.
This is a private message.
Hi John,
Ah, you’re right. That’s weird – that definitely shouldn’t have happened. Can you increase the role for the account you created me so I can take a look over your settings and take a closer look at your setting?
Just to confirm, you reduced the margins, correct? To clarify, the provided CSS is using the default sizing and will need to be edited for it to take effect. So, for example, if you wanted 10px of spacing you would change the margins to 10px each. Which would look like:
@media (max-width: 600px) { h1, h2, h3, h4, h5, h6, p { margin-top: 10px; margin-bottom: 10px; } }Hello Alex,
Sorry, I intended that you would have admin access. That has now been done.
I feel a little better now that you agree that it's weird as well, but I have this underlying concern that I have stuffed something but hope not.
I have tried different settings and have tested the effects none of which change the iPhone spacing issue. In fact sometimes it's worse. So at the moment it is back to your original settings.
I hope you have more luck than me but I am now in the hands of an expert!
Regards, Chris
Hi Chris,
How’s that? Be sure to clear your browser cache before checking. If it doesn’t look as desired. Can you please clarify what text you’re specifically checking?
Hi Alex, Sorry I have been away, a typical page with the extra spacing issues on a smart phone is
http://nswvisitorguide.com.au/orange-region/self-contained-accommodation-orange-region-o-r/
Cheers, John
Hi John,
Thank you. To clarify, what areas specifically have extra spacing? I can’t seem to spot any obvious areas but that’s likely due to my unfamiliarity of your website.
Hi Alex,
I understand.
To help you see the problem I have attached 3 screen grabs off an iPhone but it is the same with Android phones too.
The massive spaces occur in the attached samples above the photo and between the heading and text on the first couple of listings. The rest of the listings below are fine.
We duplicated the content with another SiteOrigin Editor widget underneath.
When we do this the second one is always OK. On a phone scroll down to the second one to see how it should look.The problem occurs on all pages not just the link I sent you.
Thank you again for all your help and patience.
John
[image: Inline image 3][image: Inline image 1][image: Inline image 2]
Hi John,
Unfortunately, we’re currently unable to handle email attachments. Can you please upload the images to an image hosting site like vgy.me or imgur and send me a link to the image? Sorry about this!
No problems Alex, go to: https://goo.gl/photos/mvvB7S89fa85bqXD7
Cheers John
Hi John,
Thanks. Well, that explains why I’m missing it. I can’t actually see that on any of my test devices (two Android smartphones and an iPhone 6). I borrowed my brothers iPhone 5, oddly, I was able to replicate this issue.
This makes things tricky. Hm. Maybe it’s related to the Google ad just above the image of the house self-contained places. Hm. Can you temporarily remove that to see if that removes the spacing? If it does, please add it back and I’ll try and work out a cause for this.
Hi Alex,
The ad has been removed and the same issue remains with early couple of text listings.
But not with the duplicate widget below. How weird is that!
John
*REGIONAL SHOWCASE* ® Online Visitor Guides
PO BOX 8488 EAST ORANGE NSW 2800
Email <[email protected]>
http://www.NSWvisitorguide.com.au http://www.SYDNEYvisitorguide.com.au
Hi John,
Wait, hold up. Did you remove the entire widget? I can’t seem to see the image used in the first screenshot anymore. To clarify, that widget contained JavaScript used to add an ad which I suspect is causing the issue (at least for that specific widget). Hm. This might sound like a weird request but, can you try disabling all non-SiteOrigin plugins and see if this fixes the issue? You’ll need to clear all your caches after disabling your plugins.
If it does fix the issue, then try re-enabling your plugins one by one until the issue comes back. This procedure will help diagnose which plugin is causing the issue.
Once we know that, we’ll be able to look at what might be causing the conflict and either solve the problem or help you find an alternative plugin.
If that doesn’t help, can you please try temporarily changing to the parent theme to rule out the child theme as causing issues.
Thanks Alex,
I'll work through all those options and get back to you.
Cheers, John
Hello Alex,
*Very good news! *
Thanks to you and *your professional attention* the spacing *PROBLEM HAS
BEEN SOLVED!*
We followed your suggestions and worked through all the steps, through all the plugins and clearing the caches as we went.
I am not 100% sure but suspect that residual code from Mr Google may have been or contributed to the cause.
I am very grateful for all the help you have provided and now we are able to happily continue to use SiteOrigin with WordPress.
Your helpful service has given me yet another reason to recommend and help push SiteOrigin.
If ever I can return "the favour" please contact me. For example if you ever need a users input or to test a beta version it would be a pleasure to contribute.
Kind regards,
John
Hi John,
Great to hear that worked. I would recommend trying to add the code via an alternative method as you shouldn’t really have any issues adding the removed code.
Thank you Alex, good advice and will do. John