Shopify Theme Customization with Liquid

Shopify Theme Customization with Liquid

by Ivan Djordjevic
Released October 2021
Publisher(s): Packt Publishing
ISBN: 9781801813969

Read it now on the O’Reilly learning platform with a 10-day free trial.

O’Reilly members get unlimited access to books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial

Book description

Discover how to customize Shopify themes for your eCommerce websites with powerful tools and Liquid templates

Key Features

  • Get to grips with the Liquid core to build a solid foundation for working on any Shopify theme
  • Use JSON to create Shopify's famous modular sections with powerful and complex functionalities
  • Utilize the Shopify Ajax API to implement advanced functionality and make your eCommerce stores more dynamic

Book Description

Shopify is one of the fastest-growing eCommerce platforms, which means developers familiar with the Liquid concept are needed now more than ever. This book will help you to build a solid foundation by enabling you to develop your skills from the ground up by gaining essential theoretical knowledge of Liquid and putting that knowledge to use through hands-on projects.

Shopify Theme Customization with Liquid begins by helping you get to grips with basic Shopify information, its interface and theme structure, setting up your Partner account, and creating a child theme, which is essential when preparing for any future work on Shopify. You'll then explore Liquid core features that will provide you with a basic understanding of the Liquid programming logic needed to develop any feature. As you advance to the latest and advanced features, you'll learn about JSON settings, allowing you to create any type of static or dynamic section - a must-have for becoming a competent Shopify developer. Finally, the book takes you through the Shopify Ajax API to gain the necessary skills needed to create a variety of dynamic features and content.

By the end of this Shopify book, you'll be able to take on challenging projects to showcase your theme customization expertise to your future employer.

What you will learn

  • Discover how to use logic and data comparison operators for various types of data within Liquid
  • Use Liquid core features such as objects, tags, and filters
  • Find out how to customize themes using JSON settings
  • Use metafield objects to generate unique content on any page
  • Understand how to output the local or external media content
  • Use Shopify's famous drag-and-drop feature to rearrange sections on a storefront
  • Take Shopify's dynamic functionality to a whole new level using REST API endpoints

Who this book is for

This book is for beginners and experienced CMS developers who want to learn about working with Shopify themes and customizing those themes using Liquid. Web developers designing professional e-commerce websites will also find this book useful. Besides familiarity with standard web technologies (HTML, CSS, and JavaScript), this book requires no prior knowledge of Shopify or Liquid. The book covers everything from Shopify fundamentals and the core of the Liquid and REST APIs, all the way through to the latest Liquid features that may be new to even proficient developers.

Table of contents

  1. Shopify Theme Customization with Liquid
  2. Contributors
  3. About the author
  4. About the reviewers
  5. Preface
    1. Who this book is for
    2. What this book covers
    3. To get the most out of this book
    4. Download the example code files
    5. Code in Action
    6. Download the color images
    7. Conventions used
    8. Get in touch
    9. Share Your Thoughts
  6. Section 1: Shopify Explained
  7. Chapter 1: Getting Started with Shopify
    1. Technical requirements
    2. What is Shopify?
    3. How to start?
    4. Navigating the admin panel
      1. Core aspects
      2. Sales channel
      3. Settings
    5. Managing a theme
    6. Understanding theme structure
      1. Header
      2. Sidebar
    7. Summary
    8. Questions
    9. Further reading
  8. Chapter 2: The Basic Flow of Liquid
    1. Technical requirements
    2. What is Liquid?
    3. Understanding Liquid and its delimiters
    4. Learning the comparison operators
    5. Working with logic operators
    6. Understand the types of data
      1. Strings
      2. Number
      3. Boolean
      4. Nil
      5. Array
      6. EmptyDrop
    7. Controlling whitespace
    8. Summary
    9. Quiz
  9. Section 2: Exploring Liquid Core
  10. Chapter 3: Diving into Liquid Core with Tags
    1. Technical requirements
    2. Getting things ready
      1. Creating the product page
      2. Creating the collection page
      3. Updating the navigation menu
    3. Controlling the flow of Liquid
      1. The if/else/elsif tags
      2. The and/or tags
      3. The case/when tags
      4. The unless tag
    4. Variable tags
      1. The assign tag
      2. The capture tag
      3. The increment tag
      4. The decrement tag
    5. Iterations tags
      1. The for/else tags
      2. jump statements
      3. The for parameters
      4. The cycle tag
    6. Theme tags
      1. The layout tag
      2. The liquid and echo tags
      3. The form tag
      4. The paginate tag
      5. The render tag
      6. The raw tag
      7. The comment tag
    7. Deprecated tags
    8. Summary
    9. Questions
  11. Chapter 4: Diving into Liquid Core with Objects
    1. Technical requirements
    2. Working with global objects
      1. Custom collection
      2. Custom navigation
      3. Product customization
    3. Improving the workflow with metafields
      1. Setting up a metafields app
      2. Rendering the metafields value
    4. Content and special objects
      1. The content_for_header object
      2. The content_for_index object
      3. The content_for_layout object
    5. Summary
    6. Questions
    7. Practice makes perfect
      1. Project 1
      2. Project 2
  12. Chapter 5: Diving into Liquid Core with Filters
    1. Technical requirements
    2. Working with HTML and URL filters
      1. Building a product gallery
    3. Enhancing the product media gallery
    4. Building product accordions
      1. The split filter
      2. The index filter
    5. Math and money filters
      1. Product discount price
    6. Exploring the additional filters
      1. The default filter
      2. The t (translation) filter
      3. The JSON filter
    7. Summary
    8. Questions
    9. Practice makes perfect
      1. Project 3
  13. Section 3: Behind the Scenes
  14. Chapter 6: Configuring the Theme Settings
    1. Technical requirements
    2. Exploring JSON settings
    3. Learning about the input setting attributes
      1. Basic input types
      2. Specialized input settings
    4. Organizing the theme editor
      1. The header type
      2. The paragraph type
    5. Glancing at the deprecated settings
      1. The font input
      2. The snippet input
    6. Summary
    7. Questions
  15. Chapter 7: Working with Static and Dynamic Sections
    1. Technical requirements
    2. Static versus dynamic sections
    3. Working with the section schema
      1. The name attribute
      2. The class attribute
      3. The settings attribute
      4. The presets attribute
    4. Building with blocks
      1. The max_blocks attribute
    5. Enhancing pages with JSON templates
      1. Building a JSON template structure
      2. Upgrading a JSON template with metafields
    6. Exploring section-specific tags
      1. The stylesheet tag
      2. The style tag
      3. The javascript tag
    7. Summary
    8. Questions
    9. Practice makes perfect
      1. Project 4
  16. Chapter 8: Exploring the Shopify Ajax API
    1. Technical requirements
    2. Introduction to the Shopify Ajax API
    3. Updating the cart session with a POST request
      1. The /cart/add.js endpoint
      2. The /cart/update.js endpoint
      3. The /cart/change.js endpoint
      4. The /cart/clear.js endpoint
    4. Retrieving data with a GET request
      1. The /cart.js endpoint
      2. The /products/{product-handle}.js endpoint
      3. The /recommendations/products.json endpoint
      4. The /search/suggest.json endpoint
    5. Summary
    6. Further reading
  17. Assessments
    1. Chapter 1, Getting Started with Shopify
    2. Question 1
    3. Answer
    4. Question 2
    5. Answer
    6. Question 3
    7. Answer
    8. Question 4
    9. Answer
    10. Question 5
    11. Answer
    12. Chapter 2, The Basic Flow of Liquid
    13. Question 1
    14. Answer
    15. Question 2
    16. Answer
    17. Question 3
    18. Answer
    19. Question 4
    20. Answer
    21. Question 5
    22. Answer
    23. Chapter 3, Diving into Liquid Core with Tags
    24. Question 1
    25. Answer
    26. Question 2
    27. Answer
    28. Question 3
    29. Answer
    30. Question 4
    31. Answer
    32. Question 5
    33. Answer
    34. Chapter 4, Diving into Liquid Core with Objects
    35. Question 1
    36. Answer
    37. Question 2
    38. Answer
    39. Question 3
    40. Answer
    41. Question 4
    42. Answer
    43. Chapter 5, Diving into Liquid Core with Filters
    44. Question 1
    45. Answer
    46. Question 2
    47. Answer
    48. Question 3
    49. Answer
    50. Question 4
    51. Answer
    52. Chapter 6, Configuring the Theme Settings
    53. Question 1
    54. Answer
    55. Question 2
    56. Answer
    57. Question 3
    58. Answer
    59. Question 4
    60. Answer
    61. Chapter 7, Working with Static and Dynamic Sections
    62. Question 1
    63. Answer
    64. Question 2
    65. Answer
    66. Question 3
    67. Answer
    68. Question 4
    69. Answer
  18. Appendix
  19. Frequently Asked Questions
    1. Why subscribe?
  20. Other Books You May Enjoy
    1. Packt is searching for authors like you
    2. Share Your Thoughts

Product information

  • Title: Shopify Theme Customization with Liquid
  • Author(s): Ivan Djordjevic
  • Release date: October 2021
  • Publisher(s): Packt Publishing
  • ISBN: 9781801813969