Режими на вграждане
Inline, бутон или плаващо копче — кой режим кога да изберете и как изглежда за клиента.
Когато вграждаш записването в собствения си сайт, първото решение е как да изглежда. Има три режима и една втора настройка за начина на отваряне. Тази статия описва точно какво прави всеки от тях, как изглежда за клиента на компютър и на телефон, и кой за какъв тип сайт е подходящ.
Всички настройки живеят на едно място: Настройка → Публичен сайт → капсула «Вграждане».
1. «Как да се покаже» — трите режима
Това е първата група капсули на страницата, с надпис Как да се покаже.
| Режим | Какво вижда посетителят | Кога е правилният избор |
|---|---|---|
| Вграден | Формата стои в страницата, на мястото на кода | Имаш отделна страница «Запиши се» или голям празен блок |
| Бутон | Само бутон; записването изскача при клик | Искаш призив за действие на няколко места, без да заемаш място |
| Плаващ | Постоянно копче в долния ъгъл на всяка страница | Искаш записването да е под ръка навсякъде |
Под избирателя се появява ред с обяснение, който се мени според избора:
- Вграден — «Формата стои в страницата, на мястото където поставите кода. За отделна страница „Запиши се“ или блок в страничната лента.»
- Бутон — «Бутон, който отваря записването в изскачащ прозорец (на мобилен — на цял екран). CTA може да стои на няколко места.»
- Плаващ — «Постоянен плаващ бутон в ъгъла на всяка страница — записването винаги под ръка.»
2. Режим «Вграден» подробно
Формата се появява точно там, където си сложил кода, като част от подредбата на страницата.
Настройка, която се появява само тук:
| Поле | Стойности | По подразбиране |
|---|---|---|
| Височина (px) | 360 – 1200, стъпка 20 | 680 |
Височината е фиксирана. Формата не се разтяга сама — ако съдържанието е по-високо от зададеното, вътре в рамката се появява собствена лента за превъртане. Това е нормално и не е грешка.
Как да избереш височина:
- 560–640 px — тесен блок в странична лента.
- 680 px — универсалната стойност по подразбиране. Работи за повечето салони.
- 800–1000 px — ако имаш много услуги и искаш целият списък да се вижда без превъртане вътре.
Първо виж прегледа отдясно с истинската си услуга, преди да фиксираш число. Салон с три услуги и салон с двадесет имат много различни нужди.
3. Режим «Бутон» подробно
На страницата се появява само бутон. При клик записването се отваря върху сайта.
Настройки, които се появяват при този режим:
| Поле | Какво прави | По подразбиране |
|---|---|---|
| Текст на бутона | Надписът върху бутона | «Запази час» |
| Цвят | Фонът на бутона | тъмносиньо (#111827) |
| Как се отваря | Прозорец или Панел отдясно | Прозорец |
Бутонът винаги носи иконка с календар вляво от текста. Ако изтриеш текста, остава само иконката — компактно копче.
Формата на бутона е леко заоблен правоъгълник. Няма настройка за размера или шрифта — това е нарочно, за да изглежда еднакво във всеки сайт.
4. Режим «Плаващ» подробно
Копчето се залепва в долния десен ъгъл на прозореца и остава там, докато посетителят чете и превърта. Има същите настройки като режим «Бутон», но формата му е кръгла капсула, не правоъгълник.
Разликата с «Бутон» е само в позиционирането: плаващото копче игнорира мястото, на което си сложил кода — то винаги се закача за ъгъла на екрана. Затова кодът за плаващ режим е най-удобно да е в общ шаблон (footer, header), който се зарежда на всяка страница.
Ако имаш и друго плаващо нещо в ъгъла — чат, бисквитки, «нагоре» — виж дали не се застъпват. Скриптът поддържа атрибут
data-position="left", който мести копчето в левия ъгъл. Той не е в интерфейса и се добавя ръчно в кода.
5. «Как се отваря» — вторият избор
Тази втора група капсули се появява само при режими Бутон и Плаващ.
| Опция | На компютър | На телефон |
|---|---|---|
| Прозорец | Изскача в средата на екрана, върху затъмнен фон | На цял екран |
| Панел отдясно | Плъзга се отдясно и заема цялата височина | На цял екран |
И в двата случая има:
- бутон × в тънка лента най-горе;
- затваряне с клавиша Esc;
- затваряне с клик върху затъмнения фон.
На телефон разликата изчезва — прозорецът е на цял екран и в двата случая. Значи изборът има значение само за посетителите от компютър.
Кое да избереш:
- Прозорец — по-познато, по-неутрално. Добро по подразбиране.
- Панел отдясно — усеща се «по-приложно», добро за сайтове с плътно съдържание, където не искаш да закриеш всичко.
6. Сравнение накратко
| Вграден | Бутон | Плаващ | |
|---|---|---|---|
| Заема място в страницата | да | не | не |
| Видим без скролване | зависи къде е | зависи къде е | винаги |
| Може да е на няколко места | да | да | безсмислено (само едно) |
| Има настройка за височина | да | не | не |
| Има настройка за текст и цвят | не | да | да |
| Може да се отвори като панел | не | да | да |
7. Смяна на режима после
Режимът не е «настройка на акаунта» — той живее в самия код. Значи:
- Върни се в Настройка → Публичен сайт → Вграждане.
- Избери новия режим и допълнителните полета.
- Натисни Копирай кода.
- Замени стария код в сайта си с новия.
Ако само копираш новия, без да махнеш стария, ще имаш две джаджи наведнъж.
Може и да комбинираш: Вграден на страницата «Запиши се» и Плаващ в общия шаблон. Скриптът се зарежда веднъж и обслужва и двете.
8. Какво е общо и за трите режима
- Показват едно и също записване — същите услуги, същите часове, същите цени.
- Носят изгледа от редактора на страницата за записване, не стиловете на твоя сайт.
- Работят в изолирана рамка (iframe) — сигурно и без конфликти с CSS на сайта ти.
- Зависят от ключа Онлайн записване. Ако той е изключен, и трите режима няма да покажат нищо.
Какво следва
- Вграждане в собствен сайт — целият процес и кодът с примери.
- Вграждане в WordPress — къде точно да сложиш кода.
- Ако нещо не се показва — когато джаджата не се появява.
- Страница за записване: обзор — къде се управлява изгледът.