Categories

Landing Page. Как заменить фоновое видео изображением

Andre Flores Июль 7, 2015
Rating: 5.0/5. From 2 votes.
Please wait...

Добрый день! Из этого туториала Вы узнаете, как заменить фоновое видео изображением в шаблонах Landing Page.

Landing Landing Page. Как заменить фоновое видео изображением

Если Вы хотите заменить фоновое видео на стандартное фоновое изображение, Вы можете следовать таким инструкциям:

landing_template_how_to_change_background_1

Во-первых, Вам нужно деактивировать сценарий, который запускает видео.

  1. Используя FTP/Менеджер файлов откройте файл /js/scripts.js для редактирования.

  2. В этом файле найдите следующий код:

	(function ($) {
	var o = $('.vide');
	if (o.length > 0) {
	include('js/jquery.vide.js');
	}
	})(jQuery);

Этот код нужно деактивировать, комментировав его, или удалить его. В результате Вы получите следующее:

	/*(function ($) {
	var o = $('.vide');
	if (o.length > 0) {
	include('js/jquery.vide.js');
	}
	})(jQuery);*/

Сохраните файл, для того чтобы изменения вступили в действие:

landing_template_how_to_change_background_2

Вы можете видеть, что видео больше не отображается на сайте:

landing_template_how_to_change_background_3

Теперь добавим фоновое изображение на страницу.

  1. Загрузите желаемое фоновое изображение в папку /images/ . Например, этим изображением будет «background-image.jpg».

  2. Затем, используя дополнение Firebug для браузера Firefox или стандартный функционал «Исследовать элемент» («Inspect Element») других браузеров, найдите класс, который был закреплён за видео:

    landing_template_how_to_change_background_4

  3. Теперь назначим правило CSS найденному ранее классу. Правило будет выглядеть таким образом:

	.vide {
	background-image: url("../images/background-image.jpg");
	}

Добавьте код в конец вашего файла /css/style.css:

landing_template_how_to_change_background_5

Не забудьте сохранить файл, для того чтобы изменения вошли в силу.

Перейдите на ваш сайт и обновите страницу, для того чтобы увидеть внесённые изменения.

Фоновое изображение было успешно добавлено.

Это конец данного туториала. Теперь Вы знаете, как изменить фон в вашем шаблоне Landing page.

Вы можете также ознакомиться с детальным видео-туториалом ниже:

Landing Page. Как заменить фоновое видео изображением

Шаблоны для Лендингов
Эта запись была размещена в Landing Page туториалы и помечена как background, image, landing, page, video. Добавьте в закладки постоянную ссылку.

Submit a ticket

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