Staff replied SP Page Builder

Front-end editor doesn't match what is displayed in browser/device

Asked by Christopher Collins 4 years ago Last activity 4 years ago

Another issue that I have come across is that when editing in the front-end, it does not accurately reflect what is displayed in the browser or device. The element positionings are way off and I'm having to go back and forth and tweak items multiple times, until they are fixed on the browser but messed up looking in the front-end. Is there something I'm missing here?

Desktop - front end editor
https://paste.pics/HHIUD

Desktop - browser
https://paste.pics/HHIUJ

Tablet - front end editor
https://paste.pics/HHITH

Tablet - browser
https://paste.pics/HHIU3

Mobile - front end editor
https://paste.pics/HHIXP

Mobile - browser
https://paste.pics/HHIXA

5 replies

Ofi Khan Staff

4 years ago

Hello Christopher Collins

Apology for the inconvenience. Please share your administrator access and the specific page link here to check the issue. Use the Hidden Content box to share the credentials. Make sure that you have a full site backup with you before sharing.

Best regards

Christopher Collins Asked this

4 years ago

I put the info as requested.

Ofi Khan Staff

4 years ago

I have found the view same as frontend editor. You might be checking responsiveness using a third-party site. Please check on the inspect browser option or in the real devices.

Tablet View: https://prnt.sc/54l-CjJmXwTJ
Tablet View in Frontend Editor: https://prnt.sc/uK4dbEBG6npB
Mobile View: https://prnt.sc/di1KZxhemqts
Mobile View in Frontend Editor: https://prnt.sc/cUaDi105eSvh

Christopher Collins Asked this

4 years ago

I cleared my caches and these are desktop screenshots from my computer (the front-end editor in Edge)
https://paste.pics/HI27O

and this is the site in Google Chrome.
https://paste.pics/HI28B

this is the site on Edge (not in the front-end editor)
https://paste.pics/HI2DL

Mobile view front-end editor
https://paste.pics/HI2AL

Site on iPhone
https://paste.pics/HI2BI

Clearly on my end these views are different from what the front-end editor is portraying. I am currently not able to use the front-end editor because it does not match what is being shown in the browser window. This is costing me hours of dev time going back and forth with the backend editor and clearing caches on the other browsers.

I installed the update for Helix today hoping that might help. Should I reinstall SPPB pro? I am on a deadline and really need to get this sorted.

Ofi Khan Staff

4 years ago

I am not sure about your issue. When I check, I get the same view on the frontend and preview. The issue is only on your end. I think Google Chrome has the right view. Please check frontend editor on Google Chrome.

In the docs