How to insert a shortcode into a WordPress page. WordPress Shortcodes: Setting Up

Hello everyone, friends, it’s been a while since I’ve had any practical posts on my blog, or any posts at all =) I haven’t disappeared anywhere, I’m just working, and it was because of my work that I had to face this problem - how to display a shortcode not in the block itself with the content, but directly into the body of the template.

After all, if, by analogy, you simply copy as you do in the posts and paste it into the code, for example in header.php, then nothing will work, the shortcode will not work.

I think this note will be most useful to those who often tinker with premium WordPress templates - they contain a lot of interesting opportunities and complex functionality in shortcodes.

For example, I needed to display a custom search that was inserted on category pages, with the code of this search I didn’t have it, just a shortcode embedded in the template, so I had to get out of it. After searching through a lot of posts on the Internet, I found several ways to make shortcodes work in template files, but only one of them turned out to be working, and I’ll share it below:

Paste this code V php file template and everything will work, of course, don’t forget to change the name of the shortcode. Thus, I was able to display a complex functional search on all category pages. If your shortcode contains additional options, then do not forget to indicate them.

How to create shortcodes yourself and display them in posts

I have been repeatedly asked how I insert blocks with advertising on the site, and with what plugin. So, I’ll answer here - that’s what the plugin is called, it’s as easy to use as 5 kopecks. Install, open settings, switch from visual editor to text and paste your code, save.

Now in the editor wordpress text you will have additional a button that, when clicked, displays a list of shortcodes you have created. Another click on the Insert Shortcode button and this shortcode will be placed in the post

For plugin haters, there is another way - you can manually add shortcodes directly to functions.php and then output them in the same way in square brackets with given names, but as for me, this option is much inferior to the plugin in terms of time and convenience - you will need to register the function, attributes and its output yourself, and then manually write the names of the shortcodes in the article, so as not to forget and not make a mistake. So I won’t even consider it, just know that this option exists and sleep well)

I can recommend another one useful plugin for working with shortcodes, which already contains ready-to-use shortcodes - Shortcodes Ultimate

In the same way, when editing entries, the “Insert shortcode” button appears on the panel; by clicking on it, your eyes will run wild with possibilities

The most interesting ones for me are inserting columns, accordions, spoilers, buttons, all kinds of text highlighting, etc.

Each shortcode has its own customizable parameters and you can manually set the CSS class, so you have complete freedom in customizing the visual display.

Thus, you can ordinary free template quickly turn into premium, by at least in terms of design =)

Hope this article was useful to you, good luck.

Greetings, 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 your own shortcode (shortcode) in WordPress. I once searched for a long time - I needed to replace the plugin shortcode on the customer’s website, and demolish the plugin itself. I think that’s what I said - the fewer pralines, the better. In fact, this is true. But this is another question, and we return to our shortcode.

If you run your blog on the WordPress engine, then you most likely wanted to add some specialized content to your post or page, but don’t know how to do it? Maybe you wanted to embed a Twitter widget, Google Adsense advertising, or some other content. How can you easily add this type of content to your post or page? Luckily, WordPress provides something called a shortcode to make this type 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 that will be replaced with other content when you actually view the post on the site. If you have ever embedded WordPress gallery to your blog, then you have already seen the built-in short code.

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

As you can see from the example above, the shortcode is similar to HTML tag, but enclosed in square brackets instead of angle brackets. This code is replaced by 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 almost anything! You can use it for whatever you want, such as outputting Youtube videos, showing your latest tweet, or even customizing it as you like.

If you're still interested, let's look at an example. Let's say I want to output AdSense ad to your post. I could go into WordPress HTML editor mode and copy and paste a block of Adsense code into it, but that would be tedious and distracting from switching editor views in my post. Also, if I wanted to change my advertising block, I would have to go back to each message 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 view the post on your site, the shortcode will be replaced with an Adsense ad unit. So how do you create this shortcode? You will most likely need to somehow tell WordPress to somehow replace the shortcode with what you need. Let's see what needs to be done next for this.

How to create a shortcode?

Luckily, 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. Is everything clear? Okay, 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 - be it a Twitter widget, some specialized site menu, or just some message or content.

Now that we have a function that returns what we want, how can we bind it to a shortcode? Now this is where the WordPress API comes into the WordPress scene. Let's take a look at how we do this again and then explain what's going on. Here is a call to customize your adsense shortcode.

Add_shortcode("adsense", "zacompom_adsense");

Here it is! The first parameter passed is the name of the shortcode, so in our case "adsense" tells WordPress to generate the shortcode. The second parameter denotes the function that will be called when a new shortcode is detected. Again, in our case, 'zacompom_adsense' tells WordPress to replace 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 options (maybe you want to choose between adsense blocks?). A complete list of AP I can be seen in the WordPress Codex.

How to use my shortcode?

This last part is the easiest, just add the shortcode to the HTML or visual representations of the post or page editor. This is it! You've created your first shortcode. Congratulations!

In fact, there is nothing to congratulate))) They just did what they had long dreamed of. Now you can easily create your own shortcodes and paste them wherever you need!

I'll wrap this up, see you soon!

WordPress is powerful publishing system, equally convenient for novice bloggers and for creating any kind of forums, social networks, stores, etc.

Usually, an appropriate 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 “zest” to WordPress.

A shortcode is a short code that is inserted directly into the text of a page, header, widget - that is, into the content and expands the capabilities of WordPress.

With its help, you can beautifully format the text, divide it into columns, insert content, a button, an audio player, an order form and many other features into 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 regular text.

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

Types of shortcodes by structure

They come without parameters, with parameters and with content.

Shortcodes without parameters

Sometimes you just need to call the shortcode for it to do strictly a certain function. There is no need to pass any parameters to it.

For example, this code outputs horizontal line. Its appearance is determined in the style sheet.

This call displays the current year. Convenient for not having 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 specified in the style sheet.

It contains two parameters: title is the label on the button, for example, Order, Subscribe, etc.

url is the click-through address.

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

Here the parameter s is the price in dollars.

Shortcodes with content

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

This is how you can highlight 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.

The color parameter specifies the color of the background 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 corresponding function to the code.

Here's a typical shortcode for a button:

function ha_but ($atts,$content=NULL) (
extract(shortcode_atts(array(
‘title’ => ‘Go to’,
'url' => false
), $atts));

$output=" '.$title."’;

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

IN in this example the function is named ha_but . It is passed two parameters - title and url. Moreover, the default value is assigned to title Go. If you skip the title parameter when calling the code, then the default button will read Go.

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

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

The add_shortcode function assigns a handler function called ha_but to the shortcode named but.

And here are the styles for a yellow button that spans the entire 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 WordPress template

You can insert a function - a shortcode handler - directly into the file responsible for outputting single posts - usually single.php . Then this shortcode will only work in posts.

It is better to insert it into the functions.php file, which is available 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 blog design in the future, then it is better to place the code for all shortcodes in one file, for example, shortcodes.php, and place it in the my folder in the root of the site.

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

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

How to insert a shortcode into a WordPress page

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

I hope there are enough examples so that you can create your own WordPress shortcode that solves the problems you need.

Watch a video tutorial on creating more complex shortcodes here:

WordPress Shortcodes are powerful, but still little known function site management systems. To show ads on your blog, simply type the word adsense. Using the post_count command you can instantly find out the number of posts. There are many similar examples. Feature sets can make a blogger's job much easier.

Example of a simple shortcode

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

The first part of the entry is an array consisting 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 sentence").

If you wish, you can use the post without the closing tag above. 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 require receiving other information for processing. In order to add a gallery, just specify the ID in the attributes.

How to insert a shortcode in WordPress

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

You can embed any content into shortcodes: text. WordPress 2.5 introduced 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 perform their assigned functions.

Purpose

With this tool, you can create original WordPress themes in the editor without HTML or special knowledge. Accordion-style buttons and sliders are added if necessary. The user can divide the 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 your content more expressive and effective. This method 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 type 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");. Once a shortcode is created, the user can use it in notes and pages. To do this, you need to switch to HTML mode and enter the line . This shortcode is a clear example how easy it is to create such feature sets.

Using Plugins

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

WP Shortcode by MyThemeShop

More recently this free extension distributed as a premium solution. Currently, the WordPress shortcode plugin contains 24 basic elements: buttons, geographical maps, separators, pricing tables and much more. To get started, a 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 window that appears depends on the user's selection.

Shortcodes Ultimate

This is one of the most popular extensions. The add-on is found in every collection of plugins for customizing WordPress. The extension is available to every user. If necessary, paid additions to the plugin are downloaded. 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 You can also include integration with any templates, 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. Software product updates are performed infrequently. However, the addon 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. The user can create feature sets with using HTML and JavaScript codes. One of the most simple examples is the placement of an advertising block 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. The user can create the necessary elements independently.

Easy Bootstrap Shortcode

The plugin allows you to add new design styles for the site. The developers claim that this is the simplest and available extension in WordPress. Panel text editor contains buttons that allow you to copy and paste the shortcode. The plugin has support for fonts with icons. The user can add styles and other website design elements.

The extension was created to work with a web resource grid, so it has many settings for columns. A blogger can create several blocks, as well as specify sizes and indentations. The 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 feature sets to expand the functionality of the site. The blogger has access not only ordinary 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 display of a selection of site posts on the page. The developers provided users only brief description software product. At the same time, the plugin copes well 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 the backlight, and divide the page into columns.

Simple Shortcodes

This is one of the most simple extensions for WordPress. After installing the software product in top panel text editor you can see the select button various elements. All the standard shortcodes are here: tabs, dropdown lists, icons, notifications, etc.

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

WordPress Shortcodes: Setting Up

How to display a link to publish a post in social network Twitter? To do this, you need to open the functions.php file and paste it next to other WordPress shortcodes in PHP string as follows: function twitt())(return "ID).""title="share the note with your friends!" >отправить";}add_shortcode("twitter", "twitt");.!}

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

Set of functions "subscribe to RSS"

One of the most effective ways increasing the number of subscribers is showing a correctly formatted message. The blogger does not 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 "Subscribe";) add_shortcode("subscribe", "subscribeRss");.

Adding Google AdSense

Many bloggers use the service contextual advertising. Pasting Google's tool code into your theme file is easy. But marketers know that people are more likely to click on links embedded in content. To insert an ad block 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 into a shortcode. Then you need to enable HTML mode and insert the line into the editor field. The first attribute indicates the RSS feed URL, and the second attribute indicates the number of notes to display.

Adding posts from the database

To call up a list of articles directly in the editor, you need to create a shortcode, switch to HTML mode and insert the line . This command will list five posts from the category with ID 2. It is worth paying attention to the fact 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 particular category.

Calling up the picture of the last article

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

Adding feature sets to widgets

It is worth paying attention to the fact that not a single WordPress shortcode works in the side columns of the site. The platform limitation can be bypassed. To do this, you need to 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.

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

How's the file? Quick response

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

php echo do shortcode wordpress

However, do not forget about punctuation! The quotes in your shortcode and in the php code must 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 some of them to single ones. It is because of such small reasons that shortcodes in WordPress often do not work. More on this below.

What is a shortcode and what is it for?

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

The shortcode usually looks like this: either this or even just 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 does this work?

It's very simple. Let's say you have a website 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 scroll through themselves. It's 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 a small slider code like:

but just this short code (Shortcode) in one line:

By inserting something like this

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

How to insert a slider shortcode directly into a WordPress template in PHP code?

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

This shortcode “function” can be inserted into a php file in the location you need on the site. For example, in header.php, somewhere after the body or maybe in sidebar.php, or best of all in the page template file (it could be called something like content-page.php), as a result, you will get that the same slider, but already built into the design of the site itself.

However, you need to be very careful when displaying the shortcode in a 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, an error will be displayed on the site.

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

How to display a shortcode in php in wordpress if there is no ready-made 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 only indicate a shortcode. Like this, for example, in this slider plugin:

What should we do in this case, since 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 shorts 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 will get this type of PHP function:

shortcode wordpress how to insert

It can now be safely integrated into any website template. However, don’t rush yet and read below about common mistakes that even experienced webmasters make when adding shortcodes.

Major mistakes! Or why the wordpress shortcode doesn't work?

At the beginning of the article, I already described how to correctly add a shortcode to Wordpress, and how to insert a shortcode into PHP. Let's summarize everything now.

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

wordpress shortcode into template

As you can see, they differ from each other only in quotation marks - 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, like we had: then you will receive an error on the site.

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

You can add any of the first two shortcodes to your WordPress template 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 directly in your browser by pressing the key combination Ctrl+Shift+I.