ACF 文本字段未在正确的层次结构内呈现

Question

我使用 ACF 创建了 2 个文本字段，它们工作得很好。问题是我正在使用 Enfold Theme 并且每次我将 ACF 短代码放在带有代码块的列中时，文本字段将不尊重层次结构，它会进入顶部。

会发生这种情况（带有“Esse texto é editável na página de opções”的 div 是 acf 文本字段）：

具有 6 个文本字段的 div 应该位于此 avia_codeblock 上方

这就是我将functions.php中的ACF作为简码调用的方式：

function vComp(){
    echo '<div>';
    echo the_field( 'titulo_do_texto_1' );
    echo '</div>';

}
    add_shortcode( 'titulo1', 'vComp' );

在代码块中我只写 [titulo1]。我真的不知道我该怎么做，有人可以帮我吗？如果需要，最新的 wp 版本，带有 Enfold 主题，域名是 https://template1.portifolium.com/sobre/

非常感谢。

Answer 1

请考虑返回您的简码值而不是显示

function vComp(){
    $shortcode_content = '<div>' . get_field( 'titulo_do_texto_1', get_the_ID() ) . '</div>'

    return $shortcode_content;
}

add_shortcode( 'titulo1', 'vComp' );