Можно ли взять слайдеры, к примеру swiper.js или slick.js и интегрировать в wordpress?

так и делал, но ответ для себя так и не нашел, поэтому и спросил здесь

Как выровнять картинки в мобильной версии сайта?

gradk,

@media (max-width: 768px) { 
   .one{
     dispay: block;
   }
}

Как вытянуть данные?

Спасибо, вроде делал так же, но выбивало undefined

Как бы вы сделали такие блоки?

Ярослав Иванов, угу, вот только лучше с градиентами поиграть или svg. В этом и вопрос :)

Запутался в обычном скролле на чистом JS?

укоротить можно, но так написал, что бы понятно было) Спасибо за ответ, пойду смотреть что не так .

Может ли кто проверить верстку?

Doxi:
Можно так:
.news__item-btn:not(:last-child){
display:inline-block;
margin-bottom: 30px;
}

И добавьте ховер-эффекты, а то непривычно смотрится. А так, то более-менее, если первая верстка, даже по БЭМ (внимательно не смотрел).

Как наложить блоки друг на друга html+css?

PsyhoGhost: присвоить z-index:1; вашим obj-ектам, а menus - z-index:2;

Как наложить блоки друг на друга html+css?

но вы все это плохо делаете )
Соблюдайте вложеность, а еще лучше погуглите как правильно делать меню . Вот например :
codepen.io/dhanushbadge/pen/olsvi
codepen.io/philhoyt/pen/ujHzd
codepen.io/Sonick/pen/xJagi

Как наложить блоки друг на друга html+css?

body {
background: #ff0000; /*Тип фон*/
background-size: 100% 100%;
margin: 0 0 0 0;
background-attachment: fixed;
}

main {
text-align: center;
margin-top: 10px;
margin-bottom: 10px;
background: rgba(255,255,255, .8);
border-radius: 16px;
border-color: rgba(97, 70, 245, 0.7);
border-width: 5px;
border-style: solid;
width: 60%;
margin-left: 20%;
height: 100%;
margin-right: 20%;
text-align: center;
}

.header1 {
position: relative;
height: 70px;
border-radius: 10px 10px 0 0;
background: rgba(104, 193, 255, 0.7);
}

.menu1 {
width: 66.7%;
height: 70px;
margin-bottom: 0;
padding-left: 0;
margin-top: 0;
float: right;
}

.menu2, .menu3 {
width: 250px;
height: 70px;
margin-bottom: 0;
padding-left: 0;
margin-top: 0;
background: rgba(0, 151, 255, .7);
visibility: hidden;
position: absolute;
left:35%;
}
.menu3{
margin-left:50%;
}
.menu1 li:hover {
transition: 0.5s;
background-color: rgba(0, 126, 212, 0.7);
}

.menu2 li:hover, .menu3 li:hover {
transition: 0.5s;
background-color: rgba(117, 199, 255, 0.7);
}

li {
height: 70px;
width: 70px;
float: right;
font-size: 18px;
display: block;
font-weight: bold;
line-height: 70px;
}

.name1 { /*название связано с тематикой*/
height: 300px; /*уменьшено для вида*/
margin-right: 30px;
margin-left: 30px;
}

.menus {
width: 400px;
height: 70px;
line-height: 70px;
position: absolute;
}

.obj1 {
display: inline-block;
height: 150px;
width: 100px;
text-align: center;
border-radius: 10px;
position: relative;
margin-bottom: 10px;
background: rgba(110,185,237, 0.75);
}

Как наложить блоки друг на друга html+css?

PsyhoGhost: я не совсем понимаю, что Вы хотите сделать.