Categories
CSS HTML WordPress

Visual Studio Code Extensions

Below are some of the Visual Studio Code Extensions I use and recommend: Live Server: automatically reloads browser when html or css files are saved Rainbow Brackets: colors bracket pairs. Very useful in JavaScript StyleLint: error checking for CSS File Utils: adds file management functionality (duplicate, rename, move, etc) VSCode-Random: generated random data. CSS Navigation: for searching […]

Categories
WordPress WordPress Templates

WordPress JavaScript Exercise: Mais Henri

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 […]

Categories
WordPress WordPress Templates

WordPress: Filter Archive Title Output

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 […]

Categories
CSS HTML WordPress

WordPress Theme Configuration Exercise 1066

Site Set Up First, please download these files. this duplicator archive WP site the graphics files for the site the screenshots Install the site in a new database in your testing environment. As part of the Duplicator site install, create a new admin account. In that process, include your real First and Last Name. For […]

Categories
WordPress WordPress Templates

WordPress Templates Exercise: I Heart Cities, 2019

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 […]

Categories
WordPress WordPress Templates

WordPress Theme Exercise Solution: Metonymic Home Page Layout

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 […]

Categories
WordPress WordPress Templates

WordPress Theme Exercise: Metonymic Additional Header + Footer Treatments

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 […]

Categories
WordPress WordPress Templates

WordPress Theme Exercise: Metonymic Sequence of Explanation

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.

Categories
CSS JavaScript WordPress

Download: SASS WP Gulp Build Process

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 […]

Categories
CSS HTML JavaScript Uncategorized WordPress

Basic SASS Setup 2019