Memecah Sidebar

Oke, kita lanjutkan kegiatan memecah belah kita hehehe.. Jika sebelumnya kita telah memisahkan header dan footer, tapi bagian konten dan sidebar kan masih menyatu tuh di index.php. Nah, sudah saatnya kita ceraikan mereka hahahaha….

Baik, langsung aja buka index.php lalu cari kode yang membangun sidebar. Kalau anda mengikuti pelajaran themes ini dari awal, harusnya kode sidebarnya seperti ini:

     <div id="sidebar">
    <?php if ( is_active_sidebar( 'sidebar-lebar' ) ) : ?>  
        <div id="lebar">
      <ul>          
            <?php dynamic_sidebar( 'sidebar-lebar' ); ?>    
      </ul>
        </div>
    <?php endif; ?>    
        <div id="kiri">
      <ul>
            <?php if ( ! dynamic_sidebar( 'sidebar-kiri' ) ) : ?>
      <li id="search" class="widget-container widget_search">
        <?php get_search_form(); ?>
      </li>

      <li id="archives" class="widget-container">
        <h3 class="widget-title">Arsip</h3>
        <ul>
          <?php wp_get_archives( 'type=monthly' ); ?>
        </ul>
      </li>
      <?php endif; ?>
      </ul>
        </div>
        <div id="kanan">
      <ul>
            <?php if ( ! dynamic_sidebar( 'sidebar-kanan' ) ) : ?>
      <li id="meta" class="widget-container">
        <h3 class="widget-title">Meta</h3>
        <ul>
          <?php wp_register(); ?>
          <li><?php wp_loginout(); ?></li>
          <?php wp_meta(); ?>
        </ul>
      </li>
      <?php endif; ?>
      </ul>
        </div>
      </div>

Sebagaimana pelajaran yang lalu cut code ini lalu paste ke file baru dengan nama sidebar.php. Nah, sebagai ganti kode yang sudah hilang ini, kita pasang kode untuk memanggil sidebar yaitu:

<?php get_sidebar(); ?>

Dan inilah hasil akhir index.php yang sudah sendirian hehehe….

<?php get_header(); ?>
     <div id="maincontent">
    <div id="content">
    
    <script type="text/javascript">
    jQuery(function() {
      jQuery(".mygallery").jCarouselLite({
        btnNext: ".nextb",
        btnPrev: ".prevb",
        visible: 1,
        speed: 2000,
        auto: 3000,
        easing: "backout"
      });
    });
    </script>

    <div id="slidearea">

      <div id="gallerycover">
        <div class="mygallery">

        <ul>
        <?php 
          $my_query = new WP_Query('showposts=5');
          while ($my_query->have_posts()) : $my_query->the_post();
          $do_not_duplicate = $post->ID;
        ?>
        <li>
          <div class="mytext">
            <a href="<?php the_permalink() ?>">
             <?php 
              if ( has_post_thumbnail() ) {
                the_post_thumbnail();
              } else {
                echo '<img src="'.get_bloginfo('template_url').'/images/thumbnail.png" alt="'.get_the_title().'" class="wp-post-image"/>';
              }
             ?>
            </a>
            <h2><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>"><?php the_title(); ?></a></h2>
            <p><?php the_content_rss('more_link_text', TRUE, '', 30); ?> 
            <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>">read more..</a></p>
            
            <div class="slimeta">
            <a href="#" class="prevb">&laquo; Previous</a><a href="#" class="nextb">Next &raquo;</a>
            </div>
          </div>     
        </li>
          <?php endwhile; ?>
        </ul>

        <div class="clear"></div>  
          
        </div>
      </div>

    </div>
       <?php if ( have_posts() ) : ?>
      <?php while ( have_posts() ) : the_post(); ?>
      <div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
        <?php
        if (!is_single()) {
          if ( has_post_thumbnail() ) {
            the_post_thumbnail();
          } else {
            echo '<img src="'.get_bloginfo('template_url').'/images/thumbnail.png" alt="'.get_the_title().'" class="wp-post-image"/>';
          }
        }
        ?>
        <h2 class="title"><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>"><?php the_title(); ?></a></h2>
        <p><?php if (is_single()) { the_content(); } else { the_excerpt(); } ?></p>
        <div id="postmeta">Publish on <?php the_time('F jS, Y'); ?> under <?php the_category(', '); ?> by <?php the_author(); ?> | 
        <?php comments_popup_link('No Comments &raquo;', '1 Comment &raquo;', '% Comments &raquo;'); ?> 
        <?php edit_post_link('Edit','| ',''); ?></div>
      </div>
      <?php comments_template(); ?>
      <?php endwhile;?>
       <?php endif;?>
    </div>
    <?php get_sidebar(); ?>
     </div>
<?php get_footer(); ?>

Mudah-mudahan cukup dimengerti. Intinya cuma memindah kode-kode di index.php ke file yang baru aja sehingga ke depan akan lebih mudah pengelolaannya.

Berikutnya adalah mentransformasi file index.php ini menjadi single.php, page.php dan archive.php serta category.php. Ya, kita akan banyak bekerja dengan file-file standart WordPress nantinya. Keep watching!!

Dicari dengan kata kunci:

coding div kiri kanan php,memecah index php,cara memindahkan sidebar pada wordpress,cara memindahkan sidebar dari kiri ke kanan dengan php,memindah side bar wordpress,cara memindahkan kategori ke kiri pada wordpress,cara memindahkan sidebar dari kiri ke kanan diwordpress,memisahkan content dengan sidebar,memcah file index pada php kuliah net,memisahkan index php