plugins - Can I use a Shortcode output as an HTML attribute value?

Within a span, the shortcode output works:

<span>[sola_testimonials_count type='all']</span>

Result:
<span>5,205</span>

But as an attribute value, it doesn't get parsed:

<span data-value="[sola_testimonials_count type=\'all\']"></span>

Result:
<span data-value="[sola_testimonials_count type=\'all\']"></span>

This is a third-party plug-in, but I obviously have the code and can manipulate it. Is there a way I can get the shortcode to parse as an HTML attribute value? I'm not a Wordpress developer so forgive me if this is an obvious answer.

Many thanks!

Within a span, the shortcode output works:

<span>[sola_testimonials_count type='all']</span>

Result:
<span>5,205</span>

But as an attribute value, it doesn't get parsed:

<span data-value="[sola_testimonials_count type=\'all\']"></span>

Result:
<span data-value="[sola_testimonials_count type=\'all\']"></span>

This is a third-party plug-in, but I obviously have the code and can manipulate it. Is there a way I can get the shortcode to parse as an HTML attribute value? I'm not a Wordpress developer so forgive me if this is an obvious answer.

Many thanks!

• plugins
• shortcode

Share Improve this question asked Jan 27, 2017 at 20:19 Hairgami_MasterHairgami_Master 14133 bronze badges 3

• This is in a theme file? Or inside the text editor for a post or a page? – nibnut Commented Jan 27, 2017 at 21:01
• You could make the shortcode to output everything including the HTML – David Lee Commented Jan 27, 2017 at 21:59
• It's in a plug-in called Sola Testimonials. I can edit the plug-in and re-upload the zip file. – Hairgami_Master Commented Jan 28, 2017 at 2:25

Add a comment  | 

4 Answers 4

Sorted by: Reset to default 1

Yes, you can achieve this by using PHP to manually parse the shortcode and set the attribute value accordingly.

function parse_shortcode_for_attribute($atts) {
    // Extract the shortcode attributes
    $atts = shortcode_atts(
        array(
            'type' => 'all', // Default value if not specified
        ),
        $atts,
        'sola_testimonials_count' // Shortcode name
    );

    // Call the function that generates the shortcode output
    $output = sola_testimonials_count_shortcode_function($atts);

    // Escape HTML entities to prevent XSS attacks
    $output = esc_attr($output);

    // Return the parsed shortcode output as the attribute value
    return $output;
}
add_shortcode('parse_shortcode_for_attribute', 'parse_shortcode_for_attribute');

you can use the shortcode with the parse_shortcode_for_attribute shortcode like this

<span data-value="[parse_shortcode_for_attribute type='all']"></span>

This will parse the sola_testimonials_count shortcode and set its output as the value of the data-value attribute. Make sure to replace sola_testimonials_count_shortcode_function with the actual function that generates the output for the sola_testimonials_count shortcode

I am not good at Regex but do_shortcode will basically will not parse any shortcode in the attributes, this might help you out:

add_filter('the_content', function($c){
    $pattern = '/<span\s*(.*?)data-value=["\']?\[(.*?)\]["\']?\s*(.*?)>\s*(.*?)\s*<\/span>/si';
    $c = preg_replace_callback($pattern, function($c){
        return isset( $c[2] ) ? str_replace(
            $c[2],
            do_shortcode("[{$c[2]}]"),
            $c[0]
        ) : array_pop($c);
    }, $c);
    return $c;
});

I realize this thread is from January, but I just wanted to briefly point out that, as documented in the codex, shortcodes are allowed inside html attributes.

https://codex.wordpress.org/Shortcode_API#HTML

This is not exactly what you are asking but maybe can help to find the solution

/* this simulates your shortcode [sola_testimonials_count type='all'] */
function num_sc( $atts ) { return '5,205'; }
add_shortcode( 'num', 'num_sc' );

/* use like this [test]...[/test] to obtain <span data-value="5,205">...</span> */
function test_sc( $atts, $content = null ) {
    remove_filter( 'the_content', 'wpautop' );
    $content = apply_filters( 'the_content', '<span data-value="[num]">' . $content . '</span>' );
    add_filter( 'the_content', 'wpautop' );
    return $content;
}
add_shortcode( 'test', 'test_sc' );

Result

/* INPUT */
AAA [test]this is a test[/test] BBB
/* OUTPUT HTML */
AAA <span data-value="5,205">this is a test</span> BBB