Как сделать кликабельный номер телефона на сайте в Тильде

Это статья посвящена одному из самых важных аттрибутов современных сайтов — кликабельность номера телефона. Как это не удивительно звучит, но многие разработчики забывают сделать телефон кликабельным, а посетитель сайта потом ломает голову и пальцы, чтоб сначала скопировать этот телефон, а потом вставить его в набор.

Давайте рассмотрим конкретный пример для сайтов в Тильде.

Кликабельность телефона в меню (Header)

Меню вы можете расположить на странице сайта (если у вас лендинг) или в специальной странице сайта Header, где располагается сквозная шапка для всех страниц. Находим свое меню и заходим в КОНТЕНТ этого блока.

Находим в моем случае раздел «Дополнительно» (у вас телефон может быть, скажем, в логотипе). Выделяем свой телефон и в появивишейся панели сверху нажимаем на значок ссылки:

Далее нажимаем на «Вставить ссылку» и заполняем следующее окно:

1. В поле URL вставляем tel:ваш_номер. В моем случае это поле нужно заполнить так:

tel:+380996543445

Удаляем с номера все пробелы, тире, скобочки — ЭТО ВАЖНО. Если вы используете телефон в международном формате с кодом страны, то + оставляем, если без кода страны, то в поле URL можно вставить такую ссылку:

tel:0996543445

2. Меняем цвет ссылки на тот, который вам нужно.
3. Ставим «Размер линии» = 0 , чтобы не было подчеркивания как у обычных ссылок.

Если вы «загнали» телефон в логотип, то там все еще проще. Заходим в КОНТЕНТ блока и ищем раздел «Логотип». Вставляем в поле «ССЫЛКА» ваш ссылку с номером телефона

tel:+380996543445

Сохраняем изменения и опубликовываем страницу. Если вы делали изменения в специальной странице Header, то не забываем, что нужно опубликовать все страницы сайта.

Смотрим результат на своем мобильном. Вуаля.

Как сделать телефон кликабельным в любом месте сайта в Тильде

Если вам нужно сделать телефон кликабельным в каком-то блоке, то необходимо выполнить практически такие же действия, как и в случае с Меню.

Заходим в КОНТЕНТ блока. Находим карточку (для товаров, отзывов, команды и т.д.) или текстовое поле с номером телефона.

Выделяем телефон и кликаем на значке ссылки. Дальше выполняем уже знакомые нам действия:

1. В поле URL вставляем tel:ваш_номер. В моем случае это поле нужно заполнить так: «tel:380996543445» . Удаляем с номер все пробелы, тире, скобочки. Если вы используете телефон в международном формате с кодом страны, то + оставляем, если без кода страны, то в поле URL можно вставить такую ссылку: «tel:0996543445»
2. Меняем цвет ссылки на тот, который вам нужно.
3. Ставим «Размер линии» = 0 , чтобы не было подчеркивания как у обычных ссылок.

Публикуем свои изменения и проверяем. Все будет работать в мобильной версии сайта.

Как сделать кликабельный телефон в Footer (подвале) сайта.

Тут все просто. Выполняем ровным счетом такие же действия, как в инструкции для Меню (смотрите выше).

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

Все выглядит не сложно. И так оно и есть. Для наглядности пересмотрите видео ниже, где я разбираю процедуру создания кликабельных телефонов для сайтов на Тильде на примерах: