Shortcodes are a feature in WordPress that expand the abilities of content editors by simplifying the addition and formatting of content. There are several shortcodes created specifically for the Montclair State website to provide custom content types for our site.
Shortcodes can be “self-closing”, which don’t require a closing tag, or “enclosing”, which control the content between the tags:
[shortcode] content [/shortcode]
Most of our shortcodes are enclosing, and need the closing tag to function. For example, a commonly used shortcodes is [caption]. This can be used to provide a text caption below an image, but also serves to resize an image to fit its container (more on this in the captions page).
Each page in the shortcode library includes code samples that can be copied directly into the WordPress editor.
Many shortcodes have additional controls, called attributes. These can be used to specify variables, such as color, image source, text label, and more. Attributes are added within the opening tag as follows:
[shortcode attribute name="value"] content [/shortcode]
The table below lists each shortcode’s attributes for quick reference. Examples can be found on each shortcode’s individual page.
Shortcode Cheat Sheet
| Name | Attributes | Description |
|---|---|---|
| band | none | Provides vertical space between elements. |
| beforeandafter | class | Displays 2 images with a slider to switch between them. |
| button | class | Changes the appearance of a link. |
| calendarfeed_25live | filter, maxevents, startdate, enddate, noimages, vertical, showtimes, showlocations | Displays events from the 25 Live events calendar |
| caption | none | Tells WordPress to dynamically size your image |
| column | class | Creates a column (must be used inside a row) |
| contactinfo | department, location, phone, fax, email | Displays contact information in a standardized box and automatically creates links to phone number and email |
| countdown | label, enddate, endtime, timezone | Displays a countdown on an event page |
| drawer | open, label | A collapsible drawer that can hold content |
| googlecalendar | url | Displays an embedded Google Calendar on a page |
| homepageband | class, align, scalable, image | A band of content on a homepage template |
| homepagehero | label, showlinks | The image at the top of a homepage |
| homepageherocarousel | none | A carousel of content at the top of a homepage |
| homepageherocarouselitem | background, label, cta, link | A carousel of content at the top of a homepage |
| hotspot | image | An image with labeled points the visitor can hover over |
| hotpoint | left, top, label | A point inside a hotspot |
| iconbar | none | Displays icons |
| inset | class | An inset area with background color |
| lastupdated | none | Shows the last time the page was updated |
| masonryset | none | Creates a set of tiles on a homepage |
| masonrytile | class, background | Creates a set of tiles on a homepage |
| newsfeed | vertical, maxitems, channel, category, noimages | Displays articles |
| panopto | url, title | Displays video from Panopto on page |
| photobutton | vertical, horizontal, lt-gray, red, version-2, double | A button with a photo inside it |
| photogallery | none | Creates a photo gallery |
| photogalleryitem | none | Creates a photo gallery |
| profile | netid, smallphoto, hidden | Displays one or more profiles from the University directory |
| profiletable | netid, hidden | Displays one or more profiles from the University directory |
| row | none | Creates a row |
| smallband | image, align, class | A band of background color with an image floated to the left or right. |
| tab | label | A tab that contains content |
| tabgroup | none | A container used to group multiple tabs together |