Как открыть страницу на нужной вкладке ME602 / ME603 в Tilda?

Лайфхак и скрипт для открытия страницы на нужной вкладке блоков ME602 и ME603. Если что, это вкладки с цветом фона и вкладки с обводкой внизу.

Допустим, у вас есть несколько вкладок и скрытый в них контент. Вы хотите показать не первую вкладку, которая открывается по умолчанию, а любую другую. Если пользователь переходит откуда-то с другой страницы, то можно просто использовать особую ссылку — об этом поговорим в разделе «Лайфхак». Если же вы хотите сразу при загрузке страницы открывать какую-то вкладку (например, это необходимо сделать на главной), то нужно будет использовать скрипт — об этом в соответствующем разделе. Поехали!

Лайфхак

С ним всё очень просто — в ссылке на вашу новую страницу с вкладками указываете хэш #!/tab/123456789−2, т. е. ваша полная ссылка будет выглядеть так: /new-page#!/tab/123456789−2, где:
  • /new-page — это адрес целевой страницы (если главная, то просто «/»);
  • 123456789 — это ID блока ME602 или ME603 без «rec»;
  • 2 — это номер вкладки в меню.
Работает это как с блоком ME602, так и с блоком ME603.

Скрипт

А, вот, чтобы страница сама при загрузке открывала нужную вкладку, используйте скрипт (поместить его нужно будет в блок T123 в самом низу страницы).

В первой строке скрипта нужно указать номер вкладки в переменной num. Изначально для примера я установил вторую вкладку: const numTab = 2.
<!-- Как открыть страницу на нужной вкладке ME602 / ME603 в Tilda? | https://necodim.ru/tilda/tab-number -->
<script>
let numTab = 3;
setTimeout(function() {
    document.querySelectorAll('.t395__tab')[numTab-1].click();
}, 20);
</script>
Теперь вы властны над блоком с вкладками :)

Если скрипт не будет срабатывать, увеличивайте число (20) в предпоследней строке: 50, 100, 200 — это время в миллисекундах после загрузки страницы, через которое вкладка должна переключиться. В принципе, 500 мс точно должно хватить, но на тестах и 20 мс работало.
Пример работы модификации
Вы же не включали третью вкладку? :D
Made on
Tilda