Greetings to you, dear readers of my!

Again, I haven't written for a long time, but there were reasons for that. Today I would like to shed some light on the topic of creating my own shortcode (shortcode) in WordPress. I myself was looking for a long time - it was necessary to replace the plugin shortcode on the customer's website, and demolish the plugin itself. In my opinion, I said so - the less pralines - the better. In fact, this is the case. But that's another question, and we're back to our shortcode.

If you are blogging on the WordPress engine, then you most likely wanted to add some specialized content to your post or page, but do not know how to do it? Maybe you wanted to embed a Twitter widget, Google Adsense ads, or some other content. How can you easily add this type of content to your post or page? Fortunately, WordPress provides something called a shortcode to make this kind of task extremely easy. This post will walk you through the process of creating, installing and using a shortcode in your WordPress theme... But let's start with what a shortcode is.

What is a WordPress shortcode?

In short, a shortcode is a special tag that you can insert into an article and which will be replaced with other content when you actually view the post on the site. If you've ever built WordPress gallery to your blog, you have already seen the embedded shortcode.

When you load the shortcode blog page, WordPress replaces the shortcode with all the code that actually displays the gallery with your images inserted with a specific ID.

As you can see from the above example, the shortcode is like HTML tag but enclosed in square brackets instead of angle brackets. This code gets replaced with other code when the page actually loads in the web browser. It's really cool that WordPress allows you to create your own custom shortcodes to display just about anything! You can use it for whatever you want, like displaying a Youtube video, showing your last tweet, or even customizing it however you like.

If you're still curious, let's take a look at an example. Let's say I want to display an Adsense ad in my post. I could go to WordPress HTML editor mode, copy and paste the Adsense code block into it, but that would be tedious and distracting from switching editor views in my post. Also, if I wanted to change my ad unit, I would have to go back to each post to change it to a new one. An easier way and more reliable way adding an Adsense block wherever I want is to use the adsense shortcode.

The shortcode might look like this:

When you actually look at a post on your site, the shortcode will be replaced with an Adsense ad unit. So how do you create this shortcode? Most likely, you will need to tell WordPress somehow to replace the shortcode with whatever you want. Let's see what needs to be done next.

How do I create a shortcode?

Fortunately, WordPress makes it pretty easy to create your own shortcodes, so let's actually start implementing the shortcode. The first thing we need to do is define a function that outputs the actual Adsense code. All of the following code will need to be added to your theme's functions.php file. All clear? Ok, let's take a look at this function.

Function zacompom_adsense ($ atrs) (return " "; }

This function is pretty simple - it just returns my Google-Adsense code as a string. This function will return whatever you write there - whether it's a Twitter widget, some kind of specialized site menu, or just some kind of message or content.

Now that we have a function that returns what we want, how can we bind it to shortcode? Now Wordpress enters the scene here WordPress API... Let's take another look at how we do this, and then explain what is happening. Here's a call to customize your adsense shortcode.

Add_shortcode ("adsense", "zacompom_adsense");

Here it is! The first parameter passed is the shortcode name, so in our case, "adsense" tells WordPress to generate the shortcode. The second parameter designates the function that will be called when a new shortcode is found. Again, in our case, 'zacompom_adsense' tells WordPress to replace with the results of our zacompom_adsense function.

Not bad? Now this is a very simple shortcode, WordPress allows you to do a lot more with your shortcodes, including adding parameters (maybe you want to choose between adsense blocks?). A complete list of AP I can be seen in the WordPress Codex.

How do I use my shortcode?

This last part is the simplest, just add the shortcode to the HTML or visuals of the post or page editor. This is it! You have created your first shortcode. Congratulations!

In fact, there is nothing to congratulate with))) They just did what they had dreamed of for a long time. Now you can safely create your own shortcodes and paste them wherever you want!

On this I will round off, see you soon!

WordPress is a powerful publishing system, equally convenient for both novice bloggers and for creating any, forums, social networks, shops, etc.

Usually a template is selected for each application, but sometimes its capabilities are not enough.

This is where shortcodes come to the rescue, with which you can add your own flavor to WordPress.

A shortcode is a shortcode that is inserted directly into the text of a page, heading, widget - that is, into content and extends the capabilities of WordPress.

With its help, you can beautifully design text, break it into columns, insert content, button, audio player, order form and many other features on the page that distinguish your WordPress from all others.

If there is no handler for a specific shortcode, then calling it on the page will look like ordinary text.

This article intentionally uses the names of non-existent shortcodes so that you can see what the call to the shortcode looks like, and not the result of its work.

Shortcode types by structure

They come without parameters, with parameters and with content.

Shortcodes without parameters

Sometimes it is enough to just call the shortcode for it to perform a strictly defined function. It does not need to pass any parameters.

For example, code like this would output horizontal line... Its appearance is defined in the style sheet.

This call displays the current year. Convenient not to edit texts every year.

Shortcodes with parameters

Sometimes you need to pass parameters to get different results.

For example, this is how a beautiful button is inserted, the style of which should be written in the stylesheet.

It contains two parameters: title Is an inscription on a button, for example, Order, Subscribe, etc.

url Is the click-through address.

This is how you can insert the price in rubles, which is automatically converted from the price in dollars at the current exchange rate of the Central Bank.

Here parameter s Is the price in dollars.

Content shortcodes

They consist of two parts, between which there can be any content of a post, widget, etc.

This is how you can select a fragment of text or part of a post by "placing" a colored background under it:

There is some text that will be displayed on a colored background.

Parameter color sets the background color in the usual hexadecimal code.

And this is how you can display text in two columns of the same width:

A shortcode in php code consists of a function that processes it and a command that assigns the appropriate function to the code.

Here's a typical shortcode for a button:

function ha_but($ atts, $ content = NULL) (
extract (shortcode_atts (array (
‘Title’ => ‘Go’,
‘Url’ => false
), $ atts));

$ output = " ’. $ Title."’;

return $ output;
}
add_shortcode ('but', 'ha_but');

V this example the function has a name ha_but... Two parameters are passed to it - title and url... And for title assigned a default value Go to... If, when calling the code, the parameter title skip, then the default button will have an inscription Go.

Inside a function, other functions can be called, files can be included, etc. The functionality of the shortcode is limited only by your imagination and programming skills.

The function then returns the result of its work with return.

Function add_shortcode assigns to shortcode by name but handler function by name ha_but.

And here are the styles for the button yellow color full width of the page:

Btn (
display: inline-block;
color: # 000000;
font: 300 16px "Roboto", sans-serif;
text-transform: uppercase;
background: # fde42b;
background: -webkit-gradient (linear, left top, left bottom, from (# fcea38), to (# ffcf00));
background: -webkit-linear-gradient (top, # fcea38 0%, # ffcf00 100%);
background: linear-gradient (to bottom, # fcea38 0%, # ffcf00 100%);
border-bottom: 3px solid # b27d00;
padding: 14px 15px 11px;
width: 90%;
border-radius: 2px;
text-align: center;
text-decoration: none;
text-shadow: 1px 1px 0 # ffec89;

}
.btn: hover (
opacity: 1;
background: -webkit-gradient (linear, left bottom, left top, from (# ffdd02), to (# fffe6d));
background: -webkit-linear-gradient (bottom, # ffdd02 0%, # fffe6d 100%);
background: linear-gradient (to top, # ffdd02 0%, # fffe6d 100%);
border-color: # bd8500;

How to insert a shortcode into a WordPress template

Insert a function - the shortcode handler can be directly in the file responsible for displaying single posts - usually this is single.php... Then this shortcode will only work in posts.

Better to paste it into a file functions.php, which is in any WordPress theme. Then the shortcode will work on all pages, widgets, etc.

However, if you update or change the template, the shortcodes will no longer be processed. If you plan to change the design of your blog in the future, then it is better to place the code of all shortcodes in one file, for example, shortcodes.php, and place it in the folder my at the root of the site.

In this case, you need to organize the call by inserting into the file functions.php command require_once (‘my / shortcodes.php’);

After changing or updating the WordPress theme, do not forget to re-register this command.

How to insert a shortcode into a WordPress page

For the shortcode to work, you need to insert its call in the right place in the content, consisting of them square brackets, shortcode name and parameters. At the same time, you can style it in any style, just like a regular post text.

Hopefully there are enough examples so you can create your own wordpress shortcode that solves the tasks you need.

For a video tutorial on creating more complex shortcodes, see here:

WordPress shortcodes are powerful but still little known function content management systems. To display ads on your blog, simply type the word adsense. With the post_count command, you can instantly see the number of posts. There are many similar examples. Feature sets can greatly simplify the blogger's job.

Simple shortcode example

A novice user needs to learn how to create and use special teams, as well as be able to use ready-made options. To do this, you need to understand what WordPress shortcodes are made of. As an example, you can take the line Some kind of sentence. In this post, the user calls the option bound to the shortcode. The string consists of two parameters.

The first part of the entry is an array of the id and color attributes. Instead of these values, you can specify any parameters with the desired names in the opening tag. The second part of the entry is text. In order to process it, you need to translate the entire record into PHP. The user will receive a line with the following content: my_shortcode (array ("id" => "1", "color" = "white"), "Some kind of sentence").

Optionally, you can use an entry without the above end tag. The line will look like this:. In this case, only the attributes listed in the opening tag are passed to the function. The specified recording option is used when calling an option that does not need to obtain other information for processing. In order to add a gallery, it is enough to specify the ID in the attributes.

How to insert a shortcode in WordPress

The function sets are very easy to use. The blogger needs to create a new post or open an existing post for editing. Then you need to switch the text editor to HTML mode and specify the code in. Attributes can also be used. The entry will look like this:.

You can embed any content in shortcodes: text. WordPress 2.5 introduces a set of features called the Shortcode API. After saving the post, the content of the post is processed. In parallel, the Shortcode API converts shortcodes to execute the functions assigned to them.

Appointment

With this tool, you can create original WordPress themes in the editor without HTML and special knowledge. Accordion-style buttons and sliders are added as needed. The user can split text into columns, connect a gallery, highlight words in any color, insert beautiful lists and tables with prices. Shortcodes allow you to make your blog more functional, and the material - expressive and effective. This way of adding interactive elements it is used in solving many problems and is very useful in work.

Creating shortcodes

If the user knows how to print a simple PHP function, then he will easily achieve his goal. To create a shortcode, you need to find and open one of the WordPress files functions.php. Then you need to insert the line function hello () (return "Hello world!";). This action will create a function responsible for displaying the specified text. To transform it into a shortcode, you need to insert the add_shortcode () command after the hello () option.

The line will look like this: add_shortcode ("hw", "hello") ;. After creating the shortcode, the user can use it in notes and pages. To do this, you must switch to HTML mode and enter a string. This shortcode is good example how easy it is to create such sets of functions.

Using plugins

To make things easier, a blogger can download an extension. Using add-ons is the most in a simple way receive ready-made sets functions without unnecessary settings.

WP Shortcode by MyThemeShop

Most recently it free extension distributed as a premium solution. Currently, the WordPress shortcode plugin contains 24 main elements: buttons, geographic Maps, separators, pricing tables and more. To get started, the blogger needs to install the add-on and open a text editor. To add a shortcode, you need to click on the "+" icon. The number of settings in the pop-up that appears depends on the user's choice.

Shortcodes Ultimate

This is one of the most popular extensions. The add-on is found in every collection of plugins for WordPress settings... The extension is available to every user. Are loaded if necessary paid add-ons to the plugin. The blogger can work with 50 page design elements, a shortcode generator and a CSS style editor.

The plugin has support for several languages. To the benefits software product integration with any templates can also be attributed, modern design, original design of buttons, the presence of a custom widget and sliders for the gallery.

Fruitful shortcodes

This extension is visually quite simple. Product updates are infrequent. However, the add-on contains all the standard WordPress shortcodes.

The blogger can work with horizontal and vertical tabs, columns, dividers, etc. Added elements are instantly displayed in graphic editor... The user can turn them off for posts or web pages using the "Settings" section.

Shortcoder

This plugin is also often found in different collections. The extension is updated very rarely. User can create sets of functions with using HTML and JavaScript codes. One of the most simple examples is the placement of the ad unit in the text. To do this, you need to create a set of adsenseAd functions.

The Shortcoder plugin is a very flexible tool. You won't be able to find basic shortcodes here. User can create necessary elements on one's own.

Easy Bootstrap Shortcode

The plugin allows you to add new styles for the site. The developers claim that this is the simplest and most affordable WordPress extension. Panel text editor contains buttons that you can use to copy and paste the shortcode. The plugin has support for icon fonts. The user can add styles and other elements of the site design.

The extension was created to work with the grid of a web resource, so it has a lot of settings for columns. A blogger can create multiple blocks, as well as specify sizes and margins. Plugin supports The user can also work with basic shortcodes: tabs, lists, buttons, labels, sliders, etc.

WP Canvas - Shortcodes

The add-on contains a selection of the most popular sets of functions to expand the functionality of the site. The blogger has access not only to regular elements, but also frames, images with captions, blocks for adding reviews, countdown widgets, progress indicators with effects, etc.

The plugin supports custom styles, HTML code, fonts with icons. If desired, the blogger can enable the display of a selection of site posts on the page. The developers provided users with only short description software product. At the same time, the plugin does an excellent job with all the functions assigned to it.

Arconix shortcodes

The extension contains 6 types of WordPress shortcodes. The user can work with blocks, tabs, buttons, sliders, etc. The plugin supports fonts with icons. If desired, the blogger can change the login form, turn on highlighting, split the page into columns.

Simple Shortcodes

This is one of the simplest WordPress extensions. After installing the software product in top panel text editor you can see the select button various elements... There are all the standard shortcodes here: tabs, drop-down lists, icons, notifications, etc.

After the blogger learns how to create and use feature sets, he can focus on ready-made solutions for the site.

WordPress shortcodes: customization

How to display a link for publishing a post in social network Twitter? This requires opening the functions.php file and pasting it alongside other WordPress shortcodes into PHP string with the following content: function twitt () (return "

";) add_shortcode (" twitter "," twitt ") ;.

Then you need to switch to HTML mode. Next, you should enter a word. The link will be added to where the user left the shortcode.

Subscribe to RSS feature set

One of the most effective ways increasing the number of subscribers is showing a well-formed message. The blogger doesn't need to change the entire WordPress theme code. The user must decide for himself where the set of functions will be displayed. The code looks like this: function subscribeRss () (return "

";) add_shortcode (" subscribe "," subscribeRss ") ;.

Adding Google Adsense

Many bloggers use the service contextual advertising... It's easy to paste the Google tool code into your theme file. But marketers know that people are more likely to click on links embedded in content. To insert an ad unit anywhere on the page, you need to create a shortcode and call it with the command.

Adding an RSS feed

To accomplish this task, you need to convert the function to a shortcode. Then you need to enable HTML mode and insert a line into the editor field. The first attribute indicates the URL of the RSS feed, and the second indicates the number of notes to display.

Adding posts from the database

To call the list of articles directly in the editor, you need to create a shortcode, switch to HTML mode and insert a line. This command will list five posts from a category with ID 2. Note that WordPress plugins can display related posts. However, using a shortcode, a blogger can easily get a list of any number of posts from a separate category.

Calling the picture of the last article

To make working with images easier, you can use feature sets. To call the picture of the last post, you need to create a shortcode. Then you should turn on HTML mode and insert a line into the edit field.

Adding feature sets to widgets

It should be noted that none of the WordPress shortcodes work in the side columns of the site. The platform limitation can be bypassed. To do this, open the theme file for WordPress functions.php and insert the line add_filter (‘widget_text’, ‘do_shortcode’) ;. The shortcode will be added to the widget.

Shorcode is the most attractive display method advertisements on WP. WITH of English language the word is translated as "short code". - optimal solution... Installing an ad plugin is much easier. However, very often difficulties arise with correct formatting text. Not only design suffers, but also site promotion.

The advantages of shorcode:

1) Installation does not imply constant editing of php-code;
2) Simple change of advertisements and blocks. We changed the code and got the finished result;
3) Do not affect the display of articles in any way.

Negative in shorcode:

1) Work with shortcode in php wordpress will have to be done manually. No special programs not provided. If you need to edit 2-3 articles, that's not a question. Imagine if there are more than 100 of them. You will have to spend a lot of free time;
2) If you want to change the location, you will have to do it manually.

How to insert a shortcode in WordPress?

If you are already well versed in WordPress, and you need a quick response, then use the special code:

php echo do_shortcode ("[your_shortcode]");

Do not forget to open and close php to wordpress shortcode using punctuation. Use different quotes in php code and shorcode. Simply put, if you use the same quotes in the shortcode and php, then you need to replace them with single ones. This usually becomes the cause of non-working code.

How does the shortcode work?

Everything is nowhere easier. Let's say you have a WordPress site. The site has a simple template from among the free ones. You wanted to install nice slider where you could turn over own photos... Everything is done very simply. Go to the "Plugins" (extensions) section and download the slider you like. The developers offer a wide variety of these. And you will be prompted to use the not huge code below:

but only so short:

Having marked out on WordPress page similar code:

you will get your cherished slider on the WP site. You don't need any big codes with a bunch of characters. The short code is capable of outputting any scripts.

How can I insert the same shortcode into the php-code of the page?

It happens that the site owner wants to add the shortcode directly to the page code, and not just to the editor. For these purposes, the creators of the plugins immediately indicated the php-code for insertion:

A similar "function" can be used in any convenient place in the php-code. For example, we want to place the shortcode with you in the header.php file. Suppose after the body, or even in the sidebar.php file. The most optimal place is the page file content-page.php. The output will be a beautiful slider built directly into the site itself.

You can't do without minimal knowledge of php here. Otherwise, you can mess up not only with the output of the shortcode, but also spoil the template. Save a working copy of the files before editing.

Any piece of php code starts as. In between the codes, our function is used. In some cases, the developers do not offer ready-made version shortcode for embedding into the page code. Then the php code is generated by yourself. The task is pretty simple.

Create custom php code for WordPress shortcode

Some plugin developers do not want to provide ready-made php codes to users. Apparently, they want us to read such lessons. By specifying only the shortcode. For example, as in the slider extension below:

In this situation, you and I will have to show a little imagination. To do this, we need to remake the shortcode into a ready-made php-function, which is shown at the very beginning. Taking into account the shortcode itself, we will get the following php-code:

echo do_shortcode ("");

This code snippet can be used anywhere in the template. There is no need to rush, be sure to read well about formatting php-code.

I recently discovered that many do not know how to insert shortcodes into WordPress or display a script on a website with a different engine. And those who know, and how to make in the code of the site theme template PHP output shortcode, often make serious mistakes. And in the end, then they blame the fact that either they have a plugin or shortcode doesn't work, or something is wrong with the site template. But, in fact, everything is very simple and mistakes happen mainly due to carelessness or ignorance of syntax and punctuation.

How file? Quick response

Especially for those who already know everything, but are just looking for a quick answer, or to another engine, please use this code:

php echo do shortcode wordpress

However, don't forget about punctuation! The quotes in your shortcode and vphp the code should be different.

That is, if in your wordpress site template, you use the same shortcode, but with two quotes inside (["..."]), and in your php code you also use double quotes("[...]"), then you need to change one of them to single ones. It is because of such small reasons that often shortcodes don't work in wordpress... More on this below.

What is a shortcode(shortcode), and what is it for?

Shortcode is from English "Short code". It is mainly used when creating plugins or modules designed to work with content management systems (CMS), for example, WordPress, Joomla, etc. Simply put, this shortcode is a kind of shortcut that, when added to the site, pulls up all the big code from the plugin.

The shortcode usually looks like this: either this way, or even just in one word

In any case, this is not so important, since the main thing is to know the principle of adding a shortcode to the site.

How it works?

Everything is very simple. Let's say you have a site on WordPress engine, you have some simple website template (design), but in order to decorate it, you decided to put a slider on it, in which your photos will turn over themselves. This is very easy to do. To do this, you need to download the slider plugin from the shared library WordPress plugins, upload the necessary photos there, and the plugin will give you not a huge slider code like:

but just such a short code (Shortcode) in one line:

Inserting like this

shortcode to a wordpress site page or widget, your plugin will start working and generate the top large slider code, as a result, you will get your slider on the site pages.

A how to insert a shortcode slider straight to wordpress template to php code?

If you need it directly into the code, for this, the developers of this plugin wrote next to (Fig. Above) a shortcode function in php:

Such a "function" of the shortcode can be inserted into the php-file at the desired place on the site. For example, in header.php, somewhere after the body, or maybe in sidebar.php, and best of all in the page template file (it can be called something like content-page.php), as a result, you get that the same slider, but already built into the design of the site itself.

However, you need to be very careful when outputting shortcode in wordpress template in php files. This requires at least basic knowledge of php. Because if you insert it "in the wrong place" in a php-file, then an error will be displayed on the site.

Usually any php code starts with... After the end of one php-code and before the beginning of another, you can insert your php-function. Unfortunately, plugin developers do not always make a ready-made (as in this example) php-function for displaying the shortcode. In this case, you can create it yourself easily and simply, more on that below.

How output shortcode to php v wordpress if there is no ready php function in the plugin?

There are plugins in which their developers decided not to specify a ready-made php-function for inserting a shortcode into the site template files (as was the case in the previous example), but indicate only the shortcode. Here's how, for example, in this slider plugin:

What to do in this case, because we need to insert the shortcode into the wordpress template and directly into the php file on the site? In this case, you just need to wrap the short yourself. php code-the output function, which was shown at the very beginning of the article. As a result, taking into account our shortcode, we get this kind of php-function:

shortcode wordpress how to insert

It will already be possible to easily embed it into any website template. However, take your time and read below about the common mistakes that even experienced webmasters make when adding shortcodes.

Major mistakes! Or why is the wordpress shortcode not working?

At the beginning of the article, I already described how to correctly add shortcode v wordpress, And How insert shortcode intoPHP... Let's summarize now.

In fact, there are two ways to add, namely:

wordpress shortcode to template

As you can see, they differ from each other only in quotes - single and double. Syntax php language be very careful about such quotes. And if inside the second function, which is with two quotes, you insert a shortcode also with two quotes, for example, such as we had: then you will receive an error on the site.

In order for there to be no errors and your shortcode to work fine, you need to have different quotes. For example, like this:

Add any of the first two shortcodes to WordPress template can be directly in the editor. To do this, find a suitable php file in the site editor that controls the "place" on the site where you want to display your slider. You can find this place in the developer tools right in your browser by pressing the keyboard shortcut Ctrl + Shift + I.