Вы можете добавить на сайт кнопку для быстрой связи через WhatsApp. Она будет отображаться на всех страницах вашего блога — удобно для связи с потенциальными клиентами.
Перейдите в административную панель SilverBox и найдите поле для вставки пользовательского кода «Код метрики».
Скопируйте следующий код и вставьте его в это поле:
<a href="https://wa.me/79220222218" class="custom-button"><i class="fa fa-whatsapp"></i></a>
<style>
.custom-button {
display: block;
position: fixed;
bottom: 68px;
right: 16px;
z-index: 1100;
width: 50px;
height: 50px;
line-height: 46px;
font-size: 28px;
text-align: center;
border-radius: 999px;
background: linear-gradient(to bottom, #5ad065, #24b23b);
box-shadow: 0 4px 6px rgba(0,0,0,0.2);
-webkit-tap-highlight-color: transparent;
color: #fff;
transition: text-shadow 0.4s;
border: 2px solid #fff;
}
.custom-button:hover {
text-shadow: 0px 0px 8px #128C7E;
}
</style>В строке:
<a href="https://wa.me/79220222218" ...
Поменяйте номер на свой, только в формате: 7XXXXXXXXXX
Без плюсов, пробелов и тире.
Нажмите «Сохранить», чтобы применить код.
Кнопка не будет видна авторизованным пользователям. Чтобы убедиться, что всё работает: выйдите из системы или откройте ваш сайт в режиме «Инкогнито».
По аналогии можно разместить кнопку Телеграм. Не стоит размещать обе кнопки одновременно, чтобы визуально не перегружать пространство.
<a href="https://t.me/egenzen" class="custom-button-tg"><i class="fa fa-telegram"></i></a>
<style>
.custom-button-tg {
display: block;
position: fixed;
bottom: 68px;
right: 16px;
z-index: 1100;
width: 50px;
height: 50px;
line-height: 46px;
font-size: 28px;
text-align: center;
border-radius: 999px;
background: #3390ec;
box-shadow: 0 4px 6px rgba(0,0,0,0.2);
-webkit-tap-highlight-color: transparent;
color: #fff;
transition: text-shadow 0.4s;
border: 2px solid #fff;
}
.custom-button-tg:hover {
text-shadow: 0px 0px 8px #1d71d8;
}
</style>