Adding shortcodes allows users to add dynamic content to areas of the site that would not have otherwise accepted them. The text widget is a general purpose widget area. Traditionally, WordPress forbids adding shortcode content here. The workaround presented here allows users to make this modification.

What are shortcodes? Shortcodes are little code snippets that perform specific functions. Usually, shortcodes are coded into plugins to allow you to add special code to text areas that would not normally be able to accept PHP code directly.

In this guide, we will get the shortcode we want, add a text widget, and add our shortcode to the text widget.

Getting the Shortcode and Adding Widget

The first step is to get the shortcode you want to use and a text widget. In this example, we’re using a Ninja form.

  1. Click FormsClick Forms.
  2. Copy shortcodeCopy the Shortcode for Form 1 (available in the second column).
  3. Click CustomizeClick Customize.
  4. Click WidgetsClick Widgets.
  5. Select widget areaChoose the area to which you are adding the widget.
  6. Add a widgetClick Add a Widget.
  7. Choose TextChoose Text.
  8. Title the widget and add shortcodeTitle the widget and add the shortcode.
  9. Click Save & Publish

It's just text.You will notice the widget is just text. The shortcode does not bring in our form. In the next series of steps we’ll change this behavior.

Editing the functions.php file

This step involves editing one of your theme’s source files. This is an advanced step. It can also be hazardous if you are unfamiliar with the structure of WordPress themes.

This is why it would be best to take this step in a WordPress child theme. This way, updates made to the base theme will not wipe out the changes we are about to make.

Before beginning the steps below, copy the following code:

add_filter( 'widget_text', 'shortcode_unautop');
add_filter( 'widget_text', 'do_shortcode');
  1. Click SettingsClick Settings.
  2. Choose BoldGridUnder Settings choose BoldGrid.
  3. Uncheck Use BoldGrid Admin Menu SystemFind the option for Reorder Admin Menu and uncheck Use BoldGrid Admin Menu System.
  4. Save ChangesClick Save Changes.
  5. Click DashboardClick Dashboard to refresh the page.
  6. Open editorHover over Appearance and click Editor.
  7. Theme FunctionsOn the right column, click Theme Functions.
  8. Paste codePaste the code copied above at the bottom of this field.
  9. Update FileClick Update File.

Form appearsNow, you will see the form code dynamically generated within the text widget. Well done, you have completed this tutorial.

Leave a Reply