Book Image

Mastering Adobe Commerce Frontend

By : Jakub Winkler
Book Image

Mastering Adobe Commerce Frontend

By: Jakub Winkler

Overview of this book

Navigating the frontend realm of the Adobe Commerce platform can often feel like a labyrinth, given its multifaceted systems and intricate layering. This book demystifies Adobe Commerce frontend development, guiding you through its paths with clarity and precision. You'll learn how to set up your local environment, paving the way for a smooth development experience and navigate the platform's theming ecosystem, exploring layout XML systems and the power of templates. As you progress through the book, you'll leverage an array of JavaScript libraries and frameworks that Adobe Commerce boasts of, with special emphasis on RequireJS, jQuery, Knockout.JS, and UI Components. Additionally, you'll gain an understanding of the intricacies of Adobe Commerce CMS, explore frontend-related configurations in the admin panel, and unlock the secrets of frontend optimization. Practical exercises provided in the book will enable you to create top-notch Adobe Commerce sites that are functional, optimized, user-centric, and a step ahead in the ever-evolving frontend landscape.
Table of Contents (18 chapters)

Scheduling theme changes

Let me introduce you to how to plan and schedule design changes. This configuration section is available under Content | Design | Schedule. I’ve decided to give this design configuration a separate section, as it works the same for product pages, category pages, and CMS pages as well.

Scheduling design changes allows us to plan ahead when a theme should be changed on the frontend. Yes, a “new theme” or a “special occasion” theme needs to be prepared ahead of time. The purpose is simple – allow the theme to change based on your merchant’s preferences.

The first section shows you all the design changes for the general store configuration:

Figure 12.15 – The design change list

Figure 12.15 – The design change list

In order to add a new design change, you just need to click Add Design Change and fill out the following form:

Figure 12.16 – The DESIGN CHANGE form

Figure 12.16 – The DESIGN CHANGE form

You can specify...