add adaptive functions

blocks/citata.php

@@ -1,6 +1,10 @@
 <?php
 
-$posts = get_posts( array(
+$key = 'vij_citata';
+
+if (!$posts = kuri_set($key)) {
+
+	$posts = get_posts( array(
 		'numberposts' => 1,
 		'category'    => 7, // 7 - мнения
 		'orderby'     => 'date',
@@ -11,23 +15,23 @@ $posts = get_posts( array(
 		'meta_value'  =>'',
 		'post_type'   => 'post',
 		'suppress_filters' => true, // подавление работы фильтров изменения SQL запроса
-) );
+	));
+
+	kuri_set($key, $posts);
+
+}
 
 # вывод поста
 if( $posts ):
 
-    foreach($posts as $post):
+    foreach($posts as $post):?>
-       setup_postdata( $post );
-    ?>
 
-	<div class="left_citata">	
+	<div class="left_citata<?if (isset($subclass)) echo $subclass;?>">	
 		<div class="left_citata_title">цитата</div>
    		<img class="left_preview" src="<?php echo get_the_post_thumbnail_url($post, 'left-thumb');?>" alt="<?the_title();?>">
-   		<div class="left_citata_text"><a href="<?php the_permalink(); ?>">«<?php the_title();?>»</a></div>
+   		<div class="left_citata_text"><a href="<?=get_permalink($post);?>">«<?=$post->post_title;?>»</a></div>
 	</div>	   
 
     <?php endforeach;
 
-    wp_reset_postdata();
-
 endif;

blocks/mosts.php

@@ -1,6 +1,10 @@
 <?php
 
-$posts = get_posts( array(
+$key = 'vij_mosts';
+
+if (!$mosts = kuri_set($key)) {
+
+	$mosts = get_posts( array(
 		'numberposts' => 3,
 		'category'    => 22, // пока без категории
 		'orderby'     => 'date',
@@ -11,23 +15,21 @@ $posts = get_posts( array(
 		'meta_value'  =>'',
 		'post_type'   => 'post',
 		'suppress_filters' => true, // подавление работы фильтров изменения SQL запроса
-) );
+	)); 
+
+	kuri_set($key, $mosts);
+}	
 
 # вывод поста
-if( $posts ):?>
+if( $mosts ):?>
 
-    <div id="mosts">
+    <div class="mosts<?if (isset($subclass)) echo $subclass;?>">
         <h3 class="most_title">Самое читаемое</h3>
-        <?php foreach($posts as $post):
-        setup_postdata( $post );
-        ?>
-    
-        <div class="most"><a href="<?php the_permalink(); ?>"><?php the_title();?></a></div>   
         
+		<?php foreach($mosts as $most):?>
+    		<div class="most"><a href="<?=get_permalink($most); ?>"><?=$most->post_title;?></a></div>  
 		<?php endforeach;?>
 
     </div>
 
-   <?php wp_reset_postdata();
+<?endif?>    
-
-endif?>    

blocks/opinion.php

@@ -1,6 +1,9 @@
 <?php
 
-$posts = get_posts( array(
+$key = 'vij_opinions';
+
+if (!$opinions = kuri_set($key)) {
+	$opinions = get_posts( array(
 		'numberposts' => 1,
 		'category'    => 7, // 7 - мнения
 		'orderby'     => 'date',
@@ -11,23 +14,25 @@ $posts = get_posts( array(
 		'meta_value'  =>'',
 		'post_type'   => 'post',
 		'suppress_filters' => true, // подавление работы фильтров изменения SQL запроса
-) );
+	));
+
+	kuri_set($key,$opinions);
+}	
 
 # вывод поста
-if( $posts ):
+if($opinions ):
 
-    foreach($posts as $post):
+    foreach($opinions as $post):
-       setup_postdata( $post );
+       setup_postdata( $opinions );
     ?>
 
-	<div class="left_opinion">	
+	<div class="left_opinion<?if (isset($subclass)) echo $subclass;?>">	
 		<div class="left_opinion_title">мнение</div>
-   		<img class="left_preview" src="<?php echo get_the_post_thumbnail_url($post, 'left-thumb');?>" alt="<?the_title();?>">
+   		<img class="left_preview" src="<?php echo get_the_post_thumbnail_url($post, 'left-thumb');?>" alt="<?=$post->post_title;?>">
-   		<div class="left_opinion_text"><a href="<?php the_permalink(); ?>"><?php the_title();?></a></div>
+   		<div class="left_opinion_text"><a href="<?=get_permalink($post);?>"><?=$post->post_title;?></a></div>
 	</div>	   
 
     <?php endforeach;
 
-    wp_reset_postdata();
 
 endif;

footer.php

@@ -47,6 +47,7 @@
         <div id="form_subscript">
             <script src="//web.webformscr.com/apps/fc3/build/loader.js" async sp-form-id="caf123c41c347524b52869629e2a958536e65900b89bb2f72592f6e4796d554e"></script>
         </div>
+       
         <?php include get_template_directory().'/blocks/mosts.php';?>
 </div>
   </div><!-- end main -->

functions.php

@@ -15,3 +15,40 @@ add_theme_support('post-thumbnails');
 # регистрируем размеры миниатюр 
 add_image_size( 'left-thumb', 95, 84, true ); # для левой колонки
 add_image_size( 'moread', 372, 216, true ); # читайте также
+
+
+#add scripts
+/** 
+function tutsplus_burger_menu_scripts() {
+     
+    wp_enqueue_script( 'burger-menu-script', get_stylesheet_directory_uri() . '/scripts/burger-menu.js', array( 'jquery' ) );
+  
+}
+add_action( 'wp_enqueue_scripts', 'tutsplus_burger_menu_scripts' );
+*/
+
+/** add mobile block */
+function mob_block($template){
+
+    $subclass = " mob-lite";
+    include get_template_directory().$template;
+
+}
+
+
+function kuri_set($name = null, $value = null) {
+	
+	static $vars = array();
+			   
+	if ($name == null)
+       	return $vars;	
+	
+	if ($value == null){
+       	if(array_key_exists($name, $vars)) 
+       		return $vars[$name];
+       	}
+    else
+       	$vars[$name] = $value; 
+		return false;
+       	
+}

header.php

@@ -4,8 +4,10 @@
         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
         <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
         <title><?php wp_title('|', true, 'right');?></title>
-        <link rel="stylesheet" href="<?php echo get_stylesheet_uri(); ?>">
+        <link rel="stylesheet" href="<?php echo get_stylesheet_uri();?>?ver=8">
         <link href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" rel="stylesheet">
+        <script type='text/javascript' src="<?php echo get_stylesheet_directory_uri()?>/scripts/jquery-3.6.0.min.js"></script>
+        <script type='text/javascript' src="<?php echo get_stylesheet_directory_uri()?>/scripts/burger-menu.js?ver=8"></script>
         <?php wp_head();?>
     </head>
     <body>
@@ -35,11 +37,22 @@
             <ul id="header_icons">
                 <li class="btn_search"></li>
                 <li class="btn_rss"></li>
+                <li class="toggle-nav"></li>
             </ul>   
 
+            <nav class="menu main">
+                <?php wp_nav_menu( array( 
+                    'container_class' => 'main_main', 
+                    'theme_location' => 'top',
+                    'menu_id' => 'gamburer_menu'
+                ) ); ?>
+            </nav>
+           
 
         </header>
 
+        <?php $subclass = ''; ?>
+        
         <div id="main">
 
  

index.php

@@ -35,7 +35,9 @@ $nn = 0;?>
     <div class="main-card">
         
         <?if ( has_post_thumbnail() ) :?> 
-            <a href="<?the_permalink();?>"><img class="card-img-top" src="<?php echo get_the_post_thumbnail_url(null, 'full'); ?>" alt="<?the_title();?>"></a>
+            <div class="card-img-top">   
+                <a href="<?the_permalink();?>"><img src="<?php echo get_the_post_thumbnail_url(null, 'full'); ?>" alt="<?the_title();?>"></a>
+            </div>
         <?endif?>
 
         <h2 class="main-card-title"><a href="<?the_permalink();?>"><?the_title();?></a></h2>
@@ -68,8 +70,16 @@ $nn = 0;?>
     </div> <!--//end minicard block -->
 
 
+
 <?php endif;?>
 
+<?php wp_reset_postdata();?>
+
+<?php mob_block('/blocks/opinion.php');?>
+<?php mob_block('/blocks/citata.php');?>    
+<?php mob_block('/blocks/mosts.php');?>
+ 
+
 
 </div>  <!-- end content -->
 

scripts/burger-menu.js

@@ -0,0 +1,7 @@
+jQuery(document).ready(function() {
+    jQuery('.toggle-nav').click(function(e) {
+        jQuery('.menu.main ul').slideToggle(500);
+        e.preventDefault();
+    });
+     
+});

single.php

@@ -40,7 +40,9 @@
 
         <div class="publ_expert"><?php the_excerpt();?></div>
         <?if ( has_post_thumbnail() ) :?> 
+            <div id="post-img">
                 <img class="img-fluid rounded" src="<?php echo get_the_post_thumbnail_url(null, 'full');?>" alt="<?the_title();?>">
+            </div>
             <div class="post_img_title"><?the_post_thumbnail_caption()?></div>
         <?endif?>    
         <?the_content();?>

style.css

@@ -341,6 +341,7 @@ a{
       width: 20px;
       height: 15px;
       margin-left: 18px;
+      cursor: pointer;
     }
   
     .btn_search{
@@ -369,6 +370,11 @@ a{
       max-width: 700px;
     }
 
+    #post-img{
+      /**text-align: center;*/
+      background: #F5F5F5;
+    }
+
     .page-numbers {
       display: inline-block;
       padding: 5px 10px;
@@ -385,7 +391,6 @@ a{
       a.page-numbers:hover {
       
           background: #f9f9f9;
-      
        }
       
 
@@ -399,12 +404,8 @@ a{
 
   .mini-card-block{
     display: grid;
-    grid-template-columns: repeat(auto-fit, minmax(372px, 372px));
     grid-gap: 2rem; 
-  }
+    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
-
-  .mini-card{
-    max-width: 372px;
   }
 
 
@@ -414,8 +415,15 @@ a{
   }
 
   .mini-card-img{
-    width: 372px;
+   /** width: 372px;
-    height: 216px;
+    height: 216px; */
+    width: 100%;
+  }
+
+
+  .card-img-top{
+    text-align: center;
+    width: 100%;
   }
 
 
@@ -441,6 +449,7 @@ a{
     padding-bottom: 22px;
     margin: 8px 0 32px 0;
     border-bottom: 1px solid #E9EAEB;
+    width: 100%;
    /*text-align: center; */
 }
 
@@ -480,12 +489,15 @@ a{
 }
 
 
-#mosts{
+.mosts{
   background-color: #00466A;
   width: 100%;
   padding: 22px;
 }
 
+
+
+
   .most_title{
     color: #2D9CDB;
   }
@@ -501,6 +513,7 @@ a{
       color: #FFFFFF;
     }
 
+
 .left_preview{
   border-radius: 50%;
   width: 95px;
@@ -602,14 +615,14 @@ a{
 
 .moread{
   display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(372px, 380px));
+  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
-  grid-gap: 1rem;
+  grid-gap: 2rem; 
   margin-top: 8px;
   margin-bottom: 28px;
 }
 
   .moread_card{
-    padding-right: 12px;
+    
   }
 
   .moread_rubric{
@@ -625,8 +638,8 @@ a{
   }
 
   .moread_card IMG{
-    width: 372px;
+    width: 100%;
-    height: 216px;
+    /*height: 216px;*/
     float: top;
   }
 
@@ -666,9 +679,10 @@ a{
 .yets{
   display: grid;
   grid-gap: 1rem; 
-  grid-template-columns: repeat(auto-fit, 320px);
+  grid-template-columns: repeat(auto-fi, minmax(300px, 1fr));
   margin-top: 8px;
   margin-bottom: 28px;
+  width: 100%;
 }
 
   .yet_card{
@@ -772,7 +786,86 @@ img-fluid{
   text-align: center;
 }  
 
-@media (max-width: 640px) {
+.toggle-nav {
+    display: none !important;
+}
+
+
+
+#gamburer_menu{
+  display: none;
+}
+
+
+.mob-lite{
+  display: none;
+}
+
+
+@media screen and ( max-width: 580px ) {
+  
+  .toggle-nav {
+      display: inline-block !important;
+      background: url(/wp-content/themes/vij/pub/icons/burger-15.png) no-repeat; 
+  }
+
+  .btn_rss{
+    display: none;
+  }
+
+  .menu.main {
+    display: inline-block;
+    position: relative;
+    background: #fff;
+    text-align: left;
+  }
+     
+  .menu.main ul {
+    display: none;
+    position: absolute;
+    overflow: auto;
+    top: 0px;
+    right: 0px;
+    z-index: 999;
+    padding-right: 15px;
+    background: #fff;
+  }
+     
+  .menu.main ul li {
+    float: none;
+    display: block;
+    position: relative;
+    top: 0px;
+    right: 0px;
+    min-width: 100px;
+    background: #fff;
+    text-align: right;
+  }  
+   
+
+  #gamburer_menu a{
+    font-weight: bold;
+  }  
+
+   
+  
+  .mob-lite{
+    display: inline-block !important;
+    margin-top: 12px;
+  }  
+
+     
+  .main.menu li:after { 
+    content: none; 
+  }
+
+
+}
+
+
+
+/** ultrabooks and ipads **/
+@media (max-width: 768px) {
   
   #left{
     display: none;
@@ -796,11 +889,12 @@ img-fluid{
 
   #content{
     margin: 8px;
-    width: 540px;
+    width: 100%;
   }
 
-  .img-fluid{
+  #mini-card-block{
-    max-width: 80%;
+    display: grid;
+    width: 100%;
   }
 
 
@@ -812,6 +906,28 @@ img-fluid{
 }  
 
 
+/** mobile **/
+@media only screen 
+and (min-device-width : 375px) 
+and (max-device-width : 667px) { 
+
+  #content{
+    margin: 8px;
+    width: 100%;
+  }
+
+  .mini-card{
+    width: 100%;
+    padding-right: 12px;
+  }
+
+  .mini-card-img{
+    width: 100%;
+  }
+
+}
+
+