Preview doesn't look like the wordpress screen
-
Hi,
I'm having trouble designing my page:
-
The page it never looks different on the "edit page" and then when I click on "view page" some spacings look different (sometimes it looks like its enough but then in the preview there's a lot more spacing than on the preview) so I'm wondering if there's a better way to visualise the page exactly how it will look?
-
When I click on "Live editor" I see the mobile version that was automatically created but some spacings are not accurate with the desktop version that Im designing. Is there a specific reason? Spacings between text blocks look weird too.
-
Is there a way to add one image on top of the other? I would like to add a texture to a background a then a mockup on top of it but I don't know how to choose putting images to the back and to to the front (I'm using the "offset" stuff but it doesn't always work, specially for mobile.
Thanks!
-
-
Dear @lauramas
Can you post a link to our website?
Then we can have a look and inspect that.Best!
Marius
-
http://0a93771b692224691.tempsite.link
thank you! -
Just some quick guessings / answers:
- That’s true and totally fine the way it is, because spacings are percental. Which means the preview rendering looks different because the viewport is way smaller. (Because of the sidebars and interface around the layout area etc.)
- That’s because the standard spacings for mobile are used. You can set these in
Lay Options / Gridder Defaults. These are the basic settings that are used to generate your mobile (and desktop) views. - That’s absolutely doable: just right click in the row (pink area) you want the image to be the background of and choose
Set Row Image Background.
To put normal images in the back is only possible by placing them in the rows below or above each other an then rearrange them with the offset to overlap (which is to tricky to do though). You could add some custom CSS to define z-indexes though.
On mobile view all the offsets get reset, though – I assume that’s because the percentages for the different screen sizes would lead to weird results.
Hope that helps to understand the system a wee bit better.
Cheers!
PS:
There doesn’t seem to be anything on the link you sent…
PPS:
@mariusjopen please correct me if I’m wrong with any of the above… -
Before you post:
- When using a WordPress Cache plugin, disable it or clear your cache.
- Update Lay Theme and all Lay Theme Addons
- Disable all Plugins
- Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"
This often solves issues you might run into
When you post:
- Post a link to where the problem is
- Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
- If the problem is difficult to explain, post screenshots / link to a video to explain it