Course: Publ 1232 | Title: Advanced Web Design |
Credits: 3 | Room: Online |
Term: Summer 2020 First class: June 18 Last class: July 30 Exam Period: Aug 04-15 | Days/Times: Tuesday: 130-420 Thursday: 1130-120 (Lab) Office Hours: Monday 2-4 |
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 links to additional supporting content.
NOTE to students taking PUBL 1235:
Production of LangaraPRM.com typically 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.
If you are heavily involved in LangaraPRM production near the end of the term, extensions on the final 1232 project are definitely possible.
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
- Build basic WP 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 out-of-class resource will be two series from Lynda.com:
These courses, and a bunch more, are by Vancouver WordPress expert Morten Rand-Hendriksen. They are an excellent resource.
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
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 1: June 18 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.
- Setting Up A Testing Environment: MAMP
- WordPress Directory Structure
- The Dashboard
- 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
- Required: WordPress 5: Essential Training
- If needed: Installing and Running WP: MAMP, Chapters 1-2
Download: Day One Files
Week One Lab Exercises
- WordPress Basics Exercise
- Obsessive Compulsive Guitarist WordPress Exercise
- Both are due by Tuesday.
Week 2: June 23-25: WP Dashboard Pt 2
- Appearance: Theme Customizer, Menus, Widgets
- Appearance: Themes, Custom Headers
- Widgets
- Plugins
- WordPress Security
Readings & Viewings
- WordPress 5 Essential Training: Site Administration (entire series)
Week Two Lab Exercises
- Big WordPress Configuration Exercise
- WordPress Plugin and Theme Configuration Exercise: Myazaki / MetaSlider (due Tuesday)
- WordPress Plugin and Theme Configuration Exercise: Ryan / YouPolls (due Tuesday)
- WordPress Plugin and Theme Configuration Exercise: Minimal Grid / Relevanssi (if you want to practice for the midterm)
Next Thursday, we will have our MIDTERM. You will need to know any of the info from the WordPress: Essential Training Videos—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 3: June 30-July 02 Theming 1 (& MIDTERM)
- DRY vs WET: The Point of Templates
- The WordPress Template Hierarchy
- index.php, single.php, page.php, 404.php
- 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
Templating / CSS Resources
- The WordPress Template Hierarchy (with a good video explanation)
- Tuts+: WordPress Template Hierarchy Graphic Map
- Tuts+: WordPress Page Anatomy Diagram
- Complete List of Template Tags
- Default WordPress CSS Classes
- Another Listing of WP CSS Classes, from Chris Coyier
- Even More From Chris Coyier on the Subject…
Useful Visual Studio Extensions
- WordPress Snippets
- PHP Intellisense
- Live Sass Compiler
Lab Exercises
Thursday Lab Time: Midterm Exam
Week 4: July 07-09 Theming 2
- 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
- SASS: Syntactically Awesome Style Sheets
Week Four Lab Exercises
SASS Resources
- Marksheet.io: SASS: CSS With Superpowers
- SASS Basics 2018
- SASS Essentials 2018: Partials
- SASS Essentials 2018: Variables
- SASS Essentials 2018: Mixins
Week 5: July 14-16: Theming 3
- Multiple loops with wp_query
- Conditions
Readings & Viewings
- A Walk Through Conditional Tags in WordPress
- Ultimate Guide to WP Conditional Tags
- Codex: Conditional Tags
Week Five Lab Exercises
Week 6: July 21 – 23: Theming 4
- WordPress Security Recap
- Transferring a Site from another domain
- Transferring from a local environment to a live domain
Lab Exercises
Readings & Viewings
Week 7: July 28 – 30: Work on Project
Final project site due Monday August 02.
If you are doing a lot of langaraprm.com work at this time, extensions are definitely possible.
Exam Period Aug 04 – 15
There is no exam in this class, but for PUBL1235 students, LangaraPRM.com production will be a full-time concern.