How to create a simple custom shortcode in Wordpress?

Question

I created a folder in the /wp-content/plugins directory called customshortcode. The add_shortcode command should link the shortcode with the function.

In /wp-content/plugins/customshorcode/ I created 2 files: main.php and test.php

Contents of main php is:

<?php require_once('../../../wp-includes/shortcodes.php'); ?>

<?php function custom_shortcode_func() {
  include_once('test.php');
}

add_shortcode('customshortcode','custom_shortcode_func');

?>

And test.php simply displays a division block:

<style>.testdiv{border:1px solid black; width:300px; heigh:300px;}</style>

<div class="testdiv"></div>

I first run the /wp-content/plugins/customshorcode/main.php file to see no errors and simple white screen. I assumed the short-code should be saved.

But when I enter [customshortcode] in the page, I don't get the division displayed, instead the text [customshortcode] instead.

I think I somehow need to link the page type to the plugin or something like that. Could you help me out?

in your test.php write: return '<style>.testdiv{border:1px solid black; width:300px; heigh:300px;}</style><div class="testdiv"></div>';. And why you have include /wp-includes/shortcodes.php?? — Raunak Gupta
– Raunak Gupta, Commented Mar 7, 2017 at 10:25
Because without it when I got to the main.php to run it in the URL bar, I get: Fatal error: Call to undefined function add_shortcode() in C:\MAMP\htdocs\new\wp-content\plugins\customshortcode\main.php on line 8 — GRS
– GRS, Commented Mar 7, 2017 at 10:34
Also is in test.php do I need to open and close <?php ?> tags? Currently I only have the return statement above without the tags. — GRS
– GRS, Commented Mar 7, 2017 at 10:35
@SamuelJMathew I simply created a new page, added a title, and put the shortcode in the content, clicked on preview page — GRS
– GRS, Commented Mar 7, 2017 at 10:36

SAMUEL · Accepted Answer · 2023-01-13 03:39:59Z

3

In /wp-content/plugins/custom-short-code/main.php

<?php
/*
* Plugin Name: Custom Short Code
* Description: Create your WordPress short code.
* Version: 1.0
* Author: <email>
*/

// Example 1 : WP short code to display form on any page or post.
function custom_short_code_func() {
?>
<style>
 .testdiv {
     border: 1px solid black;
     width: 300px;
     height: 300px;
 }
</style>

<div class="testdiv"></div>
<?php
}
add_shortcode('custom-short-code','custom_shortcode_func');
?>

Then enable the plugin

Custom Short Code

edited Jan 13, 2023 at 3:39

answered Mar 7, 2017 at 10:45

SAMUEL

8,6223 gold badges46 silver badges44 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

GRS Over a year ago

Thanks, it works great! I didn't know I had to create a plugin like this, I couldn't find it in documentation

devndesigns · Accepted Answer · 2021-11-29 17:09:52Z

-1

   <?php
/*
* Plugin Name: Custom ShortCodes
* Description: Create your WordPress plugin shortcodes.
* Version: 1.0
* Author: [email protected]
*/

function wpb_test_shortcode() { 
$message = 'Hello world!'; 
return $message;
} 
add_shortcode('testing', 'wpb_test_shortcode');
?>

answered Nov 29, 2021 at 17:09

devndesigns

1

2 Comments

devndesigns Over a year ago

Details answer in your visit website.URL:devndesigns.com

Community Over a year ago

As it’s currently written, your answer is unclear. Please edit to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers in the help center.

Collectives™ on Stack Overflow

How to create a simple custom shortcode in Wordpress?

2 Answers 2

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related