Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Basic CSS Changes | Customizing Pages and Content
Shopify Store Mastery
course content

Course Content

Shopify Store Mastery

Shopify Store Mastery

1. Getting Started with Shopify
IntroductionSetting Up Your Shopify StoreMastering the Shopify Admin DashboardShopify Theme Structure
2. Customizing Pages and Content
Creating and Editing PagesUploading and Managing Media ContentBasic CSS ChangesSetting Up Your Shopify Navigation
3. Advanced Customization with Shopify Theme Editor
Building the HeaderCreating ProductsGrouping ProductsPutting Everything Together
4. Advanced Techniques and Deployment
Setting Up Payment ProvidersConfiguring Shipping and Delivery SettingsSetting Up Store PoliciesLaunching Your Store and Monitoring Analytics

bookBasic CSS Changes

Basic CSS changes allow you to customize the look and feel of your Shopify store beyond the theme's default settings. In this chapter, you'll learn how to create and import a new CSS file to your theme for styling changes.

Steps

  1. Creating a New CSS File: go to Online Store > Themes > Edit Code and open the Assets folder. Click Add a new asset, choose Create a blank file, and name it custom.css;
  2. Adding CSS Code: open your custom.css file and add this code to change fonts and adjust the heading styles:
  3. Linking Your CSS File to Your Theme: go to the layout/theme.liquid file and add the following line before the closing </head> tag to link your new CSS file:
  4. Previewing Your Changes: save your changes and preview your store to see how the font and heading styles have been updated.
1. Where do you create a new CSS file in Shopify?
2. What does the CSS code provided change?
3. How do you import a custom CSS file into your Shopify theme?
4. Why is it useful to make custom CSS changes?
5. What is the purpose of importing the `Poppins` font in the example?
Where do you create a new CSS file in Shopify?

Where do you create a new CSS file in Shopify?

Select the correct answer

What does the CSS code provided change?

What does the CSS code provided change?

Select the correct answer

How do you import a custom CSS file into your Shopify theme?

How do you import a custom CSS file into your Shopify theme?

Select the correct answer

Why is it useful to make custom CSS changes?

Why is it useful to make custom CSS changes?

Select the correct answer

What is the purpose of importing the `Poppins` font in the example?

What is the purpose of importing the Poppins font in the example?

Select the correct answer

Everything was clear?

How can we improve it?

Thanks for your feedback!

Section 2. Chapter 3
some-alt