~ On the blog ~
Title: SiteOrigin Page Builder: Drag & Drop Website Design with Premium Addons
Hello reader, welcome back to our Page Builders & Themes blog series! Today, we're exploring SiteOrigin Page Builder, one of the original tools that helped shape the drag-and-drop landscape for WordPress website design.
I was tinkering with HTML 4.0 in '96, so trust me when I say crafting a visually stunning and functional website has never been easier. Gone are the labyrinthian paradigms of endless tables—replaced with endless divs? I so fondly remember the days of 'td' this, 'tr' that, and gaudy, slot-machine-esque documents we called websites. Bing, bing, everybody.
Thanks to tools like SiteOrigin Page Builder, one of the original pioneers of drag-and-drop page builders for WordPress, we have an ever-growing pool of quality tools that make web design accessible to everyone.
At our agency, we relied heavily on this powerful page builder to design dynamic websites for our clients—some of which we still maintain today. While the interface might appear complex at first glance, whether you're a novice or a seasoned developer, SiteOrigin Page Builder offers a versatile platform for creating unique and engaging digital experiences. And, thanks to its longevity, there's also a wealth of pre-built themes from various studios, giving you plenty of options for your site's look, feel, and functionality.
In this article, we'll examine SiteOrigin Page Builder, explore the benefits of its premium addons, and share real-world examples of how these tools have transformed our projects. Let's get started!
Overview of SiteOrigin Page Builder
SiteOrigin Page Builder is a mature offering that stands out as one of the original intuitive WordPress tools for creating custom layouts. Its straightforward drag-and-drop interface empowers users to design pages effectively. Their immense support forum makes things less complicated, and the builder is amenable to interested parties of all skill levels. We used to train clients who lacked coding expertise to use this very utility. I can't fathom the hours I have spent showing people how to change fonts, add a specific widget, or divvy up a row into X columns. Good times. All of that to say, the base builder, coupled with SiteOrigin's rich library of widgets, offers plenty of flexibility for modern website design.
For instance, when tasked with building an internal subdomain blog for a client, we turned to SiteOrigin Page Builder to create a resource hub that combined functionality with aesthetics. The client was heavy on the look & feel, so based on their preferences, we settled on the Readable theme (by the team at Proteus Themes) made with SiteOrigin Builder. I had this theme in mind because I knew the row-based layout and post-template architecture would save us time right out of the gates (if you're interested, the theme is mature but still worth the gander). That said, by meticulously integrating product categorization, interactive elements, and seamless navigation, we delivered a solution that enhanced the client's internal communication and resource sharing.
Benefits of Utilizing Premium Addons
Heads-up, we have only ever used SiteOrigin Premium. With that said, upgrading to SiteOrigin Premium unlocks advanced features that help elevate your website design. You'll gain access to:
- Enhanced Design Tools: Add depth to your layouts with animations, advanced navigation, and interactive elements.
- Ongoing Updates: Stay ahead of the curve with regular feature rollouts and bug fixes, ensuring your site remains cutting-edge.
- Priority Support: Navigate challenges with ease, thanks to responsive customer support.
The premium package turns things up by giving users access to all current and future addons, enabling developers to create extraordinary user experiences.
SiteOrigin Premium Addons: Real-World Applications
Under the Hood
Here's a closer look at some of the standout premium addons and how they've enhanced our project(s):
Custom Post Type Builder
This feature allows you to create and manage unique post types effortlessly. For our client's internal blog, we tailored post types to align with their products, ensuring their employees could quickly access relevant content.
Accordion Widget
We used the Accordion widget to organize product details into collapsible sections. This approach minimized visual clutter while providing easy access to vital information.
Anchor ID
The Anchor ID feature simplifies linking to specific sections of a page, making navigation more intuitive. For example, when deploying lengthy product description pages for our clients, we often used the 'tabs' or 'accordion' elements to enhance digestibility. Think of how sites like Amazon or Samsung organize product pages with tabs such as 'Product Information,' 'Installation,' 'Drivers,' and so on.
Anchor IDs allowed us to guide users directly to the most relevant content within these sections. By the way, 'ID linking' is an inherent HTML capability developers use to link to specific elements on a page. SiteOrigin brings this functionality to the front end of the editor, making it accessible to everyone.
Block Animations
Animations added a dynamic touch to our client's website(s). You will get all the standard animations, from Bounces to Pulses and Fades. It's as easy as clicking on a row and toggling the 'Animations' option on the right (then have at it). That said, transitions between sections made navigation more engaging, leaving a lasting impression on users (still do).
Author Box
Given our internal blog use case, this addon personalized blog posts (detailed product descriptions) by prominently displaying the authors, their company profiles, and recent articles. It added credibility and strengthened the connection between the content and its audience. Additionally, it made it easier for employees and guests to recognize key stakeholders and subject matter authorities within the enterprise.
Did you know? SiteOrigin's Widgets Bundle is not limited to the Page Builder alone.
That's right, SiteOrigin's Widget Bundle is compatible with any WordPress theme. That means you can deploy SiteOrigin widgets on-site using the Block Editor, the widget area of your site, or even with other page builders. This flexibility allows users to add widgets like sliders, accordions, and contact forms without relying on specific page-building tools. It's a game-changer for site owners and developers who want to enhance functionality without committing to a single builder ecosystem.
Enhanced Features for Website Design
Image Overlay
Interactive hover text over images brings galleries and portfolios to life. For the ultimate product showcase, we used this feature to display details on hover, creating an immersive browsing experience when looking at product descriptions.
Parallax Sliders
We deployed parallax sliders to create depth and motion in hero sections. The subtle yet impactful effect captivated visitors, drawing attention to featured products. Funny enough, the lead-in section of this article uses parallax. Old habits, I guess.
Social Widgets
For our internal blog, we didn't use the SiteOrigin Social Widgets. However, we've deployed these widgets on other client sites, connecting users directly to their social media platforms and helping boost content sharing and brand visibility on their WordPress websites. That said, setting up on-brand social links is as easy as clicking edit, toggling Custom Networks, entering the name and the URL, and picking your icon. After a few simple clicks, you will have a new link to your Facebook, LinkedIn (etc.) profile.
Video Background
A good video background can instantly elevate a site's aesthetic. However, it's worth stating that you have to pick your moments. We used background videos in a dual-column layout at the top of product sections for the blog. It was a subtle design choice to help distinguish categories from posts/pages. We then overlayed text for a visually rich and informative presentation.
Related Posts
By displaying related articles at the end of each post, we kept users appraised of related content and encouraged a deeper exploration of the site. While displaying related post types is not inherently unique to SiteOrigin, this addon makes it exceptionally simple to display related blog posts on all pages. It is as easy as clicking a checkbox ('Display Related Posts').
Advanced Functionality and Tools
Cross Domain Copy Paste
This feature streamlined our workflow, enabling us to replicate complex layouts from staging and a/b testing across multiple domains. There are two methods to accomplish this. The first is the 'Browser Clipboard' method, and the alt is the 'Browser Storage' method. We only used the 'Browser Clipboard' method, which always worked fine for our purposes. For anyone working on multiple domains or multi-site projects, this quick copy/paste method is a game-changer.
Call-To-Action Widget
Strategically placed buttons drove users to actions, like exploring product categories or downloading resources. Customizing these buttons boosted conversions and engagement. Every page builder has its bent on CTAs, and I felt like this feature was complete and did what we needed. For posterity's sake, I will note that we used the hover effects and Onclick JavaScript quite frequently for our purposes.
Page Background
Custom backgrounds helped us maintain consistent branding across verticals of the internal blogging site, enhancing the overall visual appeal. In this regard, SiteOrigin had some tricks up its sleeve. This feature provides the ability to set backgrounds for specific pages and globally. That means we could display a global page background and modify it for select pages, further differentiating areas of the site.
Testimonials
Again, it is worth mentioning that we did not employ this feature for our internal blogging site. However, we have used the Testimonials addon for other projects. The ability to showcase client feedback with customized layouts and fonts always builds trust and credibility, making testimonials an integral part of many sites.
Toggle Visibility
Access to the internal blogging site followed a tiered user design. Specifically, there would be two primary user groups with varying custom roles ranging from guest to administrator. This feature allowed us to control content access based on these user roles. We created exclusive sections for employees, tailoring the user experience effectively while retaining basic functionality for guests.
Engineered for success, SiteOrigin Page Builder simplifies WordPress design with its intuitive drag-and-drop interface. By demystifying complex tasks like layout customization, widget integration, and content accessibility, it empowers users to create professional, visually appealing websites tailored to their unique needs.
SiteOrigin Premium Support and Updates
Access to All Addons
As noted above, SiteOrigin Premium offers a comprehensive suite of tools empowering you to build tailored websites. This flexibility is invaluable for website owners and agencies working on diverse projects.
Ongoing Updates
Regular updates ensure your website stays functional and relevant. For example, new layout options introduced through updates have enabled us to keep client sites up to date with evolving design trends effortlessly.
Widgets Bundle Extras
Customizing forms, social widgets, and interactive elements has never been easier. These extras add depth to any site's functionality and were central to feedback for our blogging project.
Theme Enhancements
Premium theme enhancements allow for greater design control, helping deliver polished, professional websites that align with your branding.
Pricing and Subscription Options
SiteOrigin Premium's pricing model is flexible and accessible, offering options for individuals, businesses, and agencies:
- Single Site License: Ideal for individual projects, providing full access to features at a reasonable cost.
- Business License: Perfect for managing up to five different sites, this Premium option is ideal for small businesses.
- Developer License: Unlimited site usage makes this the go-to choice for agencies managing multiple clients.
Each subscription ensures access to premium tools, ongoing updates, and exceptional support, making it a worthwhile investment.
STAY IN TUNE WITH OUR LATEST POSTS
Enjoy The Read? Subscribe & Get Notified When Posts Come Out
Thanks for taking the extra time to read this far. If you've enjoyed our shenanigans thusly, why not subscribe to get notified when our next post is published?
Attention! By subscribing you agree to be notified via email when a new blog post is published. As a course of business, we do not sell your information to 3rd parties. For further details, please feel free to consult our Privacy Policy.
~ More On the blog ~
SiteOrigin Page Builder for WordPress streamlines design using intuitive drag-and-drop tools, premium addons, and advanced features to build dynamic websites.
See how Cloudways helped us craft a high-performing pop-up boutique for a client's 90-day fundraiser, meeting strict deadlines and unique goals.
Learn how the Squirrly Plugin enhances SEO, simplifies content optimization, and drives organic traffic in this beginner's guide to SEO success.
SiteOrigin Page Builder for WordPress streamlines design using intuitive drag-and-drop tools, premium addons, and advanced features to build dynamic websites.
See how Cloudways helped us craft a high-performing pop-up boutique for a client's 90-day fundraiser, meeting strict deadlines and unique goals.
Disclaimer:
The content on this website is for informational purposes only and reflects personal opinions based on experience. It does not constitute professional advice, and we do not guarantee specific outcomes from using the tools or strategies discussed. While we strive for accuracy in our writings, readers should understand that these articles represent a snapshot in time—plugins update, tools evolve, and features may change. We encourage readers to independently verify information before implementation.
Please note:
Our policy is to avoid displaying affiliate links or backlinks on the public-facing front end of this website. However, affiliate offers from our partners may be available on dedicated pages within the customer portal. While some links may generate commissions, this does not influence our content or recommendations. Ultimately, our goal is to share WordPress knowledge gained through years of experience without external affiliations dictating our guidance.
If you notice content that requires updating, please let us know, and we will address the issue promptly. For more details, please refer to our terms of service.
SOFTWORKS INTERACTIVE
ALL RIGHTS RESERVED