Несколько do_shortcode($content) внутри одного шорткода

Кратко: Как я могу запустить шорткод с несколькими шорткодами внутри него?

Я пытаюсь запустить шорткод с несколькими шорткодами внутри него.

Я могу успешно запустить шорткод с одним шорткодом внутри него с помощью следующего кода в теме:

add_shortcode('outside_shortcode', function($attr, $content = null) {
        return
        '
            <section class="example_section">
                <div class="container">
                    <div class="row">
                        ' . do_shortcode($content) . '
                    </div>
                </div>
            </section>
        ';
    });
add_shortcode('inside_shortcode', function($atts, $content = null) {
    $atts = shortcode_atts(
        array(
            'link'  => 'https://link.com',
            'image' => 'nameofimage',
        ), $atts);
    return
    '
        <div class="col-6">
            <a href="#!">
                <div class="example">
                    <span class="helper"></span>
                    <img src="/wp-content/themes/mytheme/assets/images' . $atts['image'] . '.png">
                </div>
            </a>
        </div>
    ';
});

и следующее в редакторе текста на WordPress:

[outside_shortcode]
[inside_shortcode link='https://mysite/section1' image="funimage"]
[inside_shortcode link='https://mysite/section2' image="coolimage"]
[/outside_shortcode]

Однако я хочу добавить второй div внутри внешнего шорткода и добавить второй шорткод внутри этого. Моя идея была такая:

add_shortcode('outside_shortcode', function($attr, $content = null) {
        return
        '
            <section class="first_section">
                <div class="container">
                    <div class="row">
                        ' . do_shortcode($content) . '
                    </div>
                </div>
            </section>
            <section class="second_section">
                <div class="container">
                    <div class="row">
                        ' . do_shortcode($content) . '
                    </div>
                </div>
            </section>
        ';
    });
add_shortcode('first_inside_shortcode', function($atts, $content = null) {
    $atts = shortcode_atts(
        array(
            'link'  => 'https://link.com',
            'image' => 'nameofimage',
        ), $atts);
    return
    '
        <div class="col-6 iamfirst">
            <a href="#!">
                <div class="example">
                    <span class="helper"></span>
                    <img src="/wp-content/themes/mytheme/assets/images' . $atts['image'] . '.png">
                </div>
            </a>
        </div>
    ';
});
add_shortcode('second_inside_shortcode', function($atts, $content = null) {
    $atts = shortcode_atts(
        array(
            'link'  => 'https://link.com',
            'image' => 'nameofimage',
        ), $atts);
    return
    '
        <div class="col-6 iamsecond">
            <a href="#!">
                <div class="example">
                    <span class="helper"></span>
                    <img src="/wp-content/themes/mytheme/assets/images' . $atts['image'] . '.png">
                </div>
            </a>
        </div>
    ';
});

Однако проблема в том, что читатель не знает, как различить $content.

Есть идеи, как решить эту проблему?

Я также пробовал

do_shortcode( ' [first_inside_shortcode] ' )

но тогда я не могу иметь несколько секций внутри кода на редакторе WordPress

Например, это не работает:

[outside_shortcode]
[inside_shortcode link='https://mysite/section1' image="funimage"]
[inside_shortcode link='https://mysite/section2' image="coolimage"]
[/outside_shortcode]

Вместо этого он считывает только первый.

Спасибо!

Вам нужно работать с $content внутри вашего PHP-кода шорткодов. Вы уже на верном пути.

В документации WP есть информация о вложенных шорткодах

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

Я нашел эту информацию полезной тоже:

https://www.sitepoint.com/wordpress-nested-shortcodes/

Я разобрался!

Спасибо @André Kelling за вашу помощь!

Итак, я сделал три секции кода и вложил их друг в друга в шорткодах в редакторе WP.

Вот PHP код:

  add_shortcode('main_section', function($attr, $content = null) {
        return
        '
            <section class="main">
                <div class="container">
                    ' . do_shortcode($content ) . '
                </div>
            </section>
        ';
    });

    add_shortcode('middle_section', function($atts, $content = null) {
        $atts = shortcode_atts(
            array(
                'class'  => 'all',
            ), $atts);
        return
        '
            <div class="row middle example-' . $atts['class'] . '">
                ' . do_shortcode($content ) . '
            </div>
        ';
    });

    add_shortcode('inside_section', function($atts, $content = null) {
        $atts = shortcode_atts(
            array(
                'link'  => 'https://example.com',
                'image' => 'imagename',
            ), $atts);
        return
        '
            <div class="col-6 col-md-4 col-lg-3 col-xl-2 mx-auto">
                <a href="' . $atts['link'] . '">
                    <div class="image-cover">
                        <span class="helper"></span>
                        <img src="/wp-content/themes/mysite/assets/images/main/logos/' . $atts['image'] . '.png">
                    </div>
                </a>
            </div>
        ';
    });

А вот как я это сделал в редакторе:

[main_section]
    [middle_section class="all"]
        [inside_section link='https://example.com/section1' image="image1"]
        [inside_section link='https://example.com/section2' image="image2"]
    [/middle_section]
    [middle_section class="telco"]
        [inside_section link='https://example.com/section3' image="image3"]
        [inside_section link='https://example.com/section4' image="image4"]
    [/middle_section]
[/main_section]