Enabling Shortcodes in Divi Module Fields

This post may contain referral links which may earn a commission for this site

The Divi Theme's many modules include a variety of fields in which you can enter URLs and text to be displayed by the modules. In many cases, however, these are limited to the static text you type into the modules' settings. What if you want to use be able to dynamically generate the URLs / text using shortcodes, e.g. a URL collected using the Advanced Custom Fields (ACF) plugin? Here's how to do it.

Enable Shortcodes using Divi Shortcode Enabler

Divi Shortcode Enabler is a plugin which adds support for shortcodes in places where Divi does not normally execute them, for example in various Divi module fields.

It adds support for shortcodes in the following module fields:

    • Accordion Module
      • Title
    • Bar Counter Module
      • Percent
    • Blurb Module
      • Title
      • Image
      • URL
      • Alt
    • Button Module
      • Button Text 
      • Button URL
    • Call To Action (CTA) Module
      • Title
      • Button Text
      • Button URL
    • Circle Counter Module
      • Title
      • Number
    • Contact Form Module Fields
      • Title (Placeholder)
    • Fullwidth Header Module
      • Title
      • Subheading Text
      • Button #1 Link Text
      • Button #2 Link Text
      • Button #1 Link URL
      • Button #2 Link URL
  • Fullwidth Image Module
    • Image URL
    • Title Text
    • Alt
  • Image Module
    • Image URL
    • Link URL
    • Title Text
    • Alt
  • Number Counter Module
    • Title
    • Number
  • Pricing Table Module
    • Title
    • Subtitle
    • Currency
    • Sum
    • Button Text
    • Button URL
  • Slider Module Slides
    • Title
    • Button Text
    • Button URL
    • Title Text
    • Alt
  • Tab Module
    • Title
  • All Modules, Rows and Sections
    • Background Image URL

Enable Shortcodes via PHP

The following PHP code (taken from my Divi Shortcode Enabler plugin) will search the page / post content for the various module fields, and process any shortcodes contained within them.

if (!class_exists('DBDSE_EnableShortcodesInModuleFields')) {
	class DBDSE_EnableShortcodesInModuleFields {

		static public function supportedFields() {
			return apply_filters(
				'dbdsp_fields_to_process', 
				array(
					'et_pb_accordion_item' => array('title'),
					'et_pb_blurb' => array('title', 'url', 'image', 'alt'),
					'et_pb_button' => array('button_url', 'button_text'),
					'et_pb_circle_counter' => array('title', 'number'),
					'et_pb_cta' => array('title', 'button_text', 'button_url'),
					'et_pb_image' => array('url', 'src', 'title_text', 'alt'),
					'et_pb_number_counter' => array('title', 'number'),
					'et_pb_counter' => array('percent'), 
					'et_pb_pricing_table' => array('title', 'subtitle', 'currency', 'sum', 'button_text', 'button_url'),
					'et_pb_tab' => array('title'),
					'et_pb_slide' => array('heading', 'button_text', 'button_link', 'image_alt', 'title_text'),
					'db_pb_slide' => array('button_text_2', 'button_link_2'), // Divi Booster added second slide buttons
					'et_pb_fullwidth_header' => array('title', 'subhead', 'button_one_text', 'button_two_text', 'button_one_url', 'button_two_url'),
					'et_pb_fullwidth_image' => array('src', 'title_text', 'alt'),
					'et_pb_contact_field' => array('field_title')
				)
			);
		}
		
		public function init() {
			add_filter('the_content', array($this, 'processShortcodes')); // Standard content
			add_filter('et_builder_render_layout', array($this, 'processShortcodes')); // Theme builder layout content
			add_filter('dbdse_et_pb_layout_content', array($this, 'processShortcodes')); // Global module content
		}

		public function processShortcodes($content) {
			$modules = self::supportedFields();
			do_action('dbdsp_pre_shortcode_processing');
			foreach((array) self::supportedFields() as $module=>$fields) {
				foreach($fields as $field) {
					$regex = '#['.preg_quote($module).' [^]]*?b'.preg_quote($field).'="([^"]+)"#';
					$content = preg_replace_callback($regex, array($this, 'processMatchedAttribute'), $content);
				}
			}
			do_action('dbdsp_post_shortcode_processing');
			return $content;
		}

		protected function processMatchedAttribute($matches) {
			
			// Exit if not properly matched
			if (!is_array($matches) || !isset($matches[0])) { return ''; } 
			if (!isset($matches[1])) { return $matches[0]; }
			
			// Define character replacements
			$encoded = array('%'.'22', '%'.'91', '%'.'93');
			$decoded = array('"', '[', ']');
				
			// Get the decoded parameter value
			$val = $matches[1];
			$val = str_replace($encoded, $decoded, $val); // decode encoded characters
			$val = do_shortcode($val);
			$val = str_replace($decoded, $encoded, $val); // re-encode

			// Return the replacement value
			$result = str_replace($matches[1], $val, $matches[0]);

			return $result;
		}
	}
	(new DBDSE_EnableShortcodesInModuleFields)->init();
}

With this code in place you should find that shortcodes are now processed within the above mentioned module fields.

Want get more out of Divi?

Hundreds of new features for Divi
in one easy-to-use plugin

54 Comments

  1. Hi,
    I have installed a photo contest plugin (https://codecanyon.net/item/photo-contest-wordpress-plugin/8320636). And contest works with a short code.
    Our website has divi booster installed as well. Is divi booster blocking that code to work ?
    Because I have used that same photo contest plugin installed on one more website and that website doesn't have divi booster plugin, and the short code is working fine on that website.

    Please guide

    Reply
    • Hi Mani, I'm not familiar with the plugin, but there's no intentional blocking of the plugin (or any other) by Divi Booster. Some sort of a conflict isn't out of the question, of course. Does the photo contest plugin start working if you temporarily disable Divi Booster? If so, is there any chance I'd be able to take a look at the site? If you're able to send a link (via the contact form, if you like) to a page showing the issue please do so. Thanks!

      Reply

Submit a Comment

Your email address will not be published. Required fields are marked *

Hundreds of new features for Divi
in one easy-to-use plugin

54 Comments

  1. Hi,
    I have installed a photo contest plugin (https://codecanyon.net/item/photo-contest-wordpress-plugin/8320636). And contest works with a short code.
    Our website has divi booster installed as well. Is divi booster blocking that code to work ?
    Because I have used that same photo contest plugin installed on one more website and that website doesn't have divi booster plugin, and the short code is working fine on that website.

    Please guide

    Reply
    • Hi Mani, I'm not familiar with the plugin, but there's no intentional blocking of the plugin (or any other) by Divi Booster. Some sort of a conflict isn't out of the question, of course. Does the photo contest plugin start working if you temporarily disable Divi Booster? If so, is there any chance I'd be able to take a look at the site? If you're able to send a link (via the contact form, if you like) to a page showing the issue please do so. Thanks!

      Reply

Submit a Comment

Your email address will not be published. Required fields are marked *