Course: Publ 1232 | Title: Advanced Web Design |
Credits: 3 | Room: A247 (Mac Lab) |
Term: Summer 2017 June 20 – July 29 (final assignment due during exam period) |
Days/Times: Tuesday: 130-420 Thursday: 1130-120 (Lab) Office Hours: by appointment |
This class builds on the prerequisite course Publishing 1220: Web Design Fundamentals.
The class itself will largely focus on WordPress — how to use it, and how to build themes for it.
Like anything in life, this outline is subject to occasional changes.
Throughout the term, I will add many links to additional supporting content.
Learning Outcomes
By the end of the class, the student should be able to:
- Understand important principles of content management systems
- Set up a self-hosted WordPress installation
- Make posts, pages, media galleries.
- Configure menus, widgets, plugins, themes.
- Understand WP user roles
- Understand and follow WP security best practices
- Understand the WP template hierarchy
- Make WP child themes
- Build basic WP themes using starter themes
- Produce sophisticated visual designs for WP
Textbook & Other Costs
There is no textbook for this class. We will use a number of online videos.
For the first couple weeks of the course, the primary video series will be from Lynda.com:
WordPress: Essential Training
For the second part of the course, the primary video series will also be from Lynda.com:
WordPress: Building Themes From Scratch Using Underscores
Both videos, and a bunch more, are by a Vancouver developer named Morten Rand-Hendriksen. They are an excellent resource, so be sure to watch them.
Course Structure
The class schedule is detailed below.
There are zero lectures that can be easily missed. It is your responsibility to make sure that you do not miss any announcements or course materials given in any class.
Any additional announcements will be made via email to your mylangara accounts.
Assignment Details
Due dates & descriptions are given in the schedule below.
Additional information may come via class handout or modifications to this web page. You will be informed of any changes.
Assignment Mark Values
Assignment One: Install Testing WP on Own Domain | 10% |
Assignment Two: Themed Portfolio Site | 30% |
Lab Exercises | 35% |
Midterm | 25% |
Assignment Descriptions and Due Dates
Week One: June 20–22 WP Dashboard Pt 1
- Introduction to Content Management Systems
- WordPress Stats: https://builtwith.com
- WordPress.com vs WordPress.org
- Static vs Dynamic Websites. Dynamic URLs.
- Installing WordPress via Host Company Control Panel
- Setting Up A Development Environment: MAMP
- WordPress Directory Structure
- The Dashboard
- Visual vs HTML edits
- Posts, Pages, Categories, Tags
- read more…
- Summaries
- Media
- Featured Images
- Galleries
- Static Home Pages
- Permalinks
Readings, Viewings, Resources
- Comparison: DotOrg vs DotCom
- Setting Up A Test Environment With MAMP
- Lynda.com: WordPress Essential Training Chapters 1-5
- Lynda.com: Installing and Running WP: MAMP, Chapters 1-2
Download: Day One Files
Week One Lab Exercise
Week Two: June 27-June 29: WP Dashboard Pt 2
- Appearance: Theme Customizer, Menus, Widgets
- Appearance: Themes, Custom Headers
- Themes
- Widgets
- Plugins
- WordPress Security
Readings & Viewings
Week Two Lab Exercises
- WordPress Themes Exercise
- Big WordPress Configuration Exercise
- Theme & Gallery Plugin Setup Exercise
Next Thursday, we will have our MIDTERM. You will need to know any of the info from WordPress: Essential Training—particularly the following things:
- how to set up a test configuration of WordPress
- how to configure a menu
- how to set a static front page and assign another page for blog posts
- how to use and configure widgets
- how to install and setup a theme.
- how to configure a typical plugin. Specifically, I will ask you to install a particular plugin, and you will need to figure out how to configure it.
You will be allowed to use any resource, including the Internet. You will not be tested on any of the theme development content from next Tuesday’s class.
Week Three: July 04 – 06: Theming Pt 1 & MIDTERM
- DRY vs WET: The Point of Templates
- The WordPress Template Hierarchy
- index.php, single.php, page.php, 404.php
- Importing Sample Content
- Theme Foundation Parts: get_header(), get_footer(), get_sidebar()
- Basic Template Tags: the_title(), the_author(), the_content(), the_post_thumbnail(), etc
- The Loop
Readings, Viewings, Resources
- SASS Basics
- Creative Blog: SASS In WordPress
- For Novice Developers: Anatomy of A WordPress Theme
- Default WordPress CSS Classes
- Another Listing of WP CSS Classes, from Chris Coyier
- Even More From Chris Coyier on the Subject…
- Lynda.com: Building Themes from Scratch Using Underscores
Resources
Thursday Lab Time: Midterm Exam
Week Four: July 11-13: Theming Pt 2
- Working with a Starter Theme
- Template Hierarchy: Archives ( category, tag, date, author, etc )
- get_template_part()
- Functions.php
- add_theme_support()
- wp_enqueue_style()
- wp_enqueue_script()
- register_nav_menus()
- Icon Fonts in WP
Week Four Class Exercise
- Theming Basics Magazine Exercise
Week Four Lab Exercise
Readings & Viewings
- Class Files Download
- WordPress Templating Links ( please read )
- Your First WordPress Loop
- Installing SASS and Netbeans
- Downloading the Underscores Starter Theme
- Using Netbeans & SASS with WordPress
- Lynda.com: Building Themes from Scratch Using Underscores
Chapter 1: All parts, except WP Theme Data and Automate Theme Development
Chapter 2: All parts
Chapter 3: All parts, except Allow Translators and Preconnect
Chapter 4: All parts
Chapter 5: All part, except the two JavaScript discussions
Week Five: July 18-20: Theming Pt 3
- Conditions
- Multiple loops with wp_query
Readings & Viewings
- Lynda.com: Building Themes from Scratch Using Underscores
- A Walk Through Conditional Tags in WordPress
- Ultimate Guide to WP Conditional Tags
- Codex: Conditional Tags
Week Five Lab Exercise
Week Six: July 25 – July 27: Work
- Tuesday, First Part of Class: WordPress Security
The rest of the week will be time to Work on your final WordPress-based Portfolio Site
Please read the Assignment Description closely.
Readings & Viewings
- Lynda.com: Building Themes from Scratch Using Underscores
- Migrating a Local WordPress Installation to a Live Site
- Duplicator WordPress Plugin
Week Seven: Aug 02 – 12 (Exam Period)
NOTE: Production of LangaraPRM.com (the focus of PUBL 1235: Web Production 1) often extends into the exam period.
For this reason, do not assume that the term ends with the last lecture.
If your PRM group is required during that time, you will be expected to be available.