...
CSS Stylesheet |
---|
.top-button {
background-image: url(https://confluence.twin24.ai/download/thumbnails/23986188/baseline_keyboard_arrow_up_white_18dp.png) !important;
background-position: center;
background-color: #47a7f5 !important;
background-repeat: no-repeat;
box-shadow: -1px 1.5px 3px #999;
color: #47a7f5 !important;
border-radius:50px !important;
position: fixed;
bottom: 45px;
left: 93.5%;
width: 50px;
height: 50px !important;
font-size: 12px !important;
padding: 14.5px !important;
z-index: 2;
}
.top-button:hover{
background-color: #65b9ff !important;
color: #65b9ff !important;
}
.page-header{
background-color: #232838;
background-repeat: no-repeat;
background-position: center;
width: auto;
height: 100px;
background-image: url(https://confluence.twin24.ai/download/attachments/23986188/logo_twin-02.png);
background-size: 10em;
color: #fff;
font-size: 20px;
padding: 20px;
}
.page-footer{
background-color: #232838;
background-image: url(https://confluence.twin24.ai/download/thumbnails/23986188/decorated-pattern-dark.png);
width: auto;
height: 10px;
color: #fff;
text-align: end;
font: small-caption;
padding-inline-end: 30px;
padding-top: 200px;
padding-bottom: 30px;
}
.page-headline{
background-image: url(https://confluence.twin24.ai/download/thumbnails/23986188/Solid256dot8_2changed.png);
background-repeat: no-repeat;
background-position-x: -227px;
background-position-y: center;
padding: 20px;
background-color: #007bff;
width: auto;
height: 10px;
color: #fff;
text-align: center;
font: caption;
font-weight: 600;
}
.tabs-menu{
padding-left: 85% !important;
} |
Message Box | ||||||
---|---|---|---|---|---|---|
| ||||||
|
Общая информация
Сообщения, отправляемые чат-ботом, могут содержать ссылки на различные интернет-ресурсы. При переходе по такой ссылке клиент попадет на целевой ресурс (например, на страницу для покупки билетов на поезда дальнего следования). Использования Использование ссылок на информационные ресурсы помогает сократить время клиента на поиск нужной информации.
Информация |
---|
Ссылки можно размещать в блоках Информация, Вопрос и Пауза. |
В языке HTML для создания ссылок используется тег <a> и его атрибут href:
- <a> – тег для создания текста ссылки, который будет отображаться в диалоге.
- href – атрибут тега <a>. Его значением является адрес целевой страницы, на которую осуществляется переход.
Чтобы Чтобы нужное слово (или фраза) стало ссылкой, поместите его между открывающим и закрывающим тегами — — <a>…</a>. С помощью атрибута href укажите адрес страницы нужного сайта, например:
Блок кода | ||||||||
---|---|---|---|---|---|---|---|---|
| ||||||||
<a href="https://twin24.ai/">этой ссылке</a> |
Переход по указанной ссылке будет выполняться на текущей вкладке браузера. Чтобы при переходе по ссылке открывалась новая вкладка, используйте атрибут атрибут target со значением blank:
Блок кода | ||||||||
---|---|---|---|---|---|---|---|---|
| ||||||||
<a href="https://twin24.ai/" target="_blank">этой ссылке</a>. |
Использование в сценарии бота
Примечание | |
---|---|
Предупреждение | |
Внимание | Данный – данный способ работает только для веб-виджета и телеграмаTelegram. ВК, WhatsApp, Viber – не поддерживают гиперссылки. |
Выполните следующие действия:
- Откройте нужный сценарий.
...
- В окне редактора сценариев разместите блок Информация.
Разместите в
...
блоке Информация следующий текст:
Блок кода | ||
---|---|---|
| ||
Перейти на наш сайт можно по <a href="https://twin24.ai/" target="_blank">этой ссылке</a>. |
В диалоге телеграма сообщение бота будет диалоге Telegram сообщение бота будет выглядеть так:
В диалоге виджета сообщение бота будет выглядеть так:
Button Hyperlink