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 […]
Author: km
First please download the starter files and the screenshots. If this is a test, talking to anyone but me will result in a score of “0”. In the download is an HTML file. I have put some of the HTML in. You will need to put in a lot more. Make sure that you read […]
First please download the starter files and screenshots. In this exercise, you will make the front page of an imaginary worldbeat music magazine. If this is a test, you can use the internet and your notes, speaking to anyone other than me or the Instructional Assistant will result in you receiving a mark of zero. […]
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.
Basic Gulp-Based SASS Build Process In order to use SASS in your WordPress development environment, download this zip archive. When you unpack the archive, you will have a folder called gulp-dev-for-wp. Inside that folder are two files: package.json and gulpfile.js. This build process assumes that either: you have installed npm and gulp-cli on your own […]
Where We Ended Up Our gulpfile.js file looked like this at the end of the previous exercise: It’s working, but it’s looking for only a single scss file. In this part of the exercise, we’ll get gulp to look at any number of files. Add Some More SASS Files First, create the following additional folders […]
Categories
Running SASS in a Gulp.js Build Process
The instructions for the installation below are Macintosh-specific. PC instructions will be roughly similar, but there will be significant differences that will require some googling. If you are on your own computer, install node.js and the gulp command line-utility. Each of the command line steps can be copied and pasted into the Terminal window and […]
Categories
SASS Essentials 2018: Functions
SASS Functions are Similar to Mixins. They tend, however, to be used more programmatically, with logic and return values. Here’s an example. This function will make an element’s text color white if the background is dark, and black if the background is white. To see how this works, put this function in a test file […]