The Best WordPress Page Builder for Freelancers & Agencies?
Most WordPress page builders aim to be all things to all people — with mixed results.
Offsprout, a new white label website building platform, aims to separate itself from the pack and be the preferred choice for design agencies and freelancers.
The developers of Offsprout, former agency owners themselves, decided to create a system that would eliminate the redundant work and inefficiencies of building and managing client websites.
Their promise is to remove the drudgery from creating client websites and make it a faster, simpler, and more enjoyable experience.
In the end, they want to help you with more than just building websites. They want to give you the platform and tools that will save you time and help you build your business.
In the review, we’ll explore what Offsprout has to offer and whether it’s something you’ll want to consider for your own client website services.
Offsprout’s Main Features
The Offsprout family includes two free plugins and two premium add-ons:
Offsprout Page Builder(free WordPress plugin)
Offsprout Pro (premium version of Offsprout Page Builder)
Offsprout Theme (premium theme)
Template Sites for Offsprout (free WordPress plugin)
Offsprout Pro and Offsprout Theme can be purchased separately or together. They can be purchased together in the Offsprout Bundle package.
Offsprout Page Builder
The Offsprout Page Builder is a free plugin that’s available from the WordPress plugin repository. The plugin is the basis upon which all of the other Offsprout products are built, and it’s required to use Offsprout Pro or Offsprout Theme.
Listed below are its main features.
• Offsprout Page Builder is an easy-to-use, real-time, drag-and-drop website builder and editor.
• Offsprout works with pages, posts, and custom post types.
• Provides fast website development with centralized management of sitewide elements like fonts, colors, buttons, forms, testimonials, rows, columns, sections, and more.
For example, you can set a central color scheme, and reference it from any Offsprout module. This makes it much easier to make sitewide color changes from client requests. Offsprout even automatically generates different shades of the color.
• Includes many page building modules (e.g., text, headline, image, video, quote, button, list, icon, gallery, testimonials, tabs, accordion, logo, logo group, map, separator, features, embed, etc.) and templates (20+ page templates, 30+ row templates, hero areas, call to action, events, pricing, and more).
• Allows for central template libraries (both built-in and custom). With the free Template Sites for Offsprout plugin, agencies and freelancers can use the template libraries across all of their Offsprout client sites without having to import and export templates.
• Live Template Rendering lets you preview exactly how templates will look with your current site settings (i.e., using its colors and fonts), even before choosing them.
• Row and section backgrounds can include images (with image screens), gradients, and videos.
• Offsprout offers easy duplication of columns, rows, and modules.
• Offsprout provides mobile-friendly, responsive layouts. Edit and preview pages for desktop and mobile devices.
• Includes keyboard shortcuts for accessing common interface areas, as well as performing common functions (e.g., undo/redo).
• Offsprout’s builder toolbar contains a content navigator for easy access to page elements.
• A fully unbranded, white label builder that lets you customize client branding, logins, support documentation, and more.
• Because Offsprout is written with React (JavaScript library for building user interfaces), and all database interactions go through the WP API, it’s built with future compatibility.
Using React, developers can extend Offsprout by building their own module types. Offsprout says that developer documentation (that’ll let users extend Offsprout without React), as well as a starter plugin, are coming soon.
• Offers fast page loading with content rendered as plain HTML, instead of shortcodes. If you ever disable Offsprout, your site will still display readable content instead of the mess caused by shortcodes (a common problem of many WordPress page builders).
That said, shortcodes (i.e., from third-party plugins) can be used in any text area and rendered live in the editor.
• Offsprout offers the ability to add your own CSS.
Offsprout Pro
Offsprout Pro is a premium upgrade to the free Offsprout Page Builder plugin. Listed below are its main features.
• Additional module types include Slider, Form, Testimonials, Number Counter, Social Icons, and Blog Posts.
• Additional templates include blog posts, contact forms, social proof, landing pages, and more.
• With the Builder Role Creator, Offsprout Pro lets you define specific user roles and permissions for your clients.
For example, you can limit the module types that clients can add, what they can edit, templates they have access to, and whether or not they can even add new pages. This can keep clients from accidentally changing things they’re not supposed to.
And by limiting elements of the user interface, it can help reduce client training time. Of course, you also have the option of giving your clients as much control as they need.
• The Form Builder lets you create forms in real time. You can control notifications, the submit action, and manage form submissions.
• With real-time display accuracy, the Blog Posts Module lets you control what posts are displayed, how they’re displayed, and more.
• Offsprout Pro comes with a variety of page and section templates. That said, you can also create and save your own library of templates (e.g., page, row, column, module templates). Global templates — that can be edited once and updated sitewide wherever they are used, are also included.
Offsprout Theme
The Offsprout Theme raises the capabilities of Offsprout another level by turning it into a full website builder (and not just a page builder). That said, the theme is not a requirement, as both the free Offsprout Page Builder and Offsprout Pro work with any standard WordPress theme. However, using the theme with Offsprout Pro is highly recommended.
Listed below are its main features.
• The Offsprout Theme includes new module types: Navigation (custom styled menus) and Comments (comments section).
• Includes the Offsprout Site Grower, a wizard-like interface that lets you quickly build a brand new site in minutes, eliminating repetitive setup and work.
You just need to upload a logo, fill out some basic company and social profile information, choose page and template options, and then click Go. From there, the Site Grower automatically builds the site for you.
• Offsprout Structures
With traditional WordPress themes, content designs are predetermined, with perhaps just a couple of customization options.
Offsprout Structures let you easily build and edit sitewide content (e.g., headers, footers, hero areas, sidebars, etc.) with near unlimited customization choices. Then, you can assign your design elements (Structures) to any page or post you want. And when you assign a Structure as Global, you can update the element in one place, and have it automatically change wherever it’s used on the site. In this way, you can quickly create many designs and templates for the theme without using any code.
• The Offsprout Connector gives Structures even more power. It lets you connect text areas to the underlying site and post data. For example, you can connect to post data like post title and date, author data like author bio and image, company data, social profile URLs, and more.
This allows you to do things like design how your blog posts will be displayed, or how a call to action at the end of your posts might look. You just need to create it once and apply it wherever you wish.
Setting Up Offsprout
The Offsprout Bundle includes the free Offsprout Page Builder, Offsprout Pro, and the Offsprout Theme. Here’s how to install them:
Installing Offsprout Page Builder
Because the free Offsprout Page Builder is the basis on which all other Offsprout products are built, you’ll want to install that first.
1. In the WordPress admin, go to Plugins… Add New. In the keyword search field, type: offsprout page builder
2. Find the plugin in the search results and click Install Now. After it’s installed, click the Activate button.
You should now see a new menu item in your WordPress admin sidebar under Settings … Page Builder. You will also see a Page Builder tab on the WordPress page and post editors, as well as a Page Builder option when viewing pages and posts on the frontend of your site.
Installing Offsprout Pro
Offsprout Pro is a premium WordPress plugin. It can be purchased from https://offsprout.com/products/offsprout-pro/.
After purchasing Offsprout Pro, you’ll receive a link for downloading a .zip file containing the plugin.
1. In the WordPress admin, go to Plugins… Add New, and click the Upload Plugin button.
2. Click the Choose File button, and locate the plugin’s .zip file on your computer.
3. Upload the plugin and then click Install Now. After it’s installed, click the Activate button.
Installing the Offsprout Theme
Offsprout Theme is a premium WordPress theme. It can be purchased from https://offsprout.com/products/offsprout-theme/.
After purchasing the theme, you’ll receive a link for downloading a .zip file containing the theme.
1. In the WordPress admin, go to Appearance… Themes, and click the Upload Theme button.
2. Click the Choose File button, and locate the theme’s .zip file on your computer.
3. Upload the theme and then click Install Now. After it’s installed, click the Activate button.
Using Offsprout
After you’ve installed and activated the Offsprout products, you’ll see a new sidebar item in the WordPress admin under Settings… Page Builder. What you see here depends on the Offsprout products you have.
Initially, you’ll be greeted by the Welcome screen, along with an introductory video to the product.
By clicking the Installation link, Offsprout will automatically begin installing its built-in page templates.
Offsprout Pro
If you purchased Offsprout Pro, you’ll see a Pro link under Settings… Page Builder.
Offsprout Pro provides new features beyond the free Page Builder plugin, such as:
• Advanced user management
• Posts module
• Form module
• Number counter module
• Social icons module
• Slider module
Click the Pro License link to enter your license key for the Pro version of the plugin.
Offsprout Theme
If you purchased the Offsprout Theme, you’ll see a Theme link under Settings… Page Builder.
If you’re starting a brand-new site with the theme, you’ll want to click the link that prompts you to run the Site Grower.
With the Site Grower feature, Offsprout can automatically design and build your site in minutes after you enter some basic information through a wizard-like interface.
Other features provided by the Offsprout theme include Offsprout Structures and new modules for comments and navigation.
Finally, under Settings… Page Builder, you’ll also see links for Branding (Upload Logo) and Tools (Revert SSL Changes).
Using the Page Builder
The basics of using the Page Builder (whether the free version or the premium Pro version) are similar. I’ll mention the major differences below.
To build your page or post, go to Pages… Add New, and click the Page Builder tab in the page (or post) editor.
You’ll immediately go to a live version of your page with placeholder text added in the content area.
At the top left of the window, you’ll see the Site Settings button, which can also be accessed via keyboard shortcut S.
Items under Site Settings include:
• Content
This is where you can choose sitewide content module settings.
• Overall Design
Here’s where you can control things like sitewide colors and fonts.
• Element Design Skins
Here’s where you set skins for different modules. You can change the designs here and have it affect all modules sitewide that use the skin.
To the right of the Site Settings button is the New… button, which can also be accessed via keyboard shortcut N. Then, you can access templates for the page by clicking New from Template (T).
At the bottom of the page is the Click to Add (A) button that allows you to either Add New Module (A) or Add Template (T). These items are added by dragging them onto your page.
Once you have elements on the page, you can control them in various ways. For example, they can be moved, duplicated, edited, merged, aligned, deleted, and much more. They can also be saved and reused as templates themselves.
To select an element you want to manipulate, you just click on it. The easiest way to see editing options for an element is to right-click on it (the other way is to click the Edit Settings icon after selecting the element).
In the upper-right corner of the window, there are also buttons (with keyboard shortcuts) for undoing, redoing, and saving.
If you install Offsprout Pro, you’ll see the addition of a new menu icon (three stacked lines) at the upper-left. By clicking this icon (or using the keyboard shortcut M), you’ll get access to Offsprout Pro’s new features. These features include Builder Roles, Forms, and a WordPress Admin link.
If you install the Offsprout Theme, you’ll also see new features for Structures and the Site Grower.
There are many impressive features throughout Offsprout. Let’s quickly cover how to use the Site Grower.
Using the Site Grower
Offsprout comes with many impressive modules and features. To adequately describe how to use them is beyond the limits of this review. However, I want to briefly cover the Site Grower to show how quickly you can create a full website in just a few minutes.
To use the Site Grower, you need to have the Offsprout Theme installed and activated. The theme will automatically detect if your site is new (based on if you have less than a single page published), and present a prompt to run the Site Grower. You can also access the Site Grower by clicking the menu icon at the upper-left and selecting Site Grower.
You have three options for using the Site Grower:
• New Site from Scratch
• Additional Pages
• New Domain
In this example, we’ll use the New Site from Scratch option.
1. Click the upper-left menu icon (three stacked lines) and choose Site Grower. Choose the New Site from Scratch option.
2. Click the Next button in the upper-right, and upload your logo from the WordPress Media Library.
3. Click Next and add your name, email, phone, and address under Set Company Information.
Through use of the Offsprout Connector feature, the information you enter here will automatically be shown in Offsprout’s built-in templates (wherever it’s called for).
4. Click Next, and enter your social media information under Set Social Profile URLs.
The information here is also used by the Connector feature and displayed through the Social Media Buttons module.
5. Click Next, and under Add Remote Template Sites, set URLs for centralized template sites that your client websites can access.
Remote template sites are a great feature because it allows you to use a library of templates (e.g., page, row, module templates), without having to import and export them for each client site you create.
It’s recommended to leave Template Remote URL 1 as it is. For Template Remote URL 2, add a subdomain to your site’s URL, in the format of:
https://ift.tt/2KzXbSW
6. Click Next to choose the pages you need for your website. You can choose page templates among the following categories (numerous templates exist within each category):
Home
Landing Page
Contact
Services
Blog
About
Classes
Standard
When you see a template you like, click on the Use button in the upper-right of the preview image.
By the way, Offsprout has a great feature called Live Template Rendering that shows you the template preview exactly how it will look on the site, based on your website settings (i.e., fonts and colors).
7. Next, you’ll need to choose the options for your pages, including which page is your homepage, the page/post status (Draft or Publish), whether to add multiple versions of a page using the same template, page titles, changing page templates, deleting pages, and more.
8. Click Next, and you’ll see the option to delete any posts and/or pages you already have on your site.
9. Click the Finish button. Offsprout will automatically create your website for you and include placeholder text where appropriate.
As I said before, Offsprout has many features, and thorough explanation for how to use them go beyond this review. If you’d like to get a closer look at them, I highly recommend taking a look at their video tutorials.
Offsprout Support & Documentation
Support and documentation for Offsprout are very good, and includes:
• Support page that includes articles and contact forms for both existing customers and sales inquiries
• Email support
• Tutorial videos
• Documentation throughout the user interface
• Blog articles for developing and growing freelance and agency businesses
Pricing
Here’s the breakdown of the pricing for the different Offsprout offerings:
Offsprout Page Builder
Free from the WordPress plugin repository
Template Sites for Offsprout
Free from the WordPress plugin repository
Premium Add-ons:
Offsprout Pro
$19/month or $199/year
Unlimited sites
This premium plugin extends the functionality of the free Offsprout Page Builder. It adds many new module types, management of user permissions, and more.
Offsprout Pro works with any WordPress theme and requires the free Offsprout Page Builder.
Offsprout Theme
$49/month or $499/year
Unlimited sites
This WordPress theme extends Offsprout with features such as the Structure Builder (for designing and editing content sitewide: headers, footers, sidebars, etc.) and the Offsprout Site Grower.
Use of this theme requires either the free Offsprout Page Builder or Offsprout Pro.
Offsprout Bundle
$59/month or $599/year
Unlimited sites
The Offsprout Bundle includes the Offsprout Pro plugin and the Offsprout Theme.
For all premium products, Offsprout offers a 60-day money back guarantee on all annual subscriptions. Their monthly subscriptions are non-refundable, but can be canceled at any time.
Conclusions & Recommendations
If you’ve ever handled website development for multiple clients, you know the process of building and managing websites can be repetitive and time-consuming. The people behind Offsprout are former agency owners and understand this problem intimately. Instead of trying to create a page builder that was everything to everyone, they put their focus on creating “The best WordPress website and page builder for web design businesses.”
Admittedly, I was very skeptical of such a claim. After all, the number of excellent WordPress tools that are available for web designers seems nearly limitless.
But after trying it out, I found that Offsprout’s unique offering of centralized design options and features make it a product worthy of consideration for many freelancers or agencies looking for an edge.
Is it the perfect solution? No, I’d love to have the ability to clone a site at the push of a button. Or perhaps have a central dashboard to help manage all client sites. Or perhaps Offsprout should have a partnership with a web host that offers those options.
That said, it sure has a lot going for it.
I especially like the real-time drag-and-drop page builder, the Site Grower feature that lets you create a brand new site in minutes, the abundance of design modules and built-in templates (and the ability to create your own templates), the sharing of resources between client sites, the Structures feature that helps you build WordPress themes without using code, and the ability to set precise client permissions.
And there’s a lot more to like. In the end, Offsprout is about helping web designers get back their time so that they can grow their business.
If you’d like to find out more, you can visit the Offsprout website here.
