Rapidly growing to become one of the most popular eCommerce frameworks, BigCommerce has everything a store needs to be successful. From automated emails for abandoned carts to fully customizable url structures, the company has easily positioned itself as the framework of choice for marketing-driven eCommerce stores.
In addition to the suite of marketing tools, migrating to the BigCommerce framework almost always provides a leap in search placements across the board. Bread crumbs, product information, custom urls, and endless opportunities for additional content make BigCommerce incredibly effective out of the box and provide everything eCommerce businesses need to compete with the big Internet 500 retailers. That said, there are several code modifications that can and should be made to ensure you’re getting as much search engine love as possible.
If you’re just starting out, make these tweaks before designing and building out your store. If your store is actively doing business on the web, making these changes will only improve your existing search placements and should yield a nice lift in organic traffic from all major search engines.
Modifying the Header Tags
Probably the biggest problem innately built into this shopping cart is the erroneous use of header tags throughout the framework. Product, brand, and category pages all have h2 tags rather than h1. Since these are generally keyword-focused and above the fold, it’s imperative to change all of them to h1. This tweak alone can improve search placements across the entire website.
To implement these changes you can make changes directly to the template files through the back-end of the store or download the template files via your FTP client. To keep this simple, we’ll make all the following changes alphabetically. This tweak is incredibly simple and powerful; all you do is change the h2 tag to h1 across all important pages.
In your template files, local the Panels folder and make the following changes to the files:
BrandContent.html
<h2>%%GLOBAL_TrailBrandName%%</h2>
Change the h2 tag to h1 so it looks like this:
<h1>%%GLOBAL_TrailBrandName%%</h1>
CategoryHeading.html
<h2>%%GLOBAL_TrailBrandName%%</h2>
Just like before, change the h2 tag to h1.
<h1>%%GLOBAL_TrailBrandName%%</h1>
NewsContent.html
<h2>%%GLOBAL_NewsTitle%%</h2>
Change to:
<h1>%%GLOBAL_NewsTitle%%</h1>
PagesContent.html
<h2>%%GLOBAL_PageTitle%%</h2>
Change to:
<h1>%%GLOBAL_PageTitle%%</h1>
ProductDetails.html
<h2>%%GLOBAL_ProductName%%</h2>
Change to:
<h1>%%GLOBAL_ProductName%%</h1>
To keep your html markup correct and your design looking clean (we’ll address css elements later), you’ll also want to change the h3 tags to h2. Just like above, all the files we’re modifying are located in the Panels folder.
ProductByCategory.html
<h3>%%LNG_FindByCategory%%</h3>
Change the h3 tag to h2 so it looks like this:
<h2>%%LNG_FindByCategory%%</h2>
ProductDescription.html
<h3>%%LNG_ProductDescription%%</h3>
Change to:
<h2>%%LNG_ProductDescription%%</h2>
Important note: While some people prefer the have “Product Description” above the description itself, it doesn’t help your SEO efforts, nor does it contribute to a better customer experience. You may omit this entirely or change the tag to h4 or h5 if you don’t like the emphasis.
ProductOtherDetails.html
<h3>%%LNG_ProductDescription%%</h3>
Change to:
%%LNG_ProductDescription%%
Keeping the Design Clean
Once you’ve changed all the header tags, you’ll probably notice that the headlines and product titles will be substantially larger than before. Unless you like the way it looks, you’ll want to go into styles.css and change the following line to clean things up.
.Content h2, .TitleHeading { font-size: 1.6em; font-weight: 400; padding: 5px 20px; font-family:Georgia, "Times New Roman", Times, serif; font-style:italic; background-color:#f4f4f5 }Change to:
.Content h1, h2, .TitleHeading { font-size: 1.6em; font-weight: 400; padding: 5px 20px; font-family:Georgia, "Times New Roman", Times, serif; font-style:italic; background-color:#f4f4f5 }Optimizing PageRank Flow
While the BigCommerce framework does most of the heavy lifting with regard to internal linking structure and pagerank flow, there’s a glaring flaw that should be corrected for every store. Regardless of design, the “Add to Cart” links from the home page, brand page, and category pages all pass pagerank directly into your cart itself, where customers are checking out. There’s absolutely no reason for this and if you’re in even a remotely competitive market, this can create SEO legwork than would be necessary.
To fix this, we’ll go into the template files and apply the rel=”nofollow” attribute to all of our Add to Cart links so our power goes where’s it’s most needed. There’s another tutorial on the web that suggests removing these links entirely, but in my opinion that detracts from the functionality of the cart by requiring visitors to hit a product page every time they want to add something to their shopping cart.
From your template files, we’re going to edit a handful of html files which are located in the Snippets folder.
You’re going to be looking code in each snippet file that is as follows:
%%GLOBAL_ProductAddText%%
What we want to do here is insert a rel=”nofollow” attribute to ensure those Add to Cart links do not flow pagerank unecessarily into our cart and checkout process. Insert rel=”nofollow” so the code looks like this:
%%GLOBAL_ProductAddText%%
We’ll want to apply this to the following html files below, all of which are located in the Snippets folder.
BrandProductsItem.html
CategoryProductsItem.html
HomeFeaturedProductsItem.html
HomeNewProductsItem.html
HomeSaleProductsItem.html
ProductVendorsOtherProductsItem.html
SearchResultProductGrid.html
SelectGiftWrapping
SideCategoryNewProducts.html
SideCategoryPopularProducts.html
SideCategoryTopSellers.html
SideNewProducts.html
SidePopularProducts.html
SideRecentlyViewedProducts.html
SideTopSellers.html
SideTopSellersFirst.html
SimilarProductsByCustomerViewsItem.html
TagProductsItem.html
I’d also apply the rel=”nofollow” attribute to any external links in the footer (unless you intentionally want to pass pagerank), such as a Better Business Bureau link or links to various shopping feeds/product aggregators.
While this seems tiresome and repetitious, if you’re serious about competing against Internet 500 retailers in competitive verticals, these SEO tweaks are imperative.