#devnotes – WordPress Shortcodes GUI, IT work

WordPress Shortcodes are a quick and easy way for me to extend the capabilities of the WordPress editor for my clients. All I have to do is write some code that hooks into the API, and I’m able to add “macros” that my clients can type into the backend. These macros get replaced by my code’s output on the frontend. Case in point, consider this common “team member” design pattern:

The process of quickly building that type of layout in the WordPress editor would be cumbersome. However, I can program a shortcode that displays the above with the following:

At this point, the only problem with the pictured shortcode is its user-friendliness. Each time we want to add a new team member to a page, we must remember this [teammember] shortcode and its associated attributes. Wouldn’t it be nice if we could quickly build a graphical interface for working with this shortcode?

I was asking myself the same question last week when I found the Shortcake (Shortcode UI) plugin on Github. With a few lines of code, I’m able to add the following interface for my [teammember] shortcode:

 

The Shortcode UI plugin is coming in very handy on one of my current projects. It has already helped me build out several page layouts faster, and when it comes time to hand the site off to my client, training their office staff to use it will be much easier than showing them how to type in shortcodes.

—

Last week I made an in-office IT visit with one of my clients. My hosting company is taking over their email services, and I needed to work with everyone to make sure the migration goes smoothly. This type of work is something I rarely do since I primarily design and develop websites. The funny thing is, this foray back into IT got me doing one of my favorite parts of my job: making technology simple for any type of user.

During my visit, I got to work with everyone in the office, from executives to admin staff, checking their settings and prepping their email accounts for migration. I typically think of IT work as behind-the-scenes “grunt” work; however, this experience reminded me that good IT is making technology work for non-technical users. Given the proper expectations and patience, this can make technical tasks a pleasure rather than a chore. I came away from the experience having enjoyed my visit.