Замена иконки и ссылки в «домике» (ЛК)

При логине в личный кабинет Тильды пользователь попадает на базовую страницу, где его встречают хлебные крошки: иконка с домиком и заголовок страницы.
Тильде не предоставляет инструменты для изменения этой иконки или ссылки, а также не даёт стилизовать эти хлебные крошки. Базово иконка с домиком ведёт на главную страницу сайта.

Но если вам хочется изменить иконку или ссылку, а также поменять цвет текста или шрифт, вы можете воспользоваться данной модификацией.

  1. Вставьте код SVG-иконки в форму ниже. Подготовьте иконку заранее, выбрав её цвет и размер (квадрат 24*24px), затем откройте файл иконки в любом текстовом редакторе, скопируйте код.
  2. Если хочется изменить ссылку, впишите ссылку на страницу с вашего сайта в виде /page.
  3. При необходимости стилизуйте сами хлебные крошки, выбрав семейство шрифтов, установленное на вашем сайте, и цвет.

<!-- Замена иконки и ссылки в «домике» (ЛК) | https://necodim.ru/tilda/lk-home-icon -->

<script> t_onReady(() => { const HOME_LINK = '/page'; const ICON_SVG = `<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" viewBox="0 0 24 24" width="24px" height="24px" fill="#5985E1"><rect fill="none" height="24" width="24"/><path d="M19.5,12c0-0.23-0.01-0.45-0.03-0.68l1.86-1.41c0.4-0.3,0.51-0.86,0.26-1.3l-1.87-3.23c-0.25-0.44-0.79-0.62-1.25-0.42 l-2.15,0.91c-0.37-0.26-0.76-0.49-1.17-0.68l-0.29-2.31C14.8,2.38,14.37,2,13.87,2h-3.73C9.63,2,9.2,2.38,9.14,2.88L8.85,5.19 c-0.41,0.19-0.8,0.42-1.17,0.68L5.53,4.96c-0.46-0.2-1-0.02-1.25,0.42L2.41,8.62c-0.25,0.44-0.14,0.99,0.26,1.3l1.86,1.41 C4.51,11.55,4.5,11.77,4.5,12s0.01,0.45,0.03,0.68l-1.86,1.41c-0.4,0.3-0.51,0.86-0.26,1.3l1.87,3.23c0.25,0.44,0.79,0.62,1.25,0.42 l2.15-0.91c0.37,0.26,0.76,0.49,1.17,0.68l0.29,2.31C9.2,21.62,9.63,22,10.13,22h3.73c0.5,0,0.93-0.38,0.99-0.88l0.29-2.31 c0.41-0.19,0.8-0.42,1.17-0.68l2.15,0.91c0.46,0.2,1,0.02,1.25-0.42l1.87-3.23c0.25-0.44,0.14-0.99-0.26-1.3l-1.86-1.41 C19.49,12.45,19.5,12.23,19.5,12z M12.04,15.5c-1.93,0-3.5-1.57-3.5-3.5s1.57-3.5,3.5-3.5s3.5,1.57,3.5,3.5S13.97,15.5,12.04,15.5z"/></svg>`; const changeLink = (element) => { if (element && element.tagName.toLowerCase() === 'a') { element.href = HOME_LINK; } }; const changeIcon = (element) => { if (element) { element.innerHTML = ICON_SVG; } }; const observer = new MutationObserver((mutationsList, observer) => { for (const mutation of mutationsList) { if (mutation.type === 'childList') { const home = document.querySelector('.tmst-breadcrumbs__home'); if (home) { changeLink(home); changeIcon(home); observer.disconnect(); break; } } } }); const config = { childList: true, subtree: true }; observer.observe(document.body, config); }); </script>
Смотрите также
Пример работы модификации
Результат можно увидеть только на странице личного кабинета:
Made on
Tilda