Beranda Blog & Website Cara Membuat Baca Juga (Related Post) di WordPress

Cara Membuat Baca Juga (Related Post) di WordPress

3651
7
BERBAGI
asdar.id menyediakan Member Premium Download untuk download file tanpa embel-embel iklan dan halaman, apa lagi harus menunggu timer yang begitu lama. Dengan berlangganan Member Premium Download, semua file dapat didownload dengan singkat langsung menuju ke sumbernya!, klik DISINI untuk DAFTAR :-) Untuk cara download file Member Free Download, bisa membaca Tutorial Download yang ada dibawah Timer (halaman Safelink) saat menekan tombol download.
Rekomendasi aplikasi hitung cepat RAB akurat dan otomatis, sangat mudah digunakan. Tinggal ganti dimensi, RAB Langsung Jadi. Jika anda seorang ahli sipil atau arsitek, rugi jika tidak punya filenya. Silahkan klik DISINI untuk mendapatkan Filenya.
cara membuat related post di wordpress
cara membuat related post di wordpress

Halo semua, bertemu lagi dengan postingan kali ini. Topik kali ini yang akan saya posting tentunya menarik. Yup, judul artikel kali ini darsitek akan membahas tentang Cara Membuat Baca Juga (Related Post) di WordPress. Mungkin anda yang sering berseluncur didunia maya pasti sering menemukan related post pada postingan blog-blog maupun website-website. Nah, di blog darsitek tentu kalian melihat related tersebut bukan? Berikut contoh tampilannya:

contoh related post pada blog darsitek

Dengan tampilan yang menarik tentu akan menambah trafik kunjungan website karena dengan adanya related post artikel blog kita yang masih terkait dengan artikel yang dibaca pengunjung tentu pasti akan dibaca, apalagi artikelnya itu menarik. Nah, bagi anda yang punya website atau blog tentu ingin juga membuat blognya menjadi ramai dan banyak trafik, selain itu bisa membuat tampilan blog/website menjadi rapi.

Cara Membuat Baca Juga (Related Post) di WordPress

Berikut darsitek akan membagikan cara membuat baca juga (related post) di wordpress.

  1. Pastikan bahasa WordPress kalian sudah diatur ke dalam bahasa Indonesia agar lebih mudah memahaminya.
  2. Login ke Panel Admin WordPress kalian masing-masing.
  3. Pergi ke menu Tampilan > Editor > Cari dan klik file functions.php (tajuk tema).
  4. Tambahkan kode berikut pada functions.php, tempatkan didalam <?php kode-disini ?> atau dibawah <?php. Kode dibawah berfungsi untuk menampilkan post berdasarkan tag, dengan function sederhana untuk membuat shorcode agar mudah penggunaan nantinya.
    //*custom function untuk menambah Baca Juga
    function BacaJuga($atts){
    extract(shortcode_atts(array(
    'number' => 5,
    'tag' => 'default-tag',
    'baca' => '<div class="baca">',
    'titlebaca' => '<div class="titlebaca"><strong>Baca Juga:</strong></div>',
    'contentbaca' => '<div class="contentbaca">',
    'openul' => '<ul>',
    'id' => get_the_ID(),
    ), $atts));
    $return_string .= ''.$baca.''.$titlebaca.''.$contentbaca.''.$openul.'';
    $the_query = new WP_Query(array('tag' => $tag, 'orderby' => 'date', 'order' => 'DESC' , 'showposts' => $number , 'post__not_in' => array( $id ), 'tag__not_in' => array(00001, 00002, 00003) ));
    if ( $the_query->have_posts() ) { while ( $the_query->have_posts() ) { $the_query->the_post();
    $return_string .= '<li><a target="_blank" href="'.get_permalink().'" title="'.get_the_title().'">'.get_the_title().'</a></li>';
    }
    } else {
    }
    wp_reset_postdata();
    $return_string .= '</ul>';
    $return_string .= '</div>';
    $return_string .= '</div>';
    $return_string .= '<div class="partner-banner-aftc-baca-juga" style="text-align: center; margin-top: 30px;"></div>';
    return $return_string;
    }
    add_shortcode( 'darsitek', 'BacaJuga' );
  5. Klik Update File/Perbarui Berkas.
  6. Tambahkan CSS untuk mempercantik tampilannya, pergi ke menu Tampilan > Sesuaikan/Customize > Pilih CSS Tambahan, masukkan kode CSS dibawah ini.
    /*style untuk baca juga*/
    .baca{
    position: relative;
    display: inline-block;
    }
    .baca .titlebaca{
    background-color: white;
    position: absolute;
    margin-left: 15px;
    margin-top: -14px;
    padding: 0px 15px;
    }
    .baca .contentbaca{
    border: solid 1px #dddddd;
    padding: 20px 20px 0px 20px;
    }
  7. Silahkan kustomisasikan warna sesuai keinginan masing-masing.
  8. Klik Save/Simpan.

Cara Penggunaan Related Post/Baca Juga

Untuk menggunakan Related Post atau Baca Juga ini pun sangat mudah, anda cukup menambahkan shortcode berikut pada postingan anda. Penempatannya pun terserah anda, mau diawal, ditengah, diakhir juga bisa. Shortcodenya adalah sebagai berikut.

[darsitek number=3 tag=”wordpress”]
  • number: jumlah artikel yang akan di tampilkan. apabila tidak diisi maka secara default akan menampilkan 5 artikel.
  • tag: artikel yang akan ditampilkan berdasarkan tag.

Jika ingin menambahkan lebih dari satu tag, anda bisa gunakan tanda koma (,) atau tanda plus (+) pada slug. Contoh: [darsitek number=3 tag=”blogger,wordpress”] atau [darsitek number=3 tag=”blogger+wordpress”].

Oke, mungkin itu saja tutorial mengenai Cara Membuat Baca Juga (Related Post) di WordPress, semoga bisa bermanfaat untuk anda yang membutuhkannya. Jangan lupa komentar jika ada yang ingin ditanyakan. Share artikel ini jika kalian suka dan jika ingin mengikuti perbaruan konten situs ini, silahkan berlangganan melalui notifikasi ketika pertama kali mengunjungi situs ini. Sekian dan terimakasih!

7 KOMENTAR

TINGGALKAN KOMENTAR

Silakan masukkan komentar anda!
Silakan masukkan nama anda disini