Like learning any foreign language, it helps to have things broken down in a way that is easy to understand. Although I am in no way an HTML expert (there are still many things I am learning myself), I hope that my beginner's insights will help you to better understand some of the fun things you can do.
This series was created by a Weebly user. Therefore, all HTML bits should work great with most, if not all, Weebly run sites. That said, many of the tutorials in this series will be helpful for Wordpress and other website builders too. Of course, a few minor HTML changes may be required.
I will help you the best I can, and if for whatever reason I am unable to help you, I have found the w3schools' forum to be an extremely helpful place to ask questions and get answers. In fact, lots of what I'll be sharing over the course of the series, I learned on w3schools.
You'll get to learn about everything I have discovered along the way since I first started creating my shop almost two years ago. Many sections will be HTML based and others will be creativity based. All have been designed to help you set up shop in the most cost effective way possible. I am confident that you will have fun learning in each section.
Quick disclaimer: There may be some limitations to what you can do with your shops because this series is created to reduce fees associated with running a shop and by my limited knowledge about HTML. You'll have to decide for yourself, if you will let those limitations hold you back or not.
Feel free to take what works for you and forget about the rest. This is your shop and it should be how you want it to be.
Here's what you have to look forward to during this series...
Lesson 2: Designing Shop Buttons - There's nothing more fun than making things personal with your own customizable buttons that match your website theme. So this lesson will show you how to make "add to cart", "buy now", "view cart", "download" and any other fun button you'd like to have using simple photo design tools.
Lesson 3: Ravelry Shop Buttons - If you're planning to sell downloadable PDF crochet/knit patterns, Ravelry offers a very simple code you can link on your site. This lesson will show you how to combine this code with your newly created buttons.
- If you're not on Ravelry yet, I highly recommend that you start adding you patterns there. It's a great way to help others find your patterns and it is also a cost efficient way to sell you patterns as instant PDF downloads.
- Checkout this amazing tutorial over at Oombawka Designs to see how you can add your patterns to Ravelry, and check out this Ravelry tutorial to see how you can add those patterns to your Raverly Shop.
Lesson 4: PayPal Shop Buttons - If you'll be selling handmade items, or if you want to run your store with fewer costs, PayPal allows you to create your own shop buttons. This lesson will show you how you can do this and how you can combine it with the buttons you designed in lesson two.
Lesson 5: Download Buttons with Google Tracking - This next lesson will help you to create download buttons that are best suited for digital files you'd like to offer for free. In addition to this, you will also learn how to add Google tracking to them, so you can keep track of how many times it has been downloaded in your Google Analytics account.
Lesson 6: How to Make a Return Button - You know those really cool buttons that some websites have that allow you to return to the previous page you were on? This lesson will show you how to make them.
Lesson 7: How to Get a Custom Search Engine on Your Site - It's always handy to have a tool that allows users to search your site. Not all website builders come with them, or if they do, it's an additional cost. This lesson will show you how to can create a custom search engine on your site using Google's handy tool. BONUS: if you are AdSense approved, I'll also share some tips on creating a custom search with their nifty tool!
Lesson 8: How to Make Product Blocks - This lesson will show you how to create product blocks for your category and product pages. Product blocks in this tutorial will include a linkable image and title, pricing details and an "add to cart" or "buy now" button, all wrapped up together with a border around it. These are great for keeping several products on a page uniform.
Lesson 9: How to Make About Product Tabs - Sometimes there's a lot of details about your product, so much so seeing it all at once might be overwhelming to your customer. So this tutorial will show you how you can make customizable tabs to help split your product details into sections.
Lesson 10: Divider Codes - Dividers, also know as HR in the coding world, help break your pages into sections. The standard HR is a boring, old, gray line. I don't know about you, but I'm all about fun and colours, so this lesson will show you some clever ideas for creating your own special dividers.
Lesson 11: How to Make Social Buttons - Help your customers connect with you socially by making your own personalized social media buttons.
Lesson 12: Design Your Shop's Product Page - Now that you've got some ideas, fun codes and gadgets, it's time to design how you want your product pages to look, so you can start getting your products sorted and ready for selling. We'll start with a template that you can copy. This way all your product pages can be uniform.
Lesson 13: Design Your Shop's Category Page - Your shop is slowly coming together. Now we'll create a category page that you can use to sort your products. This will help customers find what they are looking for quickly. Not to mention, it helps make your shop look professional too. We'll start with a template that you can copy for uniformity like you did for your product pages.
Lesson 14: Design Your Shop's Homefront Page - At the end of this series, all that remains is to create your shop's homefront landing page where you can direct your customers and give them a quick idea of what your shop has in store for them.
Lessons 15+: This is the basics of what I know now and hopefully once you've made it to here you will have a shop you can be proud of. Technology is always changing and new ideas are always being shared. There are still some things I am learning about making my shop better. Whenever I learn something new, I promise I'll share it with you!
Check back weekly on Thursdays to see new lessons. As each tutorial is created, this post will be edited so the title of the tutorial will be linked above (hint: the title will turn purple once active)...
Thanks as always for visiting. If you like what you've seen so far and are looking forward to this series, please tell me what you think below or share with someone you know.
Before you go, you may like to join my Website Shop 101 support group on Facebook. It's a great way to keep up-to-date on the latest tutorials for this series. Additionally, you can get answers to your questions quicker too.
Have a fantastic day! I look forward to seeing how your shops unfold. :D