How do you build and scale a top-grossing Shopify store?
I’ve always believed in standing on the shoulders of giants.
To discover truths by building on previous discoveries. To take ideas from major thinkers of the past and present, and using them as inspiration to make progress in our own journey.
On your journey to discovering what it takes to run a successful Shopify store, you need to be excited, inspired, but also leverage top brands in the industry by improving on their mistakes.
"We are like dwarfs sitting on the shoulders of giants. We see more, and things that are more distant than they did, not because our sight is superior or because we are taller than they, but because they raise us up, and by their great stature add to ours."
In this article, I’ll be reviewing Beardbrand, one of many top-grossing Shopify stores with a strong mission statement and brand identity. But has every stone been turned to optimize for conversions?
Related article: Definitive Guide To Landing Pages For Your Online Store
Beardbrand Cosmetics Shopify Review
Emerging on Beardbrand’s homepage is akin to stumbling onto a mini-landing page. The long-form layout and slew of content is engaging, encouraging you to further scroll and learn about the brand.
Let’s dissect it piece by piece.
There’s already a lot of great content above the fold here. The hero image of bearded men fits the brand, but what’s the actual message? As of yet, I’m not quite sure.
Original copy - Rather than using generic menu headings, Beardbrand has categorized its products using unique copy. This strengthens the branding by setting the tone for the site immediately. Check out the custom graphics on display as the menu drops down.
Creative email capture - This little red dot caught my attention immediately. A notification like this invites you to click it with open arms (it’s hard not to). To my delight, rather than being a message it was an email capture tool that opened. Personally, I find this approach much more refreshing than an intrusive pop-up.
Promising headline - While the headline has potential, the color contrast is poor, and the text nearly gets lost in front of the image. A colored border would make it more readable. The Call to Action is creative however, redirecting to a quiz that promotes interaction on the site.
The mission now becomes clear as we scroll a little further down the homepage. Storytelling is an important element of any eCommerce store. It helps visitors connect with the brand and is proven to increase conversions.
This is the second call to action we come across on the homepage. It’s clear that Beardbrand covers all aspects of men’s grooming and beyond. They’ve included article snippets here with headlines that (speaking as a man) are sure to reel you in. The CTA button contrasts nicely and stands out against the white background.
Not only does this encourage click-throughs, but the articles also add to their credibility as leaders in the industry.
Beardbrand took another opportunity to tell relevant stories through homepage content. The most impressive part about the copywriting lies in the balance. They are effectively telling their brand story while still keeping the copy “you” orientated. It speaks directly to the reader as a consumer, but more importantly a human.
Storytelling continues in the form of a timeline created by the founders. We get to see some faces behind the brand along with milestones that defined their business, from winning product releases to television appearances.
Facts tell, stories sell. And this works so well because, as humans, we have a deep inherent connection to the art of storytelling.
And finally, just before the homepage footer we have social media content. PageFly Shopify page builder has an Instagram element you can use to achieve the same effect.
You probably also noticed that the menu navigation followed us the whole way down the page, making it easy to start shopping when we’re done reading. This is called a sticky section, also found in the PageFly editor.
Another email capture section can be found but again, not in the form of an intrusive pop-up. But what’s great about it is the seductive copy and incentive to sign up.
And finally, we have the footer section, which shouldn’t be overlooked. In this case, the footer represents an extension of the top navigation menu, while including important legal information and other resources.
I recently wrote about how using trust badges can make you look untrustworthy. Glad to see Beardbrand isn’t using any. Social media buttons like the ones they’ve utilized will increase conversions more than security badges ever will.
Homepage verdict - selling through telling
The most refreshing aspect of landing on this homepage is how “non-pushy” it is. The homepage is not sales or product-driven but rather aims to build trust and credibility through brand values, mission, and unique content.
This is extremely important in 2019 and beyond because old-school sales methods simply don’t work anymore. Consumers need an emotional connection to your brand or product, and would rather know why you’re different from the competition, not better.
The entire process feels like an act of getting to know each other, starting with a quiz and ending with a timeline of their brand.
Product Page impressions
Organic product video - Not enough merchants are using quality product videos on site. Video content is king in 2019 and beyond. It’s the most engaging and high converting form of media you can invest in. Beardbrand has opted to use an instructional style video showing you the practical application of the product. It’s informative and casual.
Isolation effect - Notice how the Add to Cart button is the only blue button seen so far? This is called the isolation effect. Using it is not only eye-catching but it also provides a clear path further down the sales funnel. This should be repeated on the cart and checkout page.
Another nice touch is the multiple purchase options that display after clicking. More options directly correlate to a higher chance of a conversion.
Brand attributes - Another great example of unique content. But beyond this, it actually serves a practical purpose and gives customers more choice with each product having different attributes.
Tab content - At its heart, this is a short form product page, with most of the information hidden under tabs. Personally, I think long-form pages with laid out content convert better, but there is merit in using short form too. The PageFly Tab Element is an easy way to achieve this effect.
Sticky product - Scroll and the product on the right-hand side follows you down the page, making the purchase process easier.
Of course, don’t even think about launching a product without some reviews in place as social proof. Beardbrand is using the Judge.me Shopify app, which was recently integrated with PageFly.
According to SEO buff Neil Patel, over 70% of Americans look for reviews before making a purchasing decision.
Further down are some recommended products and bundles based on the one we’re looking at. This is a good way to increase the average order value (AOV) of your store - vital if you want to stay profitable.
Product Page verdict - practical and professional
All the content is based around the practical application of the product, from the video all the way to blend attributes and usage instructions.
It continues to showcase their skills for creating unique content that can’t be found on any other eCommerce store. This drives home the overarching concept that Beardbrand is radically different from the competition, rather than trying to be cheaper, faster or better.
Could it be better?
Sure. Image product reviews and more image-rich content, in general, would make this product page convert even better.
Cart & Checkout Page Impressions
Great to see the blue isolated check out button in effect here too. There’s also the incentive of a free gift to encourage you to continue to check out.
At this stage in the funnel, the focus should be to lead them through the buying process and avoid abandoned carts. Beardbrand does a pretty good job but, relevant content would increase conversion rates even more.
What am I talking about?
This cart page by BOOM! is a great example of relevant content done right. It has customer testimonials, isolation effect, a hotline, and a customer service chat box all on the cart page. This helps the prospect confirm they’re making the right decision.
For now, you’ll need to use software like Zipify to achieve this. This could soon change however with Shopify set to roll out more advanced theme editing options.
There’s not much room for modification of the checkout page with Shopify, but Beardbrand has done a good job with an encouraging message as a banner image, rather than the usual brand logo.
Sadly though, the isolation effect ends here. By simply making the ‘Continue to Shipping’ button blue, it would have been congruent with the rest of the site and effectively highlighted the next step to check out.
Blog page impressions
The much-anticipated blog is better than expected. Firstly, the use of the name “Urban Beardsman” is instantly more interesting and enticing than “blog”.
The layout is decent, and another email capture sits just above the “Popular” articles section. A strong email list is another tool in your arsenal to getting a higher conversion rate.
But of course, the actual content matters more than the structure of the page that holds it.
- Sticky section - that stays stagnant as you scroll, encouraging the reader to click through to other content. Backlinking to other areas of your site helps with SEO.
- Interactive element - According to Neil Patel, any element that visitors can interact with boosts SEO significantly. Whether it’s a simple calculator, a video or a quiz like this.
- Messenger - A chat box like this opens up the possibility for conversions from a blog post. If you’re writing content related to your product, as Beardbrand are doing, the prospect might have some concerns you can answer before deciding to purchase.
Blog page verdict - closing an optimized eCommerce ecosystem
Overall, the blog content is great. And it looks like they have an entire team dedicated to writing content, judging by the “careers” page.
But more impressively is the subtle art of using the blog as part of a bigger eCommerce ecosystem.
The reader is provided value through articles, which also allows Beardbrand to position their products as the best solution to pain points outlined within the content. The reader can then talk to support, and be linked directly back to the product page for social proof before purchasing.
Quality ecosystems are vital for any successful business (think Apple). Your Shopify store should run like a well oiled machine that keeps the visitor informed, engaged and ultimately on site.
A need for speed
It’s true. Google LOVES fast websites. Your page load speed can greatly impact SEO and your chances of ranking highly on Google.
Now, that’s not to say that slow loading pages can’t make it to the top, but you should always optimize your page as much as possible.
Beardbrand score poorly in both Mobile and Desktop speed tests. Luckily, Google Insights gives you actionable advice below on how to improve speed scores.
Out of curiosity, I ran one of PageFly’s pre-made templates through the speed test.
When pages are optimized to be FAST, you also greatly increase chances of conversion. We make up our minds about a brand in less than 3 seconds, and if your page takes longer than this to load, the prospect will navigate away. Using these pre-designed templates can help you rank higher in Google.
Unfortunately, I found myself staring at blank tones for close to 20 seconds.
When the homepage finally did load, there was still an issue of contrast with the hero image and white text.
Aside from slow load speeds, the content on mobile is on par with desktop.
- Best Shopify About Us Templates and Examples: Read More
- How To Build A Winning Coming-Soon Page With Shopify: Read More
- Conversion Tracking Made Easy - A Shopify Guide: Read More
- Add Google Analytics To Your Shopify In These 04 Simple Test: Read More
There’s more good than bad to say about Beardbrands site as a whole.
- Unique content concepts
- Great copywriting
- Isolation effect (button colors)
- Product subscription option
- Product page videos
- Strong website ecosystem
- Engaging storytelling
- ZERO trust badges
Areas of opportunity:
- Better contrast “above the fold”
- Page load time
- More content on Cart page
So what is the main takeaway you can use from Beardbrand in your quest to find Shopify success?
Aside from the above points, Beardbrand shows us the importance of high-quality content and how it can be used to create a brand that’s as strong as an ox. They’ve managed to leverage unique content and sell without hard-selling.
The best part about this new era of content marketing and the death of traditional advertising is this: Creating great content is either very cheap or very free.
Anyone can do it. It doesn’t have to be high budget. As long as your audience engage and relate to it, it has the potential to convert.
Beardbrand’s product page video was literally filmed in the bathroom with a camera and tripod (possibly even a smartphone).
BUT, never forget that you’re only as strong as your weakest link. If Beardbrand took some time to fix their load speeds and other minor usability issues, conversion rates would be even higher.
Keep learning from other peoples wins and losses and of course, constantly test your Shopify site to fix any issues that could be negatively impacting your conversion rate.