make this to have the proper design

page-speakers.php

@@ -8,6 +8,8 @@ get_header(); ?>
 <section class="content grid">
     <div class="col-left">
         <h1 class="big">Лектори</h1>
+
+<div class="grid members">
     <?php
         $speakers_args = array( 'post_type' => 'speakers', 'nopaging' => 'true', 'order' => 'ASC' );
         $speakers = new WP_Query( $speakers_args ); 
@@ -15,7 +17,37 @@ get_header(); ?>
         if ( $speakers->have_posts() ) :
             while ( $speakers->have_posts() ) : $speakers->the_post();
     ?>
-        <div class="speaker">
+<div class="member col4">
+
+<a href="#<?php the_title(); ?>">
+    <?php
+                if ( has_post_thumbnail() ) {
+                    the_post_thumbnail(array(100, 100));
+                } else {
+    ?>
+            <img src="/img/speaker.jpg">
+    <?php
+                }
+?>
+<br>
+		<?php the_title(); ?>
+</a>
+</div>
+    <?php
+            endwhile;
+            wp_reset_postdata();
+        endif;
+    ?>
+
+</div>
+    <?php
+        $speakers_args = array( 'post_type' => 'speakers', 'nopaging' => 'true', 'order' => 'ASC' );
+        $speakers = new WP_Query( $speakers_args ); 
+
+        if ( $speakers->have_posts() ) :
+            while ( $speakers->have_posts() ) : $speakers->the_post();
+    ?>
+		<div class="speaker" id="<?php the_title() ?>">
     <?php
                 if ( has_post_thumbnail() ) {
                     the_post_thumbnail(array(100, 100));
@@ -36,7 +68,7 @@ get_header(); ?>
         endif;
     ?>
     </div>
-    <?php # get_sidebar(); ?>
+    <?php  get_sidebar(); ?>
 </section>
 
 <?php get_footer(); ?>