Using multiple shortcodes in single HTML tag breaks shortcode rendering

Replies: 0

This issue involves a few very simple shortcodes used within an anchor (link) tag’s attribute values. Each shortcode, when used individually, renders as it should, however once a third shortcode is used, even if it’s the same shortcode as one previously used, each of the shortcodes render as the shortcode code.

My goal is to make shortcodes that will add settings (theme mods set up in Customizer) to a link.

Here is the code used in the page editor:
<a href="[ticketurl]" target="[tickettarget]" data-target2="[tickettarget]">Purchase Tickets</a>

Note that each one of these shortcodes used individually render just fine. The use of two of the shortcodes also renders fine for each. It’s when I add a third shortcode that each of the shortcodes renders as the shortcode itself.

The simple shortcode functions are written as follows:

function cpac_ticketurl_shortcode() {
	$output = esc_url(get_theme_mod('cpac_ticketingurl'));
	return $output;
}
add_shortcode('ticketurl','cpac_ticketurl_shortcode');

and

function cpac_tickettarget_shortcode() {
	$output = esc_attr(get_theme_mod('cpac_ticketingtarget'));
	return $output;
}
add_shortcode('tickettarget','cpac_tickettarget_shortcode');

Using these shortcodes:

<a href="[ticketurl]" target="[tickettarget]">Purchase Tickets</a>
renders as:
<a href="http://www.buytickets.com/" target="_blank">Purchase Tickets</a>
while
<a href="[ticketurl]" target="[tickettarget]" data-target2="[tickettarget]">Purchase Tickets</a>
renders as:
<a href="[ticketurl]" target="[tickettarget]" data-target2="[tickettarget]">Purchase Tickets</a>

I should also note – even when the data-target2 value is set to a different shortcode that was not previously used, it still breaks all shortcodes within the anchor (link) tag.

I have not seen any limitations on multiple shortcode use within a single HTML tag, so I’m wondering what I might be doing wrong. I’m still a bit of a noob at this WordPress coding.