Checkout Toolbox

Flex Theme Sections

Linear Shopping Experiences


Video Walkthrough of the Site

Transcript of the walk-through video

Hey, Scott Austin here from Jade Puma. In this video, I'm going to do a walkthrough of den house. Denhaus is a store that we recently did a redesign of. So it's an existing Shopify store and we use the turbo theme in the redesign and they sell dog dens, they are high-quality dog dens. So they look like furniture or dog dens, not dog ENS, they're high-quality dog dens that look like furniture. So they, they fit into the decor of your house. So here on the homepage, you can see the color scheme. We've got this light blue color that I really like and, and a contrasting darker Brown. Same as going on up here in the the den house logo. And they also have some really good lifestyle photography. So you can see the dog den here and white as it exists inside of a living room.

What we're doing here is explaining there's a bunch of different dog den models that they have. So right on the homepage, the dog dens, they're premier products. We used to explain the differences between the different dens and we walked through them one at a time with this alternating layout, showing the different den options that are available for the dogs and their top-selling bed also. So let's go back up to the top and show you how we did that in the navigation. Also, because they sell more than just dog dens. They also sell beds and some other dog products. So we use the mega menu functionality of turbo theme. And we did the these aren't transparent PNG's cause the PNG's were just too large in size. So I actually made them into JPEGs, I mean transparent PNG's and then through a background color in that matches the dropdown blue color.

We're using the Megan AV and then turned them into JPEGs. So we did that for the dens and for the beds with the mega nav. And I really liked the way the products pop with that background color matching the blue from the dropdown. And then we also have a shop more function, which shows the other different categories of products that you can buy. So they have you on dog greats, our door door grates that are add onto the dense and travel bags and other dog care products. Let's go back to the dens main page. And on this page we've also got another, you know, nice big banner ad of that product in use in a home lifestyle photo. And then we just show all the dens again for the customer. We do the same thing with the beds page.

We just show the different bed options there. Now let's walk into all of them. I actually, that's a good look in German shepherd there. That's a good photo. If we look at the dens, what am I going to do is gonna do to their townhouse elite and she would have product page looks like. So here we have swatches for the color selection. You can choose between the a mahogany and the espresso. And we also have some icons for some of their value props of they have free shipping in the USA. So we put that as an icon right next to the add to cart button so people are very aware of it. And we also have free shipping in all us orders up here in a the top bar. This was a some custom coding I had to add. It's really easy to do but had to add some custom code of the turbo theme to put that in up there.

And also these products are patented. So we made a patented icon that matches the color scheme of the site. A, they've got a frequently bought together app already in place in the store. That actually works quite well because you can buy the den and also at the same time get the dog bed that fits it and maybe get a little a charcoal air freshener in case the dogs kinda stinky. And then we're using product tabs at the bottom. And this was custom code that we added in a to the turbo theme and based on different variable. Some of these are the same content across all the products and sometimes it changes based on a tag or maybe the product handle. There's different logic for each one of these. So the first one is an overview that explains a lot about the den house and the den you're looking at.

And then there's features specific to that den that stored in the metafield. There's sizing tabs. There's different sizing for each of the dens have different sizing. Some are for larger dogs, some are for smaller dogs. So it explains that for the customer, those are actually stored in pages. And then based on which product is selected, it picks the appropriate page. We've got a reviews tab for the reviews app. And then the widens, you know, why, why do you need a den for your dog? Should an explanation for people who are on the product page and really wondering do they need this for your dog or not? And then a little bit of a story behind that particular den. So now it's got out of the footer and show you some of the evergreen pages we have here. The first one I'll show you to contact us.

We now switched you out to our happy dogs' lifestyle photography. We've got a few of those, that motif going on on the site also. And here we have the details template. Turbo theme does was an alternating text contact us box and a nice little a Google map at the bottom also. Then we also have a couple other so sizing chart. You know, I talked about on the product we have a tab for sizing and each one of those was driven by a different page. And what we did on this page here is the tabs are now just for the different dens. So you can quickly go and see on the Bauhaus what does the sizing chart look like for that one. You can see it's for small and medium dogs, but then you can also see for instance, in the townhouse, ah, that's for small, medium, large extra large dogs.

So same information, just showing in a couple of different places. So people, regardless of where they are on a sharp experience, are gonna be able to find the information they're looking for. We also use a FAQ a the accordion treatment for FAQ is that I really liked the way that opens and closes. So we did that on an FAQ page. We also did the accordion functionality. I think it was a helpful hints. Yep. We've got that FAQ page and there's, there's a happy dog with its yours bouncing up. It's having such a good time outdoors. We also have, I think there's one other page I wanted to show you here. Yeah. We have the a reviews page, which is a summary of all the reviews from or stamped out IO a reviews information. And we're also here in the footer.

We've got that a review seal from show, the total interviews. And this is a new app for them. So there's only 11 reviews, but that number was automatically go up as new reviews come in. So that's really helpful for the customer. And you can see here in the header we've got the top bar talked about the free shipping information up there already. But we've also got the phone number in there to build trust to the customer. Letting them know that there's actually a published phone number, put that front and center on the site and it's also a sticky nav here. So as we scroll down the page, the sticky nav starts popping up with the important shopping information. So you'll notice that we have going on in our header nav is just product shopping, right? And the search box, we don't have any about us.

We've got a lot of story information you see down here in the footer, there's some wide den house den stories, model profiles, all sorts of information here. Let's look at the den stories one. For example, all sorts of information here about the different products and how to choose between the right one for you and all that good stuff. We, we have that there. But in the top we kept it focused just on the browse shopping experience. So that is the DenHaus site refresh that we did in the turbo theme in a Shopify store. Thanks for watching.

Responsive Views of the Homepage

Pinterest Board of the Project

JadePuma is a certified Shopify Expert. If you need any help with your Shopify store, we can help.