Using definition list to Generate WordPress Pages

To generate wordpress page, normally we use:

<?php wp_list_pages(); ?>

But that code also automatically generate <li>. What if you want to use definition list to generate wordpress page like this?

<dl class="nice vertical tabs">
  <dd><a href="#">Ekonomi</a></dd>
  <dd><a href="#">Politik</a></dd>
  <dd><a href="#">Korupsi</a></dd>
  <dd><a href="#">Sports</a></dd>
  <dd><a href="#">Nasional</a></dd>
  <dd><a href="#">Hiburan</a></dd>
  <dd><a href="#">Megapolitan</a></dd>
  <dd><a href="#">Internasional</a></dd>
  <dd><a href="#">Teknologi</a></dd>
  <dd><a href="#">Kesehatan</a></dd>
  <dd><a href="#">Wisata</a></dd>
  <dd><a href="#">Syiar</a></dd>
  <dd><a href="#">Renungan</a></dd>
  <dd><a href="#">Kopi Tumpah</a></dd>
  <dd><a href="#">Terbit Foto</a></dd>
</dl>

Easy, use get_pages and loop it. Like this:

<dl>
 <?php 
  $pgs = get_pages();
  foreach ($pgs as $pg) {
     $title = $pg->post_title;
     $link = get_page_link($pg->ID);
  ?>
  <dd><a href="<?php echo $link ?>"><?php echo $title ?></a></dd>
<?php } ?>
</dl>

I recently use foundation framework and the code proved to be quite useful with foundation’s vertical tab.

Further Reading:

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s