February 3, 2024
Добавляем теги в форму Taplink
Taplink не позволяет вставлять в заголовки формы никакие теги и ссылки. Но мы можем исправить это с помощью кода.
Добавьте последним блоком в таплинке HTML- блок с содержимым:
<script>
function fixForms() {
document.querySelectorAll('.has-form-normal label:not(.with-html)').forEach(function(label) {
let textNodes = [];
label.childNodes.forEach(node => {
if (node.nodeType === 3) {
textNodes.push(node.nodeValue);
}
});
// Соединяем все текстовые узлы, удаляем HTML-элементы
let text = textNodes.join('').replaceAll('<', '<').replaceAll('>', '>');
// Удаляем все дочерние элементы у исходного label
label.childNodes.forEach(node => {
if (node.nodeType === 3) {
textNodes.push(node.nodeValue);
label.removeChild(node); // Удаляем только текстовые узлы
}
});
// Создание нового span с классом new-label и добавление в label
let newSpan = document.createElement('span');
newSpan.className = 'new-label';
// Восстановление стилей
let oldSize = window.getComputedStyle(label).fontSize;
label.style.fontSize = '0';
label.appendChild(newSpan);
newSpan.innerHTML = text;
newSpan.style.fontSize = oldSize;
label.classList.add('with-html')
});
}
let formFixerChecker = setInterval(()=>{
fixForms()
if (!document.querySelectorAll('.has-form-normal label:not(.with-html)').length) {
clearInterval(formFixerChecker)
}
},1000)
</script>Теперь ваш таплинк сможет показывать теги в заголовках полей форм
<a href="Ссылка" target="_blank">Текст ссылки</a>
Для остальных тегов можете попробовать любой тег https://html5book.ru/html-tags/
Но лучше ограничиться тегом span
<style>
.has-form-normal label a {
color: #5A74F2;
margin-left:.2em;
text-decoration:underline;
}
.has-form-normal label font {
color: var(--orange-color, #FF9F59);
}
.has-form-normal label span:not(.new-label) {
background: linear-gradient(268deg, #2EB9F5 1.16%, #18A4E1 91.29%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
</style>