2014
Lynda
Morten Rand-Hendriksen
6:23
English
Ready for your next WordPress challenge? Learn how to build more complex custom themes using the _s (aka Underscores) starter theme. Morten Rand-Hendriksen takes you from basic layout and customization to enabling advanced responsive design and accessibility features. He reinforces the basics lessons with DRY (don't repeat yourself) development practices and a structured approach that will help you build WordPress themes that meet modern standards. Plus, he'll explore core concepts like understanding the WordPress template hierarchy, creating functions, adding custom JavaScript, applying styles, and more.
Introduction
Welcome
What to know before you start this course
How this course and the lesson files work
Introducing Simone: A preview of the final project
1. Setting Up a WordPress Development Environment
Installing and running WordPress on your computer
Getting and installing Underscores
Installing WordPress Theme Unit Test data
Installing the Developer plugin
Installing and setting up NetBeans or another IDE
2. The Design-to-Development Process
Designing for mobile, content, and style
How do WordPress themes work?
Understanding the WordPress template hierarchy
Underscores: An overview
3. Setting Up the Basic Theme
Setting up style.css
Configuring baseline settings and functions
Enabling custom fonts and font icons
Applying global styles
Styling basic layout components
Making the site layout responsive
4. Building the Header
Styling the default header
Hiding the site title and tagline
Adding an optional header image function
Placing the header image behind the site title
5. Working with Menus
Setting up menus
Styling the menu
Using Superfish for accessible menus
Making the menu responsive
Creating a custom social media menu
Styling the menu with icons from Font Awesome
6. Adding a Custom Search Form
Adding the search form
Adding the search icon
Adding show/hide functionality to the search form with jQuery
7. Working with Widgetized Areas
Adding a widgetized area to the footer
Using the Monster widget plugin to test all widgets
Styling the footer
General widget styling
Adding custom styles to specific widgets
Using Masonry to make footer widgets responsive
8. The Single Post Template
Changing the Single Post Template content structure
Changing the output of meta elements
Styling the Single Post Template
Making post meta responsive
Styling blockquotes
Creating pull quotes and pull images
Working with image captions
Working with image galleries
Single-post navigation
9. Working with Comments
Working with the comments template
Using Gravatars in comments
Styling comments
Highlighting post author comments
Styling the comment form and messages
10. Working with Featured Images
How do featured images (post thumbnails) work?
Defining featured image sizes
Generating new featured images with a plugin
Adding featured images to a template
Styling the featured image
11. Working with Index Templates
The index template hierarchy
Customizing and styling index templates
Displaying excerpts or full content on index pages
Adding a custom Read More link
Adding featured images
Creating custom pagination navigation
Highlighting Sticky Posts
Creating custom post format templates
Highlighting the most recent post in the index template
Embracing modular design
Working with archive.php
Customizing the search results and the 404 template
12. Working with Static Pages
Styling pages
Creating custom page templates
13. Back-End Customization
Adding editor styles to match front-end styles
Conclusion
Further learning
Download File Size:1.11 GB
|
