Для создания параллакс эффекта на сайте wordpress не обязательно использовать скрипт – достаточно воспользоваться CSS и HTML.
Скачать исходники для статьи можно ниже
1. Добавляем CSS стили для параллакс эффекта.
Для этого заходим в файл стилей wordpress – style.css – находится в админке, пункт “Внешний вид”, подпункт “Редактор”.
Добавляем в файл стилей следующий код:
section.module.parallax {
height: 394px;
background-position: 50% 50%;
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
}
section.module.parallax h1 {
color: rgba(255, 255, 255, 0.8);
font-size: 48px;
line-height: 394px;
font-weight: 700;
text-align: center;
text-transform: uppercase;
text-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}
section.module.parallax-1 {
background-image: url(/wp-content/uploads/2017/05/holm.jpg);
}
2. Добавляем следующий кусок HTML кода – там где хотим видеть параллакс эффект.
<section class="module parallax parallax-1">
<div class="container">
<div class="row">
<div class="col-xs-8 col-md-8">
<h1>Section 1</h1>
Mnogoblog
</div>
<div class="col-xs-4 col-md-4">
Mnogoblog
</div>
</div>
</div>
</section>
Для примера, можно создать новую страничку, выбрать “Текстовой редактор” (вкладка “Текст”) и вставить на страничку вышеуказанный код:

