Как в шорткод добавить tooltip с html содержимым?

Есть сайт на wordpress где через шорткод добавляю всплывающую подсказку bootstrap таким образом:

function tooltip_func( $atts ){

    $attributes = shortcode_atts(
        array(
           'text' => '',
           'toggle' => 'tooltip',
           'placement' => 'bottom',
           'html' => 'true'
        ), 
        $atts
    );

    $output = '';
    if ( !$attributes['text'])
        return $output; 

    $output .= '<span  data-bs-toggle="'.$attributes['toggle'].'" data-bs-html="'.$attributes['html'].'" data-bs-placement="'.$attributes['placement'].'" data-bs-title="'.html_entity_decode($attributes['text']).'"><i class="fa fa-lightbulb-o" aria-hidden="true"></i></span>';
    return $output;
}

add_shortcode( 'tooltip', 'tooltip_func' );

Теперь мне нужно добавить ссылку внутрь tooltip применяя разметку html. Как видно ниже в чистом bootstrap это возможно сделать

Код

var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
var tooltipList = tooltipTriggerList.map(function(tooltipTriggerEl) {
  return new bootstrap.Tooltip(tooltipTriggerEl)
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" />

<button type="button" class="btn btn-secondary" data-bs-toggle="tooltip" data-bs-html="true" title="Текст <a href='https://youtube.com'>Ссылка</a> текст">
  Tooltip with HTML
</button>

Но, если добавляю через щорткод вот так

[tooltip text='Текст <a href="https://youtube.com">Ссылка</a> текст' icon='fa-info-circle']

то получаю сломанную верстку. Пробовал делать экранирование кавычек и кодирование контента, но не помогло.. Как грамотно решить данную задачу?