How Page Builder Sandwich Works

How-Page-Builder-Sandwich-WorksThis article will give a brief rundown on how Page Builder Sandwich works, and is intended to be a primer to those who are interested in how our page builder integrates into different things in WordPress. I won’t dwell into the individual features of Page Builder Sandwich, if you want those, head over to our videos page where we show off each feature individually with short screencasts.

If you want to know how Page Builder Sandwich is different from the other page builders out there, check out our article How Page Builder Sandwich Is Different from the Rest.

Where is the page builder?

Where is it? And what can I edit with it?

Unlike a lot of other page builders, Page Builder Sandwich lives in the front end of your website. If you’re in the back end, we have provided a “Frontend” button alongside the content editor buttons that will bring you to the front end of your page.

Page Builder Sandwich allows you to edit your posts, pages and custom post type content. It doesn’t however allow you to directly edit your aggregated frontpage blog posts, and other non-single areas in your site. Just think of it this way, if what you want to edit has a content editor in the back end (like “New Post” and “New Page”), then Page Builder Sandwich can be used. You can edit your individual pages and blog posts, and if for example you have a plugin that introduces restaurant menus or portfolio items, you can edit those as well.

While in the front end, we have placed a blue “Edit with Page Builder Sandwich” button in your adminbar. Just click that to start editing your page.

Direct content editing

With Page Builder Sandwich, we have made content editing as easy and pain-free as possible. Editing content, is straight-forward and easy, just click and type. It’s that simple.

The inspector

Introducing, the inspector

We have noticed that a lot of page builders have a lot of popups. Personally, I don’t like popups since they are distracting and they basically tell you “hey, stop what you’re doing until you fill up these fields first”. They destroy the flow of an otherwise smooth editing experience. Because of this, we have minimized the use of popups across the board, and instead we have created the inspector.

The inspector is a side-bar type area that contains all the formatting and layouting tools you will ever need. The inspector can be docked to the left or right side of your screen so that you can easily see what you are editing.

From the inspector, you can adjust various text properties like headings, font sizes, bold, italic, text colors, and plenty more. Aside from those, it also allows you to add images and create rows or columned content. It’s also capable of more advanced editing like adjusting rows into full-page width rows, row and column background colors, vertical content alignment, as well as margins and backgrounds. It’s quite powerful and you will find yourself using it for the most part.

Integrating with WordPress themes

Page Builder Sandwich by nature almost has no stylings included with it. When you are editing your content, the styles you see are mostly based off your theme.

Integrating with Shortcodes

Shortcodes are an important aspect in WordPress and most likely you will be using a handful of shortcodes in your site. Page Builder Sandwich handles these very well wherein your shortcodes will appear rendered in the front end. Shortcodes also remain editable, and the best part is, after you’ve edited your shortcodes, they will become rendered again along with your changes.

For convenience, you will be able to edit your shortcodes using the inspector. If you want more control, you will also be able to double-click shortcodes to edit them in raw form. Aside from this, all shortcodes available in your website is listed in the inspector for easy inclusion in your content.

No bloat

What about website bloat?

Who likes slow websites? Not us, and definitely not you. We have made sure that Page Builder Sandwich has close to zero impact in your website’s performance. When logged out, at the very least, only row and column CSS styles are enqueued, along with the necessary JS and CSS scripts for the shortcodes you have used are enqueued.

For developers

If you are a developer and you have shortcodes in your WordPress plugins, Page Builder Sandwich provides a Shortcode API so that you can easily provide your customers with fields for easy creation and modification of your shortcodes.

If you want to extend further the capabilities or integrate with some parts of Page Builder Sandwich, we also have a bunch of useful action and filter hooks that you can use.

Leave a Reply

Your email address will not be published.