After watching the last couple of videos of ACSS 101, I wanted to try out the things that Kevin showed. While I could always build a demo site, I tend not to be as focused when I have to create meaningless content. Fortunately, my day job has a website they want to migrate from the legacy CMS to WordPress. After a meeting last week, I said we should be able to get it done by mid-July. Enter the heatwave.

Due to unusually warm temperatures over the weekend, after I completed my normal weekend chore (mowing grass), I opted to sit down and start planning the migration. What I discovered was that they had very little content, a few posts and pages. I was able to merge six pages into three, use the standard post types, and only require a couple of custom fields to add some unique content.

ACSS 101

Referring back to the color scheme video and the heading video, I set to work modifying our existing ACSS settings to allow for a light and dark scheme. Once the settings were in place, I built out the pages.

I built everything the way I normally do, but then I remembered a couple of things I saw in the video. I immediately jumped over and grabbed a frame and a Brixies template. I have a section that includes tabbed content, so I tried the native, BricksExtras, and Frames tab elements. The Frames element consistently wins for ease of use and generally great accessibility.

After my normal chump-like approach, I went back and started reviewing the site. I liked what I saw, so it was time to clean up some CSS and tackle the light and dark schemes. Following Kevin’s video, this took about 30 seconds — crazy simple. After identifying areas that needed to change that didn’t and areas that changed that shouldn’t, I made the necessary adjustments. All in all, I probably spent an hour viewing, tweaking, and saving. I am still using 2.8.3, so the version 3 update would probably have cut that time in half. In case you didn’t know it, version 3 adds very few new capabilities but drastically improves the UI, so anything you see in ACSS 101 is possible in the older version.

The completed project

After about 10 hours of total time, the site is done and ready for the “client’s” review. Once these lessons are fully engrained, and the necessary styles and templates completely built out, I think we can start churning out new sites with a consistency that has been missing.

My Number One Take Away

Learn the system, and trust the system. When combined with Bricks Builder, it makes life so easy.

Secondary lesson — bg–ultra-light and bg–ultra-dark will be your new best friends.

If you are interested, here is a video I shared with a colleague as I neared completion. Some minor adjustments have been made since, but you’ll get the gist.

This content is blocked because it requires YouTube cookies.

If you want to buy ACSS, I invite you to use my affiliate link. Whether you use the link or not is up to you, but if you are using Bricks, I highly recommend it.