Cara Menambahkan Author Microformat di WordPress

WordPress adalah CMS yang cukup mempunyai nama di belantika dunia internet saat ini, dengan WordPress kita bisa menghasilkan “sesuatu” mulai dari Portfolio, Company Profile, Business Profile, Online Store sampai tujuan awal WordPress diciptakan sebagai Mesin Blogs.

Kali ini kami akan berbagi cara untuk menambahkan Data Microformat di WordPress blog kita. Kata menambahkan ini sebenarnya sedikit kurang tepat, karena apa yang kami coba bagikan ini adalah bagaimana mengatur data2 di WordPress kita akan bisa sesuati standard Microformat yang didukung Mesin Pencari seperti Bing, Google dan Yahoo.

Pada Tutorial Pertama ini kami akan memberikan panduan untuk menambahkan Author Microformat, pada sesi lanjutan kami akan kupas juga mengenai Breadcrumb Microformat, Reviews Microformat, TV Series dan sejenisnya…

Tentunya pada Tutorial Menambahkan Data Author Microformat WordPress ini dibutuhkan sedikit kemampuan memahami struktur WordPress, PHP, HTML dan juga CSS. Tapi kalaupun anda masih awam masih bisa mengikuti apa yang kami bagikan ini (semoga).

Alat-alat yang dibutukan ada beberapa diantaranya

• Dekstop Browser
  Anda bisa menggunakan Safari, Chrome atau Firefox, pilih yang menurut bero dan sista paling nyaman.
• Text Editor
  Untuk Editor ini jika anda di lingkungan Jendela anda bisa mencoba Notepad++, jika anda di OS X anda bisa mencoba Coda atau TextMate sedangkan di Linux bisa mencoba VIM dan sejenisnya
• Online Server
  Untuk mengehatui apakah yang kita lakukan sudah tepat atau belum, pastikan sudah mempunyai Server yang terhubung di  Internet dengan WordPress sudah ter install.
• FTP Client
  Sediakan FTP Client yang mengubungkan komputer lokal kita dengan Server Online kita. Banyak sekali layanan FTP Client di lingkungan Jendela, OS X dan juga Linux, pilih yang sesuai kebutuhan.

Langkah-langkah menambah Author Microformat di WordPress

1. Buka functions.php dan tambahkan baris kode berikut (akan kami jelaskan kemudian)
   [sourcecode language=”php”]function my_new_contactmethods( $contactmethods ) {
   // Add Twitter
   $contactmethods[‘twitter’] = ‘Twitter’;
   //add Facebook
   $contactmethods[‘facebook’] = ‘Facebook’;// Add Google Profiles
   $contactmethods[‘google_profile’] = ‘Google Profile URL’;return $contactmethods;
   }add_filter(‘user_contactmethods’,’my_new_contactmethods’,10,1);
   [/sourcecode]
   Kode diatas bertujuan untuk menambahkan Informasi tambahan pada Profil WordPress kita, pada sample diatas kita menambahkan Twitter, Facebook dan juga Google Plus.
2. Kemudian setelah kode tadi disimpan, silahkan masuk halaman Profil di WP Admin dan lengkapi data2 yang dibutuhkan (Twitter, Facebook dan Google Plus)
   Yang paling utama dari profil diatas adalah Google Plus, jika belum mempunyai silahkan daftar terlebih dahulu.
3. Sekarang buka file single.php atau content-single.php untuk Twenty Eleven dan Turunannya biasanya menggunakan content-single.php, buka salah satu dan tambahkan kode berikut ini dibawah the_content()berikut ini
   [sourcecode language=”php”]
   <div id="author_box" class="about_box vcard">
   <h3 class="block_title fn"><?php __(‘About the Author’,’mediaflux’); ?> <?php the_author_meta(‘first_name’);?> <?php the_author_meta(‘last_name’);?></h3>
   div>
   <?php $gravatar = md5(get_the_author_meta(‘user_email’)); $default = get_bloginfo(‘template_url’).’/images/avatar.png’; ?>
   <!–<img src="/images/<?php the_author_meta(‘ID’);?>.png" alt="Author Image" id="authorpic"/>–>
   <img class="author_avatar left" src="http://www.gravatar.com/avatar/<?php echo $gravatar; ?>?d=<?php echo $default; ?>&amp;s=60" style="margin-top:5px;" />
   <!–<strong><?php the_author_meta(‘first_name’);?> <?php the_author_meta(‘last_name’);?></strong><div class="clear"></div>–>
   <p><?php the_author_meta(‘user_description’);?></p><div class="clear"></div>
   <a class="url" rel="author" href="<?php the_author_meta(‘user_url’); ?>" title="author website">Home Page</a>
   </div>
   </div>
   [/sourcecode]

   Pada kode diatas yang penting dan utama adalah bagian class yang digunakan Author Microformat seperti vcard, fn, dan url. Bagian class url tadi tambahan rel=”author” adalah bertujuan untuk memberi tahu kalau author dari tulisan2 tersebut.

4. Lanjutkan edit file author.php
   Silahkan edit file author.php kalau belum ada tambahkan, dengan cara duplikat file archive.php kemudian paling atas kode sebelum Looping tambahkan kode berikut ini.
   [sourcecode language=”php”]
   <?php
   // If a user has filled out their description, show a bio on their entries.
   if ( get_the_author_meta( ‘description’ ) ) : ?>
   <div id="author-info">
   <div id="author-avatar">
   <?php echo get_avatar( get_the_author_meta( ‘user_email’ ), apply_filters( ‘twentyeleven_author_bio_avatar_size’, 60 ) ); ?>
   </div><!– #author-avatar –>
   <div id="author-description">
   <h2><?php printf( __( ‘About %s’, ‘twentyeleven’ ), get_the_author() ); ?></h2>
   <?php the_author_meta( ‘description’ ); ?>
   <div id="author-link">
   <?php if(get_the_author_meta(‘facebook’)): ?><a href="http://www.facebook.com/<?php the_author_meta(‘facebook’); ?>" title="Facebook Profile" class="a-fb">Facebook</a> | <?php endif; if(get_the_author_meta(‘twitter’)): ?><a href="http://twitter.com/#!/<?php the_author_meta(‘twitter’); ?>" title="Twitter Profile" class="a-twitter">Twitter</a> | <?php endif; $google_profile = get_the_author_meta( ‘google_profile’ );
   if ( $google_profile ) {
   echo ‘<a href="https://plus.google.com/’ . $google_profile . ‘" rel="me">Google Profile</a>’; } ?></div><!– #author-link –>
   </div><!– #author-description –>
   </div><!– #entry-author-info –>
   <?php endif; ?>
   [/sourcecode]

   Pada bagian ini yang penting adalah bagian tautan Google Plus dimana ditambahkan rel=”me” untuk menunjukkan bahwa yang disini benar adanya orang yang sama dengan akun Google Plus tersebut.

5. Jangan lupa simpan semua konfigurasi diatas dan upload ke Online Server. Selamat anda sudah sukses menambahkan Microdata Author Format

Untuk melakukan test atau ujicoba apakah sudah berjalan dengan baik, silahkan buka halaman artikel dengan Rich Snippets Testing Tools milik Google. Jika sudah tampil seperti ini, berarti sudah benar.

Jika masih ada kesulitan ataupun hal2 yang belum berjalan dengan semestinya mari kita diskusinya disini.
Ngonoo lho…..

Kredit Gambar: http://webification.com dan http://wordpress.org