Показать список контента по 5 блоков

PHP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
// подгрузка контента на главной
 
let items = document.querySelectorAll(".block_2_items_right .item");
let more = document.querySelector(".block_34_add_more");
let currentIndex = 5;
 
more.addEventListener("click", function() {
  for (let i = currentIndex; i < currentIndex + 5; i++) {
    if (i >= items.length) {
      more.style.display = 'none';
      break;
    }
    items[i].classList.remove("hide");
  }
 
  currentIndex += 5;
 
  if (currentIndex >= items.length) {
    currentIndex = 0;
  }
 
});

PHP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<div class="block_2_items_right">
<a href="javascript:;" data-fancybox data-src="#order_form" class="item">Головная боль</a>
<a href="javascript:;" data-fancybox data-src="#order_form" class="item">Слабая концентрация</a>
<a href="javascript:;" data-fancybox data-src="#order_form" class="item">Замена звуков или слов</a>
<a href="javascript:;" data-fancybox data-src="#order_form" class="item">Заикание</a>
<a href="javascript:;" data-fancybox data-src="#order_form" class="item">Затруднения в адаптации</a>
<a href="javascript:;" data-fancybox data-src="#order_form" class="item hide">Движение головы</a>
<a href="javascript:;" data-fancybox data-src="#order_form" class="item hide">Ограниченные социальные навыки</a>
<a href="javascript:;" data-fancybox data-src="#order_form" class="item hide">Повышенная чувствительность</a>
<a href="javascript:;" data-fancybox data-src="#order_form" class="item hide">Сложности произноения звуков или слогов</a>
<a href="javascript:;" data-fancybox data-src="#order_form" class="item hide">Трудности в организации</a>
<a href="javascript:;" data-fancybox data-src="#order_form" class="item hide">Сложности в школе</a>
<a href="javascript:;" data-fancybox data-src="#order_form" class="item hide">Частые ошибки</a>
<a href="javascript:;" data-fancybox data-src="#order_form" class="item hide">Задержка развития речи</a>
<a href="javascript:;" data-fancybox data-src="#order_form" class="item hide">Спастические движения</a>
<a href="javascript:;" data-fancybox data-src="#order_form" class="item hide">Вырывания волос</a>
<a href="javascript:;" data-fancybox data-src="#order_form" class="item hide">Ограниченные и повторяющиеся интересы</a>
<a href="javascript:;" data-fancybox data-src="#order_form" class="item hide">Непроизвольное издавание звуков</a>
<a href="javascript:;" data-fancybox data-src="#order_form" class="item hide">Отсутствие эмоционального контакта</a>
</div>
<div class="block_34_add_more">Показать еще...</div>

PHP
1
2
3
.full_block_2 .item.hide {
display: none;
}

 

Вывести пагинацию для страниц

PHP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<?php
 
if( isset( $_REQUEST[ 'page_number' ] ) ){
  $current_page = $_REQUEST[ 'page_number' ];
}
else{
  $current_page = 1;
}
 
$args = array(
  'category_name'    => 'festivals',
  'post_type' => 'post',
  'posts_per_page' => '2',
  'orderby'    => 'date',
  'paged' => $current_page
);
 
$query = new WP_Query( $args );
while ( $query->have_posts() ) {
  $query->the_post();
  the_title( '<h3>', '</h3>' );
}
 
$args = array(
  'total' => $query->max_num_pages,
  'current' => $current_page,
  'format' => '?page_number=%#%'
);
 
global $wp_query;
$wp_query->max_num_pages = $query->max_num_pages;
 
the_posts_pagination( $args );
 
?>

https://ru.wordpress.org/support/topic/не-выводится-пагинация/

mockups

https://psdmockup.ru/category-telefonyi/smartfonyi Мокап Google Pixel 3a & Pixel 3a XL https://unblast.com/mockups/phone/ https://www.free-mockup.com/downloads/category/smartphone/ https://pixelied.com/mockups/phone https://resourceboy.com/mockups/phone/ https://www.figma.com/community/tag/iphone%20mockup/files  

Slick.js: Скрыть слайдер, пока изображения не загрузятся

Решением является чистый CSS. Во-первых, вы добавляете CSS в свою слайдерную оболочку:

PHP
1
2
3
4
5
6
.your-slider-wrapper {
    opacity: 0;
    visibility: hidden;
    transition: opacity 1s ease;
    -webkit-transition: opacity 1s ease;
}

После того, как слайдер инициализирован, slick добавляет класс .slick-initialized к wrapeper. Вы …