How to create the shortcode in the Wordpress plugin
Home » BLOG » WordPress » How to create the shortcode in the WordPress plugin

How to create the shortcode in the WordPress plugin

category:  WordPress

Create the shortcode is very simple. Only one thing you have to remember is to print out the content from the callback function. You can add the content to the variable and return this variable in the callback function. However, there may be some cases that you don’t want to store everything in one variable and return it. In this case, you can use ob_start() and ob_get_clean(). I will give you these two examples. In my tutorial, I use the class pattern and create the shortcode via the WordPress plugin.

Plugin structure of sample 1

Plugins folder

|- ex_shortcode_1  (our plugin folder)

|– ex_shortcode_1.php  (our main plugin file)

|– classes

|— class-shortcode-1.php

ex_shortcode_1.php

<?php
   /*
    Plugin Name: Sample Shortcode 1
    description: usage [sample_shortcode_1]
    Version: 1.0
    Author: Apple Rinquest
    Author URI: http://applerinquest.com
   */  

if ( ! defined( 'ABSPATH' ) ) {
    exit; // Exit if accessed directly.
}

  // include our class files
  require plugin_dir_path(__FILE__) . 'classes/class-shortcode-1.php';

class-shortcode-1.php

<?php
defined( 'ABSPATH' ) or die( 'No script kiddies please!' );

if ( !class_exists( 'Sample_Shortcode_1' ) ) {
    
    class Sample_Shortcode_1 {
        public function __construct() {
            add_shortcode( 'sample_shortcode_1', array( $this, 'shortcode_1_func' ) );
        }    
        
        public function shortcode_1_func() {
            // return the content from shortcode
            return "foo and bar";
        }    
    }   
    
    // initiation
    $shortcode_1 = new Sample_Shortcode_1();    
} // end if

Then we active this plugin and now we can add this shortcode by [sample_shortcode_1] in the pages or posts in the content editor as well as the widgets.

Plugin structure of sample 2

Plugins folder

|- ex_shortcode_2  (our plugin folder)

|– ex_shortcode_2.php  (our main plugin file)

|– classes

|— class-shortcode-2.php

ex_shortcode_2.php

<?php
   /*
    Plugin Name: Sample Shortcode 2
    description: usage [sample_shortcode_2]
    Version: 1.0
    Author: Apple Rinquest
    Author URI: http://applerinquest.com
   */  

if ( ! defined( 'ABSPATH' ) ) {
    exit; // Exit if accessed directly.
}

  // include our class files
  require plugin_dir_path(__FILE__) . 'classes/class-shortcode-2.php';

class-shortcode-2.php

<?php
defined( 'ABSPATH' ) or die( 'No script kiddies please!' );

if ( !class_exists( 'Sample_Shortcode_2' ) ) {
    
    class Sample_Shortcode_2 {
        public function __construct() {
            add_shortcode( 'sample_shortcode_2', array( $this, 'shortcode_2_func' ) );
        }    
        
        public function shortcode_2_func() {
            // using output buffering
            
            // begin output buffering
            ob_start();
      
            echo '<table>';
            
            echo '<tr>';
            echo '<th>'. 'Name' .'</th>';
            echo '<th>'. 'Country' .'</th>';
            echo '</tr>';
            
            echo '<tr>';
            echo '<td>'. 'John Doe' .'</td>';
            echo '<td>'. 'USA' .'</td>';
            echo '</tr>';
            
            echo '</table>';
      
            // end output buffering, grab the buffer contents, and empty the buffer
            return ob_get_clean();
        }    
    }   
    
    // initiation
    $shortcode_2 = new Sample_Shortcode_2();    
} // end if

For this sample, I want to print out the table with data. Instead of adding all content into one variable and return it out. I use the output buffering instead. The buffer will grab all echo output and return at once by return command.

Hopefully this post will help you.