Hi there! 👋 Are you looking for a way to develop/code your own Shopify theme? Or learn more about themes to help with your career as a Shopify Developer? If so, this course is for you! Here's an up to date tutorial that works with Shopify's new Online Store 2.0 theme architecture.
In this tutorial, you will learn how to create Shopify themes from scratch using the Shopify platform and their tools. We'll go through all the folders and files needed to get a Shopify Theme started. This includes the whole store from homepage, products, collections, cart, checkout, blog, articles, and many more. Pages like products, collections, and articles will use custom content from the Shopify Admin. Along with other data like metafield that the Shopify platform provides. There will be a deep dive into product pages because of how integral it is to ecommerce, where we look at pricing and product conditions to match different styles of a product page.
We will also learn about Shopify's Liquid language that help get data from our store. We'll learn the basics, the syntax, tags, filters, and objects that help build different pages will using Shopify's documentation.
For this course, we will be using the CSS framework Bootstrap to help code our pages faster without worrying too much about styling and making our site design. More time programming and less time thinking how our site should look. Plus, this is more to learn about Shopify Development than learning CSS.
With that said, Welcome! And thanks for joining me on the journey of learning everything related to Shopify Theme Development!
- Introduction to Shopify Theme Development Course: Create Custom Themes for Your Shopify Store
- Setting up your partners account
- Code Editor (IDE) for Shopify Themes
- Local Shopify Theme Development with Theme Kit
Shopify Liquid Basics
- Liquid syntax and whitespace control
- Variables, assignments, and naming conventions
- Types of Data
- Comparison Operators
- Conditional Statements
- Iteration on arrays using the "for" tag
- The "liquid" Tag and Inline Comments
- A Guide to Math Filters
- Append, Prepend, and Split
- Text Transformations: Capitalize, Upcase, and Downcase Filters
- Refining Text Strings: Remove and Replace Filters
- Text Truncation: Truncate and TruncateWords Filters
- Whitespace and HTML Management Filters
- Filters size and slice for Arrays and Strings
- Access Array Elements in First and Last Filters
- Working with Arrays: A Deep Dive into Concat, Join, Map, and Compact Filters
- Date Filter
- Default Filter
- Json Filter
- More content coming weekly...