Front End for WordPress: Get into Context

What you'll learn
- The learner will understand how the front end of a website works, distinguishing between the front end from the back end and appearance from functionality, and understanding how both work together.
- The learner will understand WordPress’s core features to customize a website
- The learner will be able to make better decisions about whether we should make changes to CSS, the functionality of a website or the entire page structure altogether.
Frontend is where we see the magic happening: it’s the storefront of your websites. Many times, it’s a mix of functionalities and simple styling choices. It’s important to distinguish both to plan and decide which one you will tackle.
In Front End 101, you will learn more about customization of your website’s appearance and how to do so correctly without needing too much assistance or the fear of breaking your site – well, we will teach you some tricks to prevent the latter.
At the end of it, you will understand the basics of how the front end works, how it interacts with the back end and how you can customize a website to match your client’s style. We will teach you basic but effective tricks to change your website.
We will look at distinguishing hardcore features from changes in appearance alone – after all, only some things that look pretty are done by adding colours and glitters. Cogs often work behind the scenes to make the magic happen.
This course will use only WordPress references but may also apply to other CMS.
Course Content
-
What's the front and back end, and why does it matter?
-
The Most Basic Concept: Appearance vs Function
-
Understanding What’s Wordpress Once and for All
-
Wordpress Content Types: What Are They and Their Differences
-
Posts, Pages, and Themes: Making a Sense Out of It
-
Making the Right Call: When Can We Customize and When Should We Create New Functionalities
-
A Quick Review of Front-end Programming Languages
-
Browser Tools: Accessing Developer Tools
-
Understanding HTML: A Quick Guide
-
Understanding How CSS Works: the First Look Into It
-
CSS Glossary: Understanding How to Target Elements
-
Hands-on: Creating Your First Styled Element
-
Making the Right Call: Deciding Where to Spend Our Time on
-
Basic concept of web design and layout: CSS box model
-
Values and Units in CSS
-
Structuring Your Content: the Building Blocks of the Internet
-
Hands-on: Creating Content and Styling it
-
How to preview your changes before going live
-
Editing Your Content on WordPress: Editors
-
Different Ways to Create Your Content: Wp's Native Editor, Page Builders, Template, and Custom Content
-
Hands-on: creating your first page from scratch