An Overview of Workarea’s Site Builder

An Overview of Workarea’s Site Builder Blog

Earlier this year, Workarea released Site Builder, a new feature on the popular commerce platform. As with all new software features, there are learning curves and time is needed to fully understand how to apply them. 

So cozy up to your device, grab your reading glasses, and prepare yourself for a thrilling read on what the Site Builder feature is and how to get the feature set up and running in your own Workarea instance. Okay, okay…I might be overselling this a little, but you will learn a thing or two!

What is Site Builder?

Before we get too far into this post, let me first explain Site Builder, itself. As I said before, it is a new feature within Workarea v3.5. Site Builder allows for the creation of one or multiple microsites, with common features shared between them and the parent site. Let’s quickly touch on some of the main features of Site Builder.

Control by Workarea Admins

One of the major benefits of Site Builder is that it puts the control of the creation of microsites into the hands of Workarea admins rather than only developers. If you have access to the Store section of the Workarea Admin, you have the ability to create new sites. Admins also have control over the resources that should be shared between the parent site and the microsite(s), or between microsite to microsite.

Workarea Admin

Use of Primary, Unique, and Hybrid Models

When setting up the resources for a microsite, admins have the ability to set how the sites get their content per resource. This can be done in one of three ways: 

  • Use from primary site
  • Use from primary site if tagged
  • Unique to this site 

Don’t worry, I will get into this more a bit later, but for now, I just want you to understand that there are a lot of resources, with a lot of different options on how to get those resources.

Hybrid Models

Themes

Site Builder also relies heavily on the use of themes to provide a consistent look and feel for the microsites. Each site can have its own theme, or it can use one of the existing themes within Workarea.

Workarea Site Themes

Templates

Another useful feature of Site Builder is the ability to create one or more “template” sites. The setup of these microsites can then be used for other sites when they are created. Even more useful is the fact that changes to the template can then be copied to the microsite. 

Workarea Templates

How to Setup Site Builder (with Pro Tips)

Alright, now we are ready to set up a new microsite. We know what Site Builder is and why you might find it useful, so now you may be asking, “This is all fine and good, but how do I set this feature up?” Well then, let’s dive in.

Site Builder is relatively easy to set up. Below, I will show you the basic steps for Site Builder and provide you with some additional pro tips along the way to help make using this feature more efficient. 

Before we begin, you will need to open Site Builder from the Workarea Admin tool and click “Add New Site.”

Setup Site Builder

Once a new site has been established in the admin, there are a few steps that we have to complete before we can begin using the new site.

Step 1: Initial Setup

Basic information is added here, such as the site’s name, url, and logo.

Site Setup

Pro Tip: Replace references like image_tag ‘workarea/storefront/logo.png’ to point at current_logo_path(format: ‘png’) instead. This will default to the primary logo if a custom logo for the microsite is not specified. 

Look for this in layouts, like app/views/layouts/workarea/storefront/application.html.haml and app/views/layouts/workarea/storefront/checkout.html.haml.

Step 2: Configuration

By default, the configuration for all sites uses the primary site(s) setup. This step in the process allows for some level of customization between the sites.

Site Configuration

Pro Tip: If you’re setting the child sites up to be brand specific, then this is a good opportunity to modify the Communication settings to be specific to the site.

Pro-tip Communication Settings

Step 3: Resources

Resources come from many different areas of the Workarea platform. When setting up the resources on your new site, you have a few different options:

  • Use from primary site: This option will use a copy of all the settings from the primary site. Any changes to the child site or primary site will be applicable on both
  • Unique to this site: This option will use its own instance of the resource. Any changes on the primary site will not carry over to the child site
  • Use from primary site if tagged: This option will use resources from the primary site ONLY if they are tagged with the provided tag
Resources

Pro Tip: Setting Accounts and Orders to “Unique to this site” will allow each of the child sites to be administered by users setup only for that site. This keeps other resources that are “Unique to the site” from being modified by content editors of the other sites.

Pro-tip Accounts and Orders

Pro Tip: Setting up a template child site allows for quick modifications in one place to be copied to other child sites by using the “Copy from” feature.

Pro-tip Navigation

Step 4: Theme

Themes are a great way to set up styling and scripting that can be used across any number of microsites.

Theme Preview

Pro Tip: Most of Workarea’s existing themes are not made for use with Site Builder, and will not work correctly if being added using the Theme Builder. The Clifton theme works out of the box, but additional themes will need to be created prior to use.

Step 5: Hosting

Once you get to this step, there will be some additional work outside of the Workarea platform to finalize. After hosting setup or changes have been completed, the new child site will be ready to launch.

Hosting

Pro Tip: When creating a site on localhost, this step will never complete. This can be simulated, however, by performing the following steps:

  • In a terminal session, enter the following command 
    • bin/rails runner “puts Workarea::Site.find(‘your_id_here’).url.host”
    • ‘your_id_here’ will be the new child site id
  •  Once entered, you will be provided a new preview domain that can be used
    • Example: child-site-a-preview.wa-demo
Pro-tip Localhost

Need Additional Help with Workarea?

Well, there you have it. Hopefully this makes the use of Site Builder a bit clearer for you. Should you need professional advice on Site Builder or any other Workarea features, contact us today! Our team of developers are here to help you on your ecommerce journey.