SP Page Builder Pro comes with tons of functionalities that make your everyday web development life way easier. It has been introducing new and new features with every update. Among all these features, some fall through the crack and we don’t even know that these functions exist. In this article, we are going to see 10 SP Page Builder features that might miss your eyes.

  • Production mode
  • Access Control Level
  • Custom CSS for elements
  • Popup in form
  • Library system
  • Frontend page modification
  • Frontend menu assignment
  • Integration
  • Open Graph support
  • Page SEO settings

1. Production Mode

SP Page Builder production mode stores the CSS code generated by all the addons in a web page into a single CSS file. By doing so, it significantly reduces the website loading time. When the Production Mode is enabled, all the CSS code will automatically be stored in a separate CSS file. To enable this mode, go to System > Global Configuration > SP Page Builder > Production Mode > Yes.

10 Secret Features of SP Page Builder

To better understand the application of this mode, have a look at the normal state of a website where we will experiment this feature. 

10 Secret Features of SP Page Builder

In the above screenshot, you can see the CSS code generated from all the addons reside in the <head> tag, but when the Production mode is enabled, they are stored in a separate CSS file.

10 Secret Features of SP Page Builder

So you see, a new CSS file is automatically created to store the CSS code generated for the webpage. When used for the first time, this may cause a delay in reflecting your latest page customizations on the live site - because the cached CSS file may still be in use. To address this issue, use the Purge CSS button from the SP Page Builder settings to remove the cached CSS in one-click. This can be done from Joomla backend > System > Global Configuration > SP Page Builder > (turn ON Production Mode) click on Purge CSS button.

10 Secret Features of SP Page Builder

2. Access Control Level

When running a website you might want to restrict some of the users from accessing a certain part of your content. Or, you want to share a business secret to only your registered users. Access Control List (ACL) is designed to take care of that. It’s a Joomla feature using which you can take the complete control. Since it’s a Joomla core feature, you can create the user group from Joomla backend > Users > Groups > Add New Group then start adding users to your new group. Finally, create an access level for the user group from Joomla backend > Users > Access Levels > Add New Access Level > give a Title and assign your newly created user group.

The restriction can be applied to any webpage created with SP Page Builder and any of its addons. There are two ways to apply the settings: frontend and backend.

Set webpage access level from (backend method) Page > Options > Publishing > Access, then choose the access level you created for the user group from this dropdown list.

10 Secret Features of SP Page Builder

Set addon access level by (frontend method) opening a page on Frontend editor > click on your desired Addon > browse to Advanced tab > choose your Access level from the list.

10 Secret Features of SP Page Builder

3. Custom CSS for an Element

In case you didn’t know, SP Page Builder also lets you apply your own styling with custom CSS. That’s why there is a Custom CSS option for you. You can apply custom CSS to any SP Page Builder addon. To do so, open a page in edit mode > select the desired addon > scroll to the bottom of the General Tab > define a name to CSS Class.

10 Secret Features of SP Page Builder

Then, select the Style tab > scroll to the bottom to Custom CSS > write down your CSS.

10 Secret Features of SP Page Builder

4. Popup in Form

The Opt-in Form addon has this amazing functionality using which you can show a popup in a form. This is extremely useful when you want some info from your users in a nice manner so that they don't feel bothered at all. You can do this by using the Opt-in Form addon. In the General tab of the addon, find Form Type, in the dropdown, you’ll see “Popup Form”.

10 Secret Features of SP Page Builder

This will open up the relevant settings. You can set the time in/time out value and popup width. You can add a bit of styling and a little animation too during the popup to make it more interesting. 

5. Library System

Among all the features of SP Page Builder, this one is my personal favorite - the ability to save my work for later use. SP Page Builder has this amazing functionality that lets you save any modified addon and/or any section that you might want to use later. This library system saves your work and allows you to simply drag and drop to get your design in action. You can save a section/addon by clicking the “Save” button. Refer to this article for more details. You’ll find the addons in SP Page Builder frontend edit mode > Tools > My Addons. And choose My Section for the saved rows.

10 Secret Features of SP Page Builder

6. Frontend Page Modification (Create/Delete/Empty Content)

The big plus sign on the bottom of the left sidebar in SP Page Builder frontend editor lets you create a new webpage right away.

10 Secret Features of SP Page Builder

Sometimes you might want to drop everything from a webpage and that’s possible with a single click in SP Page Builder. Just click on Empty Content in Frontend editor > Tools > Empty Content.

10 Secret Features of SP Page Builder

When you need to delete any webpage, you can do so from Frontend editor > Pages > click the delete button. There are also separate buttons for page preview and edit.

10 Secret Features of SP Page Builder

7. Frontend Menu Assign

After creating a new page, in most cases, it is important to assign the page to a menu item. What if you can do both from the frontend? We already know how to create a page on frontend, let's see how to assign them to menu items. Open the page in Frontend editor mode, click on Tools from the left sidebar. You’ll be presented with the following settings. Choose Add to Menu.

10 Secret Features of SP Page Builder

The menu settings will open up and you need to provide the details. Then click on Add to Menu button to complete the process.

10 Secret Features of SP Page Builder

8. Integration

SP Page Builder not only allows you to beautifully design web pages. It also lets you customize (modify) certain features of Joomla. Let's take Joomla article for instance, you can only do so much with the native article creation. You cannot give the article an interactive design. You cannot present the content the way you want to. But SP Page Builder's Joomla article integration lets you use SP Page Builder in a Joomla article. That way you have all the SP Page Builder's functionality on a Joomla article. Click here to know how to enable article integration

SP Page Builder's integration is not limited to Joomla article only. You can edit your items with SP Page Builder. In a recent version of SP Page Builder, SP Simple Portfolio integration was introduced as well. More on this here

Screencast: Editing a typical project after SP Page Builder integration

9. Open Graph Settings

The open graph settings give you control over what your page looks like when sharing on social media. You can set an image that describes the webpage most. You can also change the title and page description from the same place. You’ll find the Open Graph Settings when editing a page at the top bar. Click on Options and you’ll be presented with the following screen.

10 Secret Features of SP Page Builder

This is will open up the Open Graph Settings from where you can input page title, description, and image.

10 Secret Features of SP Page Builder

10. Page SEO Settings

We don’t need an introduction on why an SEO friendly website is so important these days. To make your website SEO friendly you need to improve the SEO settings page by page and how do you do that? You do it by opening a page in the frontend editor > click on Tools on the left sidebar > now click on Page Settings. Here’s how it looks like.

10 Secret Features of SP Page Builder

By doing so, you’ll be provided with three sections, choose SEO among them. Here you’ll find the SEO settings as well as Open Graph setting that determines how the page looks on a social share.

10 Secret Features of SP Page Builder

Here are the top 10 feature that is less popular but has some very useful functionality. Using them more and more will boost up your productivity. Everyone has some personal favorite, what about you? Tell us about your most favorite SP Page Builder functionality in the comments below.

Try SP Page Builder for FREE!    Get SP Page Builder Pro Rate on JED