How To Create Custom Pages in BigCommerce Using Shogun

In this guide, we’ll walk you through how to use Shogun to build custom pages in BigCommerce, scale content creation, and personalize your store for specific groups of visitors. Let’s dive in! 

Table of Contents

• Landing Pages
• Blog Pages
• About and Brand Pages
• Custom Coded Pages
• Scaling Custom Page Creation
• Adding Personalization to Custom Pages

To give you a better idea of what Shogun is capable of creating for your store, let’s review some of the most common page types that merchants are interested in creating: landing pages, blog posts, and an ‘about’ or brand page.

Creating Custom Landing Pages with Shogun

Landing pages make online marketing campaigns much more successful. Directing campaign traffic to a page that was designed specifically for them (rather than a general product page that is meant for everyone) will help you be more persuasive — you can customize your product images, product description, and everything else about the page in order to speak directly to this group’s preferences and needs. 

With Shogun’s visual editor, you have all the tools you need to build custom landing pages from scratch. To access the visual editor:

• After downloading and installing Shogun, select the “Apps” option in the left sidebar of the BigCommerce control panel. 
• Open Shogun. 
• Go to the “Pages” section of the Shogun app. 
• Select the page that you would like to customize (you can also use the search bar to look for it if needed) — this will open the page in the visual editor. 

In the left sidebar of the visual editor, you’ll find the elements library, which includes all sorts of features you can add to your landing page. 

There’s an element for just about any kind of content that you might consider adding to a landing page, such as text, icons, images, video, and buttons. There are structural elements available as well, including columns, tables, tabs, sliders, and accordion menus. 

With the grid element, you’ll get full control over how your elements are arranged — just drag an element wherever you want it to appear in your grid, and it will snap right into place. 

Also, there are BigCommerce elements (title, image gallery, price, etc.) that pull product data directly from your BigCommerce account. That way, you can add information about products to your landing pages without going through the tedious process of filling in all the details manually. You can even fetch product reviews data from third-party vendors like Yotpo. 

Creating Blog Pages

Running a blog on your BigCommerce site will help you improve your search rankings (more on that below), and you can also use it as another place to promote your products. 

To create a custom blog post using Shogun:

• Go to the “Pages” section of the Shogun app. 
• Hover your cursor over “Build or edit a page”, then select “Create a blog post”. 
• You can either choose one of Shogun’s pre-made blog templates or start from scratch if you have your own design in mind. 

Just like with landing pages, you can use the BigCommerce elements in the visual editor to pull product data from your account and quickly set up Product Boxes inside your blog pages — this will help you monetize your blog, as visitors will be able to review product details and add items to their cart directly from your posts. 

Shogun can also help you figure out what to write about on your blog. 

You only have so much time to spend on content creation, so you would be wise to focus your efforts on the topics that will benefit your store the most. To determine what these topics are, just go to the “SEO” section of Shogun — here, you can use the SEO Keywords Analyzer tool to generate a report about the top keywords you currently rank for. 

For each keyword, you’ll be able to see details such as how difficult it would be to get a high ranking for the keyword, how much search volume the keyword has, and whether the intent for the keyword is commercial or informational (or both). 

You should prioritize writing blog content for keywords with relatively low difficulty, at least a moderate amount of volume, and commercial intent. This strategy tends to lead to the most traffic and sales. 

And Shogun can even write your posts for you. 

This is made possible with Shogun’s AI writer tool. In the SEO Keywords Analyzer report, you’ll find that there is a “Generate content” button next to each keyword. After you click this button, all you need to do is add a URL, title, and description of the post you want — then, the content itself will be generated automatically, though you’ll still be able to go in and make manual edits if needed. 

Brand/About Pages

Traffic to About Us pages has risen in recent years. Online consumers are more discerning than they used to be — many want to know about a company’s practices and values before they actually place an order with them.

Shogun makes it easy to quickly set up this part of your site as well. In addition to the elements library, the visual builder also includes a blocks library — this feature is especially useful for building About Us pages. 

Blocks are like elements, but more elaborate. They’re essentially multiple elements that have been put together for you, allowing you to add a fully-designed section to the page in an instant. 

FAQ sections and value props are two of the block categories available. These sections are often included on About Us pages, as they offer an efficient and aesthetically pleasing way to display information about your company. 

For both the FAQ section and value prop blocks, Shogun gives you several different styling options to choose from, and then you can use the elements library to add whatever else you need for your About Us page.

Creating Custom-Coding Pages in Shogun

If you can’t find exactly what you’re looking for in the elements or blocks library, you can always use the Custom Elements tool to add your own custom-coded reusable features:

• Go to the “Developer tools” section of the Shogun app. 
• Select “Custom Elements”.
• Click on the “Create New…” button. 
• You’ll be able to use HTML, CSS, and JavaScript to create your Custom Element. 

Once you’ve created a Custom Element, you’ll be able to access it in the visual builder’s elements library whenever you’re working on a page, just like any other element. With this tool, you can add anything from a small design flourish to an entire custom page template. 

Scaling Page Creation with Shogun

Any page you create in Shogun can be turned into a reusable template — you just need to open the dropdown menu located in the top-right corner of the visual editor and select “Save as template”. This can save you an enormous amount of time when working on pages that you need to produce a high number of, such as product pages and blog posts. 

Also, you can save any portion of a page that you’ve made in Shogun as a reusable snippet. 

This is helpful for when you want to set up templates that are similar, but not quite the same. For example, you may want to make different blog post templates for company news and how-to guides — snippets will save you time when adding the sections that these two templates share, while all the other editing tools available in the visual editor will allow you to customize each template as needed.

Another Shogun feature that can help you scale your ecommerce content is CMS Collections. 

This tool allows you to build your own custom data models using properties such as text, images, and integers. CMS Collections can be referenced as variables in your Custom Elements. Whenever you make edits to a CMS Collection, that change will automatically be applied on every page that references it. 

In other words, you can use CMS Collections to update a large amount of pages with lots of new data at once.

There are many possible ways to use CMS Collections, such as:

• BigCommerce stores that also have a physical presence can create a CMS Collection for their hours of operation — whenever you need to update these hours you would only need to do so once, rather than manually making edits to every page that happens to include this information. 
• A CMS Collection for physical store addresses would allow you to update and remove addresses as needed from one convenient location. 
• CMS Collections certainly aren’t just for BigCommerce brands that have physical storefronts — for example, any online-only store with a blog can use CMS Collections to build sections for author bios, allowing you to update an author’s bio on every one of their posts with a single click.

Adding Personalization To Custom Pages

Finally, it’s worth noting that you can use Shogun’s Personalization feature to display one version of a page to some users while displaying another version to others.

To do this, you’ll first need to create a segment for the audience you’re targeting:

• Go to the “Personalization” section of the Shogun app. 
• Select “Segments”.
• Click on the “Create segment” button. 
• Set the conditions for the new segment, then save. 

There are a number of conditions that you can use to determine whether or not a visitor is included in your segment, including which website referred the visitor to your store, the day of the week or the time of the day when the visitor lands on your site, and the geolocation of the visitor. 

If you have a Klaviyo account, you can take advantage of Shogun’s native integration with this service and set conditions based on your customer data as well. 

Once your segment has been created, the next step is to assign it to a page:

• Go to the “Pages” section of the Shogun app and select the page that you would like to customize.
• Click on the “Personalization” button in the visual editor (it’s located near the top-right corner of your screen). 
• Select “Turn on personalization”.
• This will begin the process of creating a new variant of the page — assign the new variant to the audience segment you just created. 
• Use Shogun’s visual editor to customize the design of the new variant as needed, then publish your personalized experience. 

After you have completed this process, your new variant will only be shown to visitors who belong to your custom audience segment, while everyone else will still see the original version of the page.

Personalized experiences allow you to:

• Determine which products are promoted on a page based on the visitor’s location — for example, in the same featured products section, a sports equipment store could promote surfboards to visitors located near a beach while simultaneously promoting snowboards to visitors located near ski resorts. 
• Create a custom page design for particular marketing efforts, such as influencer marketing campaigns, email marketing campaigns, PPC campaigns, etc.
• Schedule page variants to only be displayed at certain times — if you ran a Half-Off Tuesdays promotion, you could display language on every other day of the week letting customers know when the sale will be available, then display a different version on Tuesdays announcing that the sale is active. 
• Promote an exclusive discount for repeat visitors in order to persuade them to finally take the leap and become a customer. 

And that’s just a small sample of what this feature can do for you. Overall, Shogun allows you to improve user experience, reduce the amount of time it takes to create ecommerce content, and generate more sales for your BigCommerce store.