Book Image

Magento 2 Cookbook

Book Image

Magento 2 Cookbook

Overview of this book

Magento 2 is an open source e-commerce platform that has all the functionality to function from small to large online stores. It is preferred by developers and merchants due to its new architecture, which makes it possible to extend the functionalities with plugins, a lot of which are now created by the community. This merchant and developer guide is packed with recipes that cover all aspects of Magento 2. The recipes start with simple how-to’s then delve into more advanced topics as the book progresses. We start with the basics of setting up a Magento 2 project on Apache or Nginx. Next, you will learn about basics including system tools and caching to get your Magento 2 system ready for the real work. We move on to simple tasks such as managing your store and catalog configuration. When you are familiar with this, we cover more complex features such as module and extension development. Then we will jump to the final part: advanced Magento 2 extensions. By the end of this book, you’ll be competent with all the development phases of Magento 2 and its most common elements.
Table of Contents (16 chapters)
Magento 2 Cookbook
Credits
Foreword
About the Authors
About the Reviewer
www.PacktPub.com
Preface
Index

Adding CSS/JS to pages


Adding your own CSS or JS to every or specific page can also be done through a layout XML file. The source of a file that you want to include can come from the following:

  • An external source hosted remotely

  • Module-specific, which is mainly used by JavaScript

  • Theme-specific, which is mainly used when adding CSS but can also be used to add custom JavaScript

Getting ready

In order to include CSS or JavaScript to a page, you first need to know where you want to include your files and where the file is located that you want to include. In this recipe, we will see how to include both an external CSS and JavaScript file and a theme JavaScript and CSS file.

How to do it…

This recipe is based on the theme created in the Creating a new theme recipe of this chapter.

  1. To add a new source (CSS or JS) to all pages, the configuration is done through the default_head_blocks.xml file. It is also possible to add it to a single page only through the layout file for that layout handle:

    app/design...