Enclosing shortcodes in Wordpress - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to define an enclosing shortcode function in WordPress.

Wordpress

function my_shortcode_function($atts, $content = [1]) {
    return '<div>' . do_shortcode($content) . '</div>';
}

Drag options to blanks, or click blank then click option'

A''

Bfalse

Ctrue

Dnull

Attempts:

3 left

💡 Hint

Common Mistakes

Using null or false as default for content causes errors.

Omitting the content parameter disables enclosing shortcode functionality.

The content parameter for enclosing shortcodes should default to an empty string '' to capture the enclosed content.

2fill in blank

medium

Complete the code to register the enclosing shortcode named 'box'.

Wordpress

add_shortcode('[1]', 'my_shortcode_function');

Drag options to blanks, or click blank then click option'

Awrap

Bbox

Ccontainer

Dcontent

Attempts:

3 left

💡 Hint

Common Mistakes

Using a different shortcode name than intended.

Forgetting to register the shortcode.

The shortcode tag name is 'box' as specified for the enclosing shortcode.

3fill in blank

hard

Fix the error in the shortcode function to correctly handle enclosed content.

Wordpress

function my_shortcode_function($atts, $content = '') {
    return '<p>' . [1]($content) . '</p>';
}

Drag options to blanks, or click blank then click option'

Ado_shortcode

Btrim

Chtmlspecialchars

Dstrip_tags

Attempts:

3 left

💡 Hint

Common Mistakes

Using strip_tags removes HTML but does not process shortcodes.

Using htmlspecialchars escapes HTML entities incorrectly.

Use do_shortcode to process any nested shortcodes inside the enclosed content.

4fill in blank

hard

Fill both blanks to create an enclosing shortcode that wraps content in a div with a class.

Wordpress

function my_shortcode_function($atts, $content = '') {
    $atts = shortcode_atts(array('class' => '[1]'), $atts);
    return '<div class="' . $atts['class'] . '">' . [2]($content) . '</div>';
}

Drag options to blanks, or click blank then click option'

Amy-box

Bdo_shortcode

Cstrip_tags

Dcontent-box

Attempts:

3 left

💡 Hint

Common Mistakes

Using strip_tags instead of do_shortcode.

Using an empty or incorrect default class.

The default class is 'my-box' and do_shortcode processes the enclosed content.

5fill in blank

hard

Fill all three blanks to create a shortcode that wraps content in a section with a dynamic id and processes nested shortcodes.

Wordpress

function my_shortcode_function($atts, $content = '') {
    $atts = shortcode_atts(array('id' => '[1]'), $atts);
    $id = sanitize_html_class($atts['id']);
    return '<section id="' . $id . '">' . [2]([3]) . '</section>';
}

Drag options to blanks, or click blank then click option'

A$content

Bdo_shortcode

Cstrip_tags

Ddefault-section

Attempts:

3 left

💡 Hint

Common Mistakes

Not sanitizing the id attribute.

Using strip_tags instead of do_shortcode.

Using wrong variable names.

The default id is 'default-section', do_shortcode processes the content, and the content variable is $content.