The main focus of this exercise will be the use of JavaScript in WordPress. Setup First, please download the starter package. When you unzip the file, you will find a Duplicator installer and archive. Make a new database and install the site into your testing environment (most likely MAMP). Make a new SASS-based theme called […]
Category: WordPress Templates
In this exercise, you will use custom fields and custom post types to make a restaurant website. The aim is to create a theme that gives a site owner a more intuitive UI with which to manage his or her content. The first parts of the exercise will focus on setting up and outputting the […]
If you need to output the title of an archive in a WordPress theme, you could use functions like single_cat_title(), single_tag_title(), etc. The trouble, however, is that they’re limited to the type of archive (category, tag, etc) listed in the function name itself. A more versatile approach is to use the_archive_title function. It will work on any […]
Initial Setup Download Duplicator Site For this exercise, please download the starter files and the screenshots collection, if I don’t distribute them in class. These are big files, so the download might be a bit longer than that for most of the files on this site. Most, but not all, of the screenshots for the […]
Open _posts-and-pages.scss from the SITE/PRIMARY folder. A big chunk of your home page styling can be taken care of if you explicitly define your grid columns and rows–particularly the rows. If you define the rows, the 1/-1 syntax to make the section-titles take the full column will also work with rows. Here are some starting […]
If we look at the screenshots, we see that we’ve got a few more things we need to do with the header and the footer of the site. First of all, each has a background image, or two. Hopefully, at the start of this exercise, you downloaded the background images and put them the theme […]
Original Task Content Generation Front Page Sectioning (very detailed) Content Template Part (Meta Data & Gravatar) Type Styling (more work needed) Layout : turn into a task. It isn’t done. One line in a file started. Add bg images.
ES2015+ JavaScript Flexbox Interactive CheatSheet SASS Cheatsheet Bootstrap Cheatsheet Atom Cheetsheet Bash
The Main Layouts Edit the _posts-and-pages file inside site/primary.
Now let’s do some styling of our content. Enqueue the Google Font First, let’s enqueue our site-title font: google’s smokum. Open functions.php and duplicate the line that enqueues the main stylesheet. It should be somewhere near line 120. Then in the duplicated line, change the “handle” (the first argument passed to the function). In order […]