Как создать предварительный загрузчик на WordPress с помощью Elementor

Muneeb Учебные пособия по WordPress Nov 22, 2021

Предварительный загрузчик, также известный как загрузчик, представляет собой простую или сложную анимацию или GIF, которая продолжает работать на странице, пока загружается другое содержимое страницы.

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

Как создать предварительный загрузчик с помощью Elementor

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

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

Создавайте потрясающие сайты

С лучшим бесплатным конструктором страниц Elementor

Начать сейчас

После того, как вы решили, на какой странице вы собираетесь разместить предварительный загрузчик, найдите SVG или GIF, который подходит для вашего веб-сайта и этой конкретной страницы. Icons8 - действительно известный источник анимации Preloaders.

Если вы не знаете, как импортировать файлы в формате SVG на Elementor, просмотрите наше руководство .

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

  • Если вы хотите использовать предварительный загрузчик для всего веб-сайта, создайте новый раздел в шаблоне заголовка .
  • Если вы хотите использовать предварительный загрузчик для определенной страницы, создайте новый раздел вверху страницы .

В обоих случаях обязательно измените настройки раздела на Без зазора .

В целом, когда вы закончите с настройками, перейдите на вкладку «Элементы» в левой части экрана и выберите HTML .

В поле HTML добавьте следующий код, не забудьте изменить URL-адрес предварительного загрузчика на свой собственный.

>div class="loader" /divscript/scriptstyle/style

В кодировке есть комментарии, позволяющие новичкам внести какие-либо изменения, если в этом возникнет необходимость.

Наконец, опубликуйте свой Preloader и проверьте, правильно ли он работает. Вот как вы можете создать предварительный загрузчик с Elementor на своем веб-сайте WordPress.

Мы надеемся, что это руководство поможет вам удержать пользователей вашего веб-сайта, а также сделает его более профессиональным. Это все, что нам нужно для этого урока. Не забудьте присоединиться к нам в Twitter и Facebook, чтобы быть в курсе нашего контента.