Кнопки ^#1823

Кнопки можно использовать на страницах сайта, например, в описаниях услуг или товаров. Они сразу бросаются в глаза и в большинстве случаев побуждают посетителя совершить действие через данную кнопку.

Далее мы рассмотрим, как создавать изображения для кнопок и вставлять их в качестве ссылок на текстовые страницы вашего сайта.

Зайдите в панель управления сайта. В меню данных сайта выберите пункт "Кнопки".

Откроется страница-модуль “Кнопки”. В данном модуле хранятся все созданные изображения для кнопок (Кнопки).

Для создания кнопки кликните по “+Создать кнопку”.

Откроется окно “Генератор кнопок”. Оно имеет следующий вид.

Введите текст, который будет отображаться на кнопке (прим. Заказать, Прайс-лист, Контакты). Затем нажмите по появившейся кнопке "Применить". Изменения вступят в силу.

Вы можете применить готовый стиль кнопки или создать свой собственный.

Для выбора готового стиля достаточно кликнуть по понравившейся кнопке в разделе “Применить готовый стиль”.

Затем нажмите “Сохранить”.

Для создания собственного стиля кнопки выберите цвет кнопки в меню “Выбор цвета”.

Выберите подходящий размер и тип шрифта.

Если вам необходимо создать более детальный дизайн кнопки, кликните по вкладке ”Дополнительные настройки”.

Откроются такие инструменты как:

• Цвет текста;
• Цвет кнопки;
• Тень от текста;
• Тень от кнопки;
• Отступы;
• Рамка;
• Скругление углов;
• Внутреннее размытие.

Кликните по кнопке с текущим цветом шрифта, откроется окно выбора цвета. Выберите из палитры нужный цвет и кликните “Ок”.

В меню “Цвет кнопки” в “Дополнительных настройках” можно выбрать количество цветов и способ заливки:

• Одноцветная;
• Два цвета;
• Градиент (из 2-х цветов).

При выборе “Два цвета” появится кнопка со вторым цветом. Кнопка будет выглядеть следующим образом.

При выборе “Градиент (из 2-х цветов)” кнопка будет иметь следующий вид.

Для того, чтобы включить эффект тени для текста или кнопки, кликните по галочке с соответствующим эффектом.

Окно примет следующий вид. В настройках тени можно выбрать:

• Цвет (выбор цвета тени);
• Угол (выбор угла освещения, под которым образуется тень). Для того чтобы изменения вступили в силу, кликните "Применить". ;
• Непрозрачность (в процентах);
• Размер тени (выбор размера тени);
• Сдвиг тени (выбор отдаленности тени от объекта).

Соответственно и кнопка примет имеющиеся параметры тени.

В меню “Отступы” можно настроить размеры кнопки, а именно ширину и высоту.

• Сверху / Снизу - вертикальные отступы от текста;
• Слева / Справа - горизонтальные отступы от текста.

В меню “Рамка” можно настроить цвет и толщину рамки.

В меню “Скругление углов” можно выбрать радиус скругления углов кнопки.

Для добавления эффекта размытия, внутри кнопки кликните по галочке “Внутреннее размытие”. Окно примет следующий вид.

Вы можете выбрать цвет и размер слоя размытия.

Соответственно кнопка будет принимать заданные параметры внутреннего размытия.

После настройки стиля кнопки кликните по кнопке “Сохранить”.

Изображение кнопки сохранено в системе управления!

• Инструкцию по вставке кнопки через текстовый редактор вы можете прочитать по ссылке.
• Все кнопки в данном конструкторе создаются в формате PNG, то есть - в виде простых изображений, которые можно затем вставлять в текст и привязывать к ним ссылки. Если же вам необходимо адаптивное, векторное изображение (SVG), рекомендуем вам самостоятельно создать изображение в данном формате (например, с помощью специализированных SVG-редакторов), загрузить его в раздел "Иллюстрации" и затем просто вставить в текст изображение в качестве кнопки, точно так же привязав к нему необходимую ссылку.