How To Add Short Code in WordPress

Adding a short code in WordPress can be an effective way to simplify the process of adding custom functionality and features to your website without having to write complex code. With just a few simple steps, you can create a custom short code that will allow you to add custom content, forms, or other elements to your pages and posts.

Adding a short code in WordPress involves a few simple steps:

Open the functions.php file

The functions.php file is located in the theme folder of your WordPress site. To open it, go to Appearance > Theme File Editor in your WordPress dashboard, and select the functions.php file from the list of files on the right-hand side.

To edit the theme, click the Theme File Editor under the Appearance

Appearance to Theme Editor

After clicking Theme File Editor, find the function.php on the Theme Files select it to open.

Define the short code

To define a short code, use the following code snippet:

function my_shortcode_function() {
    // Your code here
}
add_shortcode('my_shortcode', 'my_shortcode_function');

In the code above, replace my_shortcode with your desired short code name, and replace my_shortcode_function with the name of the function that will process the short code.

Write the code for the short code

In the function defined in step 2, you can write the code that will generate the output for the short code. For example, if you want to create a short code that displays a greeting message, you could use the following code:

function my_greeting_shortcode() {
    return 'Hello, welcome to my website!';
}
add_shortcode('my_greeting', 'my_greeting_shortcode');

Save the functions.php file

After you have defined your short code and written the code for it, save the functions.php file.

Use the short code

To use your newly created short code, simply add its name within square brackets in the content of your post or page. For example, to use the my_greeting short code defined in step 3, you would enter [my_greeting] in the content editor.

And that’s it! Your custom short code should now be ready to use on your WordPress site.

Addition On Short Code In WordPress

There are two types of shortcodes in WordPress:

Built-in shortcodes: WordPress comes with several built-in shortcodes that you can use without any additional coding. These shortcodes include:

  • : Embed an audio file
  • : Add a caption to an image
  • : Display a gallery of images
  • : Embed a video file
  • : Embed external content, such as YouTube or Twitter posts
  • : Add a caption to an image with a specific ID
  • : Add a caption to an image with a specific ID and set its alignment and width.

To use a built-in shortcode, simply enter its name within square brackets in the content of your post or page, and any additional parameters as needed.

Custom shortcodes: Custom shortcodes are created by WordPress users or developers to add specific functionality to their sites. To create a custom shortcode, you need to define a function that generates the output for the shortcode and register it using the add_shortcode function. For example, you could create a custom shortcode to display your social media profiles:

function social_media_shortcode() {
    $output = '<ul class="social-media-list">';
    $output .= '<li><a href="https://facebook.com"><i class="fa fa-facebook"></i></a></li>';
    $output .= '<li><a href="https://twitter.com"><i class="fa fa-twitter"></i></a></li>';
    $output .= '<li><a href="https://instagram.com"><i class="fa fa-instagram"></i></a></li>';
    $output .= '</ul>';
    return $output;
}
add_shortcode('social_media', 'social_media_shortcode');

In the code above, the social_media_shortcode function generates an unordered list of social media icons with links to your profiles, and the add_shortcode function registers this function as a shortcode with the name social_media.

To use the custom shortcode, simply enter its name within square brackets in the content of your post or page, like this: [social_media]. The shortcode will be replaced with the output generated by the social_media_shortcode function.

Recent Articles

spot_img

Related Stories

Leave A Reply

Please enter your comment!
Please enter your name here

Stay on op - Ge the daily news in your inbox