We talk about Shopify and setting up a store in this Manage Comics Thoughtstream where we do a LIVE install and configure of the Dawn theme! We’ll take your questions and give you the best answers we can, talk upcoming comics, our latest data struggles, and so much more!
Here’s a quick transcript
Let’s jump into a Shopify site, so this is just a standard Shopify install I’ve went in and installed Dawn theme, the default theme for Shopify. This is version 5.0.
I also added some products so I just added a bunch of products through GeekFetch just to make sure that I had a nice little baseline of products in here.
I also went through and, created some collections. The way we create collections is kind of interesting, we will do like look at the comics one which is going to be product type is equal to the product for comics and the inventory stock is greater than zero.
One of the unfortunate things about Shopify is that you can’t do else-if statements which would be wonderful because I would love to be able to add a bunch of different conditions and then say unless the inventory stock is greater is is less than one which would be great because then I could actually show things based on which things are available. Unfortunately for something like this our favorite writers, where we feature multiple writers (such as Grant Morrison, AND Donny Cates, AND Mark Waid), I can’t also say and the stock is equal to to one or more.
I went ahead and created a bunch of different collections just to kind of speed up this process because this is just boring tedious work it has to get done normally when we do this for a store we will create probably close to 30 or 40 collections. We create all the publisher collections we’ll create all the types collections and there’s a few other collections and and we kind of tailor that to every store’s inventory.
Okay moving along so collections so some of the things I’ll still need to do are navigation, and a bunch of other stuff so I usually build a checklist of the things that I’m gonna do.
First of all we already uploaded our logo so we’ve got a logo and we’ve uploaded it into the system, we resized a bunch of images to 1024×675, and I would generally upload those into files so we’ll we’ll just kind of create some images and upload them, and again this is something we do as part of the install if we build your Shopify store.
So that’s all done, if you are looking to to do this yourself there’s a great online tool called Photopea which is basically a web browser version of photoshop this allows you to do things like resize and simple stuff like that and then save it out we try and save our images fairly, fairly compact.
You’ll notice that these are all you know less than generally speaking less than 100 kilobytes even though bandwidth is super super available this will impact having large images will impact your website’s score so your speed score so we try and maintain fairly small images we do the same thing with manage comics we maintain a database of relatively small images high quality but they’re not like 300 dpi dots per inch they’re nice and and tight images.
We’ve already done the legal pages. One of the things that you need to set up legally for your website is a bunch of policy pages, we’ve basically created a some boilerplate information and you’ll see here that I’ve got some things that I would have to link to. I don’t know if I’ve created a contact page yet so I can’t really link to those things but, yeah you can use Shopify’s templates for a lot of this stuff but you do have to go in there and kind of tweak them and remove some information.
This is our streamlined versions of our various privacy policies in terms of service and then shipping policy every single store is different so it depends on how you ship things, what carrier you use etc so you’ll have to fill this one out yourself so we can check off that we’ve created our legal pages.
Next you need to create a navigation for policies and we’ll do that really really quickly in our online store navigations so I’m going to create a new menu and I’m going to call it policies and I’ll just go through and I’ll add all the differentpolicies so I’ll add our privacy policy and then I click add and then I add our refund policy and I’ll add our terms and conditions terms of service and then I save that menu and now that’s done so we’ve made our main policies navigation.
I already have a main navigation, but I’m going to edit it a little bit and underneath catalog I’m going to add let’s add collections, comics and I’m just going to grab that and pull it up here like this and then we’re going to add another one for graphic novels, and we’ll add another one for let’s just add games for now we can add more collections in the future, but this gets us kind of a nice little start so we can check off that we’ve also added our navigation.
Then we’ll go through our vendor collections so I created all those those are available under products collections so I’ve created some vendor collections here Boom, Dark Horse, Image, DC, I created a few different creator collections, so for example Chip Zdarsky if I want to really promote him I can do that as a separate thing and then I’ve created some vendor collections so I will say I’ve done all that.
I will also add product types to filters, with online store 2.0 in your online store navigation you’re going to see this thing down here called filters and we can add different filters like product type and vendor personally I like to make product type at the top I like to make vendor second and then I like to do availability and price so availability means in stock or not and then price is a little slider thing that lets you choose your pricing.
With that also done, now we just have to go in and configure our theme.
We’re going to go ahead and click on themes and click on customize and one of the nice things about online store 2.0 is that they’ve added this whole very flexible, kind of page builder thing.
I’m going to start in the theme settings and I’m going to go to colors and I’m going to say that my solid button label for the foreground color on accent colors we’re going to say that this is actually my main blue so I’ll make that this and I just hit enter and now that color color’s there and then I will change accent one to be that same blue and I’m gonna change accent two to be my darker blue, which is here text I’m gonna go with, it’s like a dark gray which just looks nice, I haven’t actually played with this one for a while here’s a background…oh okay let’s keep that white background two so if I wanted to have like a you’ll see that there’s like a secondary background color in some of these things, for us what we’re going to do is we’ll take my darkest blue actually let’s make it yellow because I like that yellow so we’ll make this one our bright yellow and whenever we see that we should be good so yeah there we go we’ll see it there, so one of the things about dawn the the free version is that you don’t get a lot of choices in terms of your your secondary and tertiary colors.
We usually use either Expanse or Warehouse as our as our primary themes and they’re actually really really good witha lot of this stuff.
I also like to usually change the font and mine is like Poppins is a nice font, it’s just a little bit kind of it’s more friendly I guess is the way I would put it so I’ll choose that as my body o and I think this is this is my header font headings so for headings I like to do, probably extra bold which is this kind of fat header and that will look really really nice.
Then we can also increase the size of the font so let’s say we wanted to make the regular font just a little bit bigger go like 110 and our buttons kind of increase the thickness of the border a little bit we’re going to give it a little bit of a corner radius and that looks good variant pills I don’t even know what a variant pill is,
I am looking for favicon so our favicon is our little robot guy’s head, let me throw in an image here you’re probably not seeing my picker right now this is really boring. Icons so I use my little robot guy so we’ll select him as our favicon and I think that should do us for you can get in here and really kind of fine tune a lot of different things, we can select which social medias we want to be on so we’ll put that in and I’ll just update that, and we’ll do Instagram so that will be all of our those guys there.
Search behavior I think that one’s interesting too I believe that this lets us yeah we can show vendors or show prices in search things but let’s just update our logo and Update what we’ve done to set this.
You can change your background based on different available colors that you have, so I’m going to choose to keep it white for now, we’re going to use our main menu as our menu and we’re not going to add any spacing to it the announcement bar is this thing at the top so we can customize this by changing like the color scheme if we wanted to I think we’ll use the yellow.
That’s kind of our top and we can change the words in here too so we can say like, subscribe oh trying header I will also change the width of the logo a little bit there we go that looks a little better and I think I’m gonna see if I can…yeah I’m gonna put the logo above the nav, this just gives us a little more flexibility with our nav so we can change some more things and add more stuff as we’d like to and then from there you just go in and start changing things out so I could, you know image banner what I really want to say about this is that this is your subscription super store and I can say get all of your subscription needs in one easy place. Our button will go to shop all products. Then we can change this image here I’m going to put in my robots picture that I like and we can give this a little bit of a opacity increase and then we can change the size of this thing so it’s not quite so big so we can go small medium or large so I’m going to go with the medium one, just for fun I’ll just drop this talk about your brand we’re going to change this to latest comics we will change this to the comics collection comics.
and we can kind of tweak this thing and see how many items to show so we’ll show let’s say four items on the desktop and then we can also have a, I believe we can have a link so obviously I got to do some work on my button styles because that’s not great so I have to tweak our button styles so once you get start getting some things in here then you can go in and make things look better, but we’ll create another, feature collection oops we’re gonna add another feature collection and bring this up to the top and for this one here we will keep it small and we’re going to call this graphic novels and we will select the graphic novel collection and then we’ll I don’t like the collage we’ll remove that one video is kind of useless multi-columns kind of cool we’ll also add let’s say a image with text let’s add a couple images with text so image with text is kind of a cool, thing that lets us do so we’ll select an image on this side and we’ll change our words changes to say so this is one of those things where you can actually start to create your individual um instead of button label this will say shop chip our button link will go to collections chip sitar ski, so yeah this is the kind of stuff that you can really start to get into making your store unique to you so even though all the all the the kind of pieces of of a Shopify shop are the same what makes a Shopify shop different and unique is how you treat those individual pieces so you can really get into this and and start our favorite writers you can really start to make things your own by you know adding your own information here and our button we will make this collections our favorite writers our image we will change to this guy oh no these guys they’re cute um and we can also change which side the oops which side the image is on so we can no that’s not there maybe that’s not available in ah there we go so if we’re doing that then we probably want to right align the content so it looks a little nicer now on the on mobile we’ll leave it left aligned and it’ll look really sharp so I kind of like all this stuff uh featured artists so here we might have three different columns like latest comics shop you’re and we’ll collections comics shop comics image a comic image right and then here we’ll say um and we will say collections and then last but not least we will say and our collection will be games image something like that so really quickly we have created kind of a fairly unique, looking website so with my buttons why are my solid button label that’s why yeah there we go so actually I like I like pairing up that blue with a nice yellow so there we have it and that is a really really quick kind of walk through of how we build a store there’s a ton of other stuff you can do so down here in the footer you can subscribe to your email explain why that’s important you can add some information about your mission so you could actually change this to say like about subscribe otron i should have made this an easier name and then you know we are your sub i like to save things frequently, as I’m going through and doing things because I’ve had internet outages I’ve had Shopify reset my connection you just never know what it’s going to be so the next thing we’ll do is we’re going to go into our collections list and we’re going to default collections and this is cool we can change a bunch of different things on the collection so we can change the background on our collection banner which is kind of fun, oh that looks much better so now that we’ve got a nice background color on accent one I wonder if accent two oh it does so yeah we can kind of change this up a little bit so it looks nice our product grid we can do some things with, filtering so we can actually say give me vertical filtering which I like a little bit better we can say i think there’s a way to open well not necessarily um yeah we can show the vendor we can show the product rating on the actual product, but yeah I’m pretty happy with that we can go into our collections list so this will be like the big list of collections and with this one you could actually kind of customize this so instead of it showing everything you could just show certain collections so you could choose which collections to show, you may not want to show like you know our favorite writers and our favorite and chip and our favorite artist for example, so you what you might want to do is reduce the amount of collections that you have available and I think you can do that on you might not be able to though on the the default dawn theme that might be something you have to have one of the other themes for in our products if we go to a product page so we’ll just go to a default product and over here you can start to change some of the different things available so for example there’s a bunch of things here that don’t really matter so we’ll just get rid of those blocks and you can add different pieces of information so shipping and returns maybe we want to say free local pickup we can change the icon from truck to there should be like a store or let’s change it to I think this is a little package no price tag maybe that’d be fun yeah that’s fun, for care instructions we’ll change this one to, free local pickup and there was something I was gonna say on when I was seeing all these little things oh the box is actually what I wanted for free local pickup box looks good oh I know what I was going to say for a lot of people like to see the lock and you can say secure payments, makes people feel better about things when they know that the payments are secure, there’s also the ability to add some extra information so you might want to add like some standard information that shows up on every single product so if for example you include a bag and board with all comic purchases you could say that here that’s kind of up to you so I’m just going to remove that because we don’t really need it we’ve also got multi-column with free shipping and hassle free exchange so you can kind of change that and then this is just something that gets built in its product recommendations you can say you know whatever you want to say about that kind of stuff you can also add other select sections including featured products or image banners or multi-column like whatever you want, is is here kind of built in so yeah you have a lot of kind of control over your your product page as well, let’s also go to oh blog posts cart checkout so yeah we can we can go into our checkout and see if there’s anything we want to customize here well that’s seeking a wall there we go so if there’s anything, that’s customizable in your checkout it doesn’t look like this particular theme has anything that you can customize you can take a look in your cart if there’s things you can change here so it looks like you could change the subtotal price and the checkout button, I think the checkout button no no settings there subtotal price no settings you could get rid of the featured collections if you want to um i guess the last thing that we’ll do is a couple more settings things, so we’re actually done kind of all the customization that we need to do on the actual website and we’re going to go and take a look at the the website in a couple of seconds, but there are a couple other settings things that I want to do to kind of wrap up this whole thing so one of them will be we’re going to jump into checkout and I’m going to require accounts so this is specifically for manage comics customers can’t sign up to manage comics without an account and I also just recommend that you should have people have an account I think it’s just a good kind of practice to be in the other thing we’re going to change is notifications we will change the look and feel of our notifications so I’m going to chain I’m going to add my logo, so now my net any any of the emails that get sent out will have my logo and they’re also going to have my main color here so I’ll change my accent color to this one and once I save this you have to kind of click on something to to see what that looks like but as you can see everything is going to have a little bit more of my branding instead of the default brand so we’ve got the logo in there and we’ve got our navigation or our checkout button and all of our links also use that same color right so we are rocking and rolling here so that is kind of um that is a quick way of setting up Shopify and as you saw that like that was 30 minutes and in 30 minutes plus or minus you know another half hour for me to crop all those images and everything like that, I got a store going and so let’s take a look at what this store looks like so when we started this day my store looked like this with about an hour’s worth of total effort I’ve got a store that looks like this so I mean that’s not too bad for for very little effort, we can go and take a look at our main catalog page oh my link doesn’t go anywhere that’s interesting so I’ll have to fix that first link because I would like that and let’s just do that in real time navigation main menu catalog I want that to go to all products so one interesting thing is when you make changes to your your navigation sometimes that takes a little while because um that sucks, sometimes it takes a little while for for that I wonder if it’s because there’s a drop down there so you can’t actually have a link on the main let’s just create a new item we’ll call it all products and I’m going to move it to the very very top of this one so as I was saying sometimes it takes a little while for your, your links to show up so if you get into a situation where it’s not refreshing give it a couple minutes and it’ll it’ll catch up to it but there’s our all products screen and then we can see our comics and we’ll see our graphic novels so yeah and then this goes through the products and as you can see we’ve configured this so it says free local pickups and secure payments we have an account page where you can sign up we have your cart and yeah we’ve got our social medias down here some quick links which you can edit these quick links so they can be more information you direct link to search from here yeah it’s a it’s a pretty decent little site for a couple minutes worth of work so that is how you set up Shopify and we’ll include some information in the description of this video once we’re done we’ll, we’ll kind of write some some more info up yeah but I’m gonna check that guy off and I think we are done with our configuring of Shopify.
