skillshare conclusion-chapter-3

3
Conclusion to Chapter 3: The Storefront Theme Here’s what we covered in the Storefront chapter. Storefront Review By now you will have installed the Storefront theme. If you haven’t already done so please refer back to the lecture to install the Storefront theme in the previous section. I showed you how to access the Storefront sections and the shopping cart. I reviewed the installed Storefront pages and the shortcodes. We also touched upon the WooCommerce options panel. Configure the Menu Locations Before we populated the store, we configured our store menu settings. You configured the menu locations to create a Primary, and a Secondary menu. I showed you how to add menu items. Create the Homepage You created the Storefront homepage. I showed you how to setup the Storefront homepage that displays a selection of products from your store. You created a new page and assigned the "Homepage" template to it. When you create a new page for the Home Page you need to assign the "Homepage" template to it. After you create your page, under Page Attributes => Template set to Homepage. You then set that as a static homepage in the Reading settings. Currently the homepage was empty as we added some products in a later lecture. Homepage Control Plugin The Homepage Control panel is an optional free plugin. I downloaded and installed the Homepage Control plugin I showed you how it works and what you could do with it. Once setup you can toggle and reorder the homepage components using the plugin. I previewed the home page and assigned it to the Primary menu. At this time the homepage was still empty as we prepared to populate the store with products.

Upload: viet-nghiem

Post on 16-Apr-2017

19 views

Category:

Education


0 download

TRANSCRIPT

Conclusion to Chapter 3: The Storefront Theme 

Here’s what we covered in the Storefront chapter.   

Storefront Review   

By now you will have installed the Storefront theme. If you haven’t already done so please refer back to the lecture to install the Storefront theme in the previous section.   

I showed you how to access the Storefront sections and the shopping cart.    I reviewed the installed Storefront pages and the shortcodes.    We also touched upon the WooCommerce options panel.   

Configure the Menu Locations   

Before we populated the store, we configured our store menu settings.   

You configured the menu locations to create a Primary, and a Secondary menu.    I showed you how to add menu items.   

Create the Homepage   

You created the Storefront homepage.   

I showed you how to setup the Storefront homepage that displays a selection of products from your store.   

You created a new page and assigned the "Homepage" template to it.  When you create a new page for the Home Page you need to assign the "Homepage" 

template to it.    After you create your page, under Page Attributes => Template set to Homepage.    You then set that as a static homepage in the Reading settings.    Currently the homepage was empty as we added some products in a later lecture.   

Homepage Control Plugin   

The Homepage Control panel is an optional free plugin.   

I downloaded and installed the Homepage Control plugin  I showed you how it works and what you could do with it.    Once setup you can toggle and re‐order the homepage components using the plugin.    I previewed the home page and assigned it to the Primary menu.    At this time the homepage was still empty as we prepared to populate the store with 

products.   

The Customizer   

Next you learned how to adjust the Storefront’s appearance with the WordPress customizer. I reviewed the customizer settings available for the Storefront.   

Add a Logo   

I showed you how to install Jetpack. You activated Jetpack to enable a custom logo option in the customizer. The simplest way to add a logo to the theme is to activate Jetpack. If for some reason you prefer not to activate Jetpack and you are a more advanced WordPress user, I included a link on how to add a custom logo in the resources section of the Add a Logo lecture.   

Import Data   

You then used the WordPress importer to locate and import data.   

I demonstrated how to install the dummy data.    The dummy data for WooCommerce is located in a file called dummy_data.xml  This data is located in the WooCommerce plugin directory.  I showed you how to FTP to your website’s server files. 

I also showed you how to download the woocommerce plugin to your computer unzip it, and the file will be in /woocommerce/dummy‐data/dummy‐data.xml.   

You could also go to the plugins repository and download the plugin to your machine if you don’t want to use the FTP program.   

Go to the Woothemes site.  Download the free woocommerce plugin: http://www.woothemes.com/woocommerce/  Save it to your machine.  Unzip the file and you’ll have a copy of the dummy_data file on your machine 

You use the WordPress importer to locate and import the WooCommerce dummy data.   

I showed you how to change the product and catalog image sizes. I also showed you why and how to regenerate your thumbnails.   

Widgets   

In the widgets lecture I reviewed the Storefront widgets area.   

You learned how you can add content to the header, sidebar and the footer.    With Storefront you have 6 widgets regions. Header, Sidebar, Footer x 4.  I showed you how to change the background colour to the footer area.   

Products   

Finally I reviewed the Storefront products. You learned how this structure gives you the foundation to populate the store with your own products. It’s a good starting point to see how a final store will appear and now you can start creating your categories and products.   

Think of the dummy data as a convenient way to help you populate your store. You will find it much easier to work with a store that already has content rather than an empty store. Once you study the structure and understand the product setup it will be easier for you to re‐populate the store with your own products. You will be able to add in your own products anytime. Simply delete the existing dummy data when you no longer need it.   

Create a Child Theme 

Here’s what we covered in the Storefront Child Theme.   

This section is an optional bonus section for the advanced user. I demonstrated to you how to create your own child theme. You could also download the child theme files for Storefront created in this lecture. I also showed you how to download and install an FTP program.   

1. In the theme directory I created a folder for the new child theme 2. I called it storefront‐child 3. I created a stylesheet with information about the child theme 4. You must include, “Theme Name" and “Template. 5. I pulled the styles from the parent theme using a functions.php file 6. Then we uploaded the files to the theme directory