WordPress shortcodes are really awesome BUT at first (for noobs) they can seem more difficult than they really are. We’re going to clear up what shortcodes are and display for you how easy they are to use. WP introduced the incredible tool in version 2.5 on March 29th, 2008. At Spark Logix, we’ve been building them into our client sites and framework with great success and haven’t looked back. Shortcodes have made our clients happier and our process more efficient.
With WordPress shortcodes the average user while creating a page, has the ability to add dynamic content or fully style what they want to see, within the restrictions created by the developer (that’s us). They’re able to do all of this without the need for any programming skills.
Spark Logix Studios has developed a large catalog of shortcodes that allow our clients the ease of managing their pages, widget areas, footers and headers. One of the more effective ways to use a shortcode is to have a tinyMCE button in your Kitchen Sink in the Visual tab while editing a page. Some developers opt for the “find the shortcode in our settings or on our website” method, which can make it more difficult to find and arrange what you need.
How to Use a WordPress Shortcode
Click the Icon to Add a Shortcode
Select a Shortcode
Edit a Shortcode
Here’s what we’ve added:
This is an Alert Shortcode
In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a,
Here’s what it looks like in the visual editor:
Let’s see one more:
A Horizontal Divider
Here’s what it looks like in the visual editor:
As you can see the editable options (can be edited right on the page): The Type of Divider, The Width of the Divider and the Color of the Divider. Each of these options is controllable without having to know CSS, HTML or PHP! With just a little logic and creativity you can create almost anything! This is the power of WordPress shortcodes.
Shortcodes make page creation a snap!
You can use the shortcode editor to easily follow instructions and then alter the text in the visual editor when you need to adjust an element. It’s easy to duplicate layouts you love by copying and pasting. You can edit the shortcode anytime without having to know how it’s finding all those styles and layouts you see on the front end. If the plugin is working correctly, all of your efforts just work!
How Spark Uses Shortcodes
Over the years Spark Logix Studios has created several plugins assisting in accomplishing tasks more efficiently. These plugins from time to time require data to show up on a page of our choosing. A shortcode is an easy way for us to accomplish this (on the fly) whenever we need.
Our creation process is simple. The basic steps are:
- Create the function, which will be called by WordPress when it finds a shortcode.
- Register the shortcode by setting a unique name.
- Tie the registration function to a WordPress action.
This is the in depth look at what we do, this isn’t something you’ll need to worry about as an end user. If we’ve done our job all of this will just work, when you need it to.
Dynamic Content Shortcodes
One example of a dynamic content shortcode would be our Weather Plugin. This plugin uses an API from Wunderground. We’ve simply taken the information provided by Wunderground (in real time), created a process to read it and display it, THEN created shortcodes to enter anywhere on a WordPress website.
Displayed Shortcode
9°F / 34°F
7:08 am 
7:08 pm 
How was the shortcode added to the page?
What does the shortcode look like?
As you can see, the shortcode includes editable text to control the experience.
The shortcode gives you control to:
- Control the Shortcode Page Width (Full, Half, Third, Quarter)
- On Page Float (None, Left or Right)
- Control Default Displayed Shortcode or Widget City
- Set Time in 12 Hour or 24 Hour View
- Display Sunset and Sunrise Times
- Display or Hide 3 Day Forecast in Shortcode Settings
- Display in Fahrenheit or Celsius
- Add Any Color or Add a Background Image
The plugin allows the user to control:
- Shortcode and Widget Options to Display Weather
- Add Your API Key from Wunderground
- Schedule Weather Pull Times (2, 3, 5, 10 minutes)
- Add Cities by Zip Code and Add City Name for Display
Overall, using shortcodes makes the experience for our clients much more efficient and easy. What may seem confusing at first actually opens the door to more adaptability and flexibility.
Video Demo on Adding Shortcodes
The post WordPress Shortcodes Explained + VIDEO appeared first on Spark Logix Studios.