Шаблон услуги

Создание и настройка страницы

Создаем страницу
Переключаемся в режим редактирования «Beckend редактора WPBackery»

3. Включаем сайдбар на странице. Для этого внизу страницы в блоке «View options» включаем чекбокс Use selected layout and sidebar options и выставляем настройки как на скриншоте ниже:

Загружаем шаблон страницы

Открываем окно выбора шаблонов:

2. Выбираем шаблон «Страница услуги»

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

Содержание

блок состоит из «обвертки» и «значений»:

Каждое значение хранит в себе пункт содержания со следующими полями настройки:

Особое внимание заслуживает поле «Ссылка». В этом поле нужно вводить уникальный id блока с которым нам нужно связать этот элемент содержания. Т.е. во фронтенде при клике на этот элемент меню сайт будет скроллится к блоку с выбранным id.

Для иконок можно использовать изображения: flaticon.com

Пример

Нам нужно связать первый элемент содержания с секцией содержащую галерею:

Для этого в настройках «Строка содержания» в поле «Ссылка» укажем #one. Такой же id и укажем в настройках секции:

Блок :: Оформление

В редакторе WPBackery представлен елементом «Галереей» со следующими настройками:

На странице можно разместить несколько таких блоков. Добавить новый блок можно через «добавить элемент» или путем дублирования существующего элемента:

Блок :: Рекомендуемые товары

В редакторе WPBackery представлен елементом «Рекомендуемые товары» со следующими настройками:

Блок :: Кнопки вызова заявок

В редакторе WPBackery представлен елементами «Блок с модальным окном»:

Контент менеджеру настраивать этот блок не нужно!

Блок :: Видео

В редакторе WPBackery состоит из обвертки «Видео контейнер» и элементов с видео:

Для каждого элемента с видео можем задать ссылку на Ютуб видео и «плейсхолдер» картинку:

Блок :: Стоимость

В редакторе WPBackery представлен елементами «Блок прайс»:

Блок :: Пример сметы (несколько фотографий)

Состоит из двух элементов. Обвертка «Контейнер блока сметы» и товаров «Woocommerce Товар»:

Допускается использования нескольких блоков на странице. Наиболее простой способ добавить еще один такой блок — это сдублировать существующий и изменить его содержимое:

Блок :: Пример сметы (одна фотография)

Состоит из двух элементов. Обвертка «Контейнер блока сметы с одним рисунком» и товаров «Woocommerce Товар»:

Сайдбар

Ссылки на скачивания документов можно прописать в файле «single-uslugi.php»:

Резервная копия кода для виджета:

<div class="rbf-wrap">
    <p class="rbf-title mod"><i>Офлайн</i> документы <span>для печати</span></p>
    <div class="doc-btns">
    	<a href="#" class="doc-btn btn-doc">
    		Типовой договор
    		<svg xmlns="http://www.w3.org/2000/svg" width="28.001" height="27.999" viewbox="0 0 28 28">
				<g id="doc" transform="translate(-1177 -480)">
					<path id="_31" data-name="3" d="M-8109,28h-28V4a4,4,0,0,1,4-4h16l8,8V28Z" transform="translate(9314 480)" fill="#fff"/>
					<path id="_21" data-name="2" d="M-8129,8h-4a4,4,0,0,1-4-4V0l8,8Z" transform="translate(9334 480)" fill="#d12026"/>
					<path id="_11" data-name="1" d="M5.688-4A4.8,4.8,0,0,1,4.9-1.029,2.706,2.706,0,0,1,2.616,0H.693V-7.853h2.1A2.517,2.517,0,0,1,4.925-6.84,4.633,4.633,0,0,1,5.688-4Zm-1.5.043q0-2.632-1.45-2.632H2.154v5.312h.473a1.268,1.268,0,0,0,1.182-.669A4.167,4.167,0,0,0,4.189-3.958Zm8.046.021a5.2,5.2,0,0,1-.73,3A2.394,2.394,0,0,1,9.416.107,2.4,2.4,0,0,1,7.321-.937a5.224,5.224,0,0,1-.73-3.01,5.164,5.164,0,0,1,.73-2.989A2.416,2.416,0,0,1,9.426-7.976,2.382,2.382,0,0,1,11.51-6.931,5.221,5.221,0,0,1,12.235-3.937Zm-4.152,0a4.872,4.872,0,0,0,.338,2.046,1.07,1.07,0,0,0,.994.7q1.321,0,1.321-2.75T9.426-6.687a1.077,1.077,0,0,0-1,.7A4.869,4.869,0,0,0,8.083-3.937Zm7.9-2.75a1.1,1.1,0,0,0-.991.736A4.713,4.713,0,0,0,14.631-3.9q0,2.729,1.423,2.729a2.6,2.6,0,0,0,1.305-.4v1.3a2.612,2.612,0,0,1-1.472.381A2.311,2.311,0,0,1,13.849-.948a5.273,5.273,0,0,1-.712-2.968A5.219,5.219,0,0,1,13.871-6.9a2.336,2.336,0,0,1,2.038-1.069,2.86,2.86,0,0,1,.824.118,3.3,3.3,0,0,1,.846.414L17.1-6.247a4.286,4.286,0,0,0-.516-.3A1.314,1.314,0,0,0,15.984-6.687Z" transform="translate(1182.02 502.008)" fill="#ff5b5b"/>
				</g>
			</svg>
    	</a>
		<a href="#" class="doc-btn btn-pdf">
			Скачать каталог
			<svg xmlns="http://www.w3.org/2000/svg" width="28.001" height="27.999" viewbox="0 0 28 28">
				<g id="pdf1" transform="translate(-1177 -480)">
					<path id="_32" data-name="3" d="M-8109,28h-28V4a4,4,0,0,1,4-4h16l8,8V28Z" transform="translate(9314 480)" fill="#fff"/>
					<path id="_12" data-name="1" d="M-8129,8h-4a4,4,0,0,1-4-4V0l8,8Z" transform="translate(9334 480)" fill="#d12026"/>
					<path id="_22" data-name="2" d="M4.974-5.436a2.693,2.693,0,0,1-.631,1.92,2.388,2.388,0,0,1-1.823.669H2.154V0H.693V-7.853H2.686Q4.974-7.853,4.974-5.436ZM2.154-4.114h.279a1.017,1.017,0,0,0,.8-.3A1.439,1.439,0,0,0,3.5-5.376a1.439,1.439,0,0,0-.242-.916.9.9,0,0,0-.747-.3H2.154Zm8.8.113a4.8,4.8,0,0,1-.792,2.973A2.706,2.706,0,0,1,7.885,0H5.962V-7.853h2.1A2.517,2.517,0,0,1,10.194-6.84,4.633,4.633,0,0,1,10.957-4Zm-1.5.043q0-2.632-1.45-2.632H7.423v5.312H7.9a1.268,1.268,0,0,0,1.182-.669A4.167,4.167,0,0,0,9.458-3.958ZM13.551,0H12.1V-7.853h3.518V-6.59H13.551V-4.41h1.928v1.262H13.551Z" transform="translate(1183 502)" fill="#ff5b5b"/>
				</g>
			</svg>
		</a>
    	<a href="#" class="doc-btn btn-pdf">
    		Прайс-лист
			<svg xmlns="http://www.w3.org/2000/svg" width="28.001" height="27.999" viewbox="0 0 28 28">
				<g id="pdf2" transform="translate(-1177 -480)">
					<path id="_33" data-name="3" d="M-8109,28h-28V4a4,4,0,0,1,4-4h16l8,8V28Z" transform="translate(9314 480)" fill="#fff"/>
					<path id="_13" data-name="1" d="M-8129,8h-4a4,4,0,0,1-4-4V0l8,8Z" transform="translate(9334 480)" fill="#d12026"/>
					<path id="_23" data-name="2" d="M4.974-5.436a2.693,2.693,0,0,1-.631,1.92,2.388,2.388,0,0,1-1.823.669H2.154V0H.693V-7.853H2.686Q4.974-7.853,4.974-5.436ZM2.154-4.114h.279a1.017,1.017,0,0,0,.8-.3A1.439,1.439,0,0,0,3.5-5.376a1.439,1.439,0,0,0-.242-.916.9.9,0,0,0-.747-.3H2.154Zm8.8.113a4.8,4.8,0,0,1-.792,2.973A2.706,2.706,0,0,1,7.885,0H5.962V-7.853h2.1A2.517,2.517,0,0,1,10.194-6.84,4.633,4.633,0,0,1,10.957-4Zm-1.5.043q0-2.632-1.45-2.632H7.423v5.312H7.9a1.268,1.268,0,0,0,1.182-.669A4.167,4.167,0,0,0,9.458-3.958ZM13.551,0H12.1V-7.853h3.518V-6.59H13.551V-4.41h1.928v1.262H13.551Z" transform="translate(1183 502)" fill="#ff5b5b"/>
				</g>
			</svg>
    	</a>
    </div>
    <p class="rbf-text">Звоните <a href="tel:+78003015677">8-800-301-56-77</a> <br> <a href="mailto:[email protected]">[email protected]</a></p>
</div>