design development


It’s been a heck of a while since I posted. Looking back upon the recent posts, the sad fact is I can count all the posts, written in the past year, on two hands (e.g. 10). Work and real life have become increasingly demanding and time has simply flown by.

I had some free time this weekend; I decided to spend it on this largely neglected space, first deciding to spruce it up, with some visual tweaks to better delineate pieces of content. I am also pretty partial to both minimalist and Material Design trends, so you might see of that here.

The combination of php and css theme files usually mean I fire up Notepad++ and go to town. But, just before I did that, this afternoon, I recalled we recently launched Visual Studio Code, a light-weight, multi-platform editor, with some handy features you’d normally find in an IDE. The full-blown Visual Studio hasn’t risen to the top of my simple web-editing tools list, but Code looked better targeted. A 50MB download and short install later, I was up and running.

For the few hours’ work, I found four handy features that helped me get things done more quickly and with fewer errors that normal:

  1. File management – I opened up the WordPress theme folder, doubled clicked one of the files and was away. I could view the entire context of the theme files and quickly jump from one to another. Autosave made viewing design changes in a browser just that little bit quicker.
  2. Editor layout – Snapping two, even three files side-by-side was very useful, for editing a post template (or two), while simultaneously looking at the CSS stylesheet. I later found out you can accordian-minimize windows and switch between them, to fit even more, side-by-side.
  3. Search – The modified theme this site is based on includes multiple content type templates. I initially cringed at the thought of adding a new styling class to the content div, included in each of these templates (and more likely elsewhere). However, I discovered the global search function, which suddenly made it trivial to update every file that needed touching. On other occasions, searching for classes in the stylesheet is made simple with file search; result locations are denoted in the scroll bar, so you can quickly jump around between instances, as well.
  4. IntelliSense – IntelliSense has helped make countless developers more productive, and by providing it in Code, there are far fewer context switches to peeks at references. It even has highlighting to tell you when one of your styles is rendered ineffectual by some other property you defined.

All in all, I had a bit of fun, cleaned up the theme, and discovered a new favourite WordPress theme editor.