More

    Membuat Related Post di dalam Postingan tanpa Plugin

    Pada artikel sebelumnya kita telah mencoba membuat related post didalam postingan dengan menggunakan plugin inline related post. Karena ada beberapa pertanyaan pada grup wordpress indonesia bagaimana cara membuat inline related post tanpa plugin. Saya akan membuatkan tutorial cara membuat related post seperti berikut :

    related post seperti diatas banyak sekali digunakan pada situs-situs populer seperti jalan tikus , males banget dsb.

    Dibawah adalah inline related post yang ada di malesbanget.

    memasang related post
    Related post jalantikus.com

    Sedangkan dibawah ini adalah related post yang ada di jalantikus.

    memasang related post
    Related post jalantikus.com

    Gambar diatas adalah contoh dari related post di dalam postingan yang akan kita buat. Tutorial ini hanya digunakan untuk anda yang menggunakan CMS WordPress self host.

    Pada tutorial ini kita hanya perlu menambah function baru pada wordpress dan dengan sedikit custom css agar tampilan sesuai dengan gambar diatas.

    Membuat Related Post di dalam Postingan tanpa Plugin

    tambahkan kode berikut pada function.php pastikan kode tersebut berada di dalam <?php  ?> untuk beberapa themes yang mendukung untuk custom function seperti theme yang saya gunakan, akan lebih baik di letakkan pada file tersebut.

    <?php
    function ShortCodeIseng($atts){
       extract(shortcode_atts(array(
        'number' => 5,
        'tag' => 'default-tag',
        'bacajuga' => '<div class="bacajuga">',
        'titlebaca' => '<div class="titlebaca"><strong>Baca Juga:</strong></div>',
        'contentbaca' => '<div class="contentbaca">',
        'openul'	=> '<ul>',
        'id' => get_the_ID(),
           ), $atts));
       		$return_string .= ''.$bacajuga.''.$titlebaca.''.$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><strong><a target="_blank" href="'.get_permalink().'" title="'.get_the_title().'">'.get_the_title().'</a></strong></li>';
            } 
                } else {
            }
            wp_reset_postdata();
       $return_string .= '</ul>';
       $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( 'postingan', 'ShortCodeIseng' );
    ?>

    kode diatas berfungsi untuk menampilkan post berdasarkan tag, dengan function sederhana untuk membuat shorcode agar mudah penggunaan  nantinya. Untuk informasi lebih lanjut tentang shotcode pada wordpress, anda bisa membaca dokumentasinya berikut. Shortcode API

    lalu tambahkan css berikut ini pada Appearance -> edit css

    .bacajuga{
    position: relative;
    display: inline-block;
    }
    .bacajuga .titlebaca{
    background-color: white;
    position: absolute;
    margin-left: 30px;
    margin-top: -14px;
    padding: 0px 15px;
    }
    .bacajuga .contentbaca{
    border: solid 1px #dddddd;
    padding: 20px 20px 0px 20px;
    }

    Cara penggunaannya

    Cukup tambahkan shortcode berikut pada postingan anda.

    [highlight] [postingan number=3 tag=”wordpress” ][/highlight]

    number : adalah jumlah artikel yang akan di tampilkan. apabila tidak diisi maka secara default ia akan menampilkan 5 artikel.

    tag : artikel yang akan ditampilkan berdasarkan tag.

    jikan anda ingin menambahkan lebih dari satu tag, gunakan slug +

    [highlight][postingan number=3 tag=”Tutorial+wordpress” ][/highlight]

     

    Demikian adalah cara memasang related post di dalam postingan tanpa plugin.

    Selamat mencoba.

    Free $100
    Deal

    Daftar menggunakan link di pojok kanan atas, minimal top up $25 usd. Maka dalam waktu 30 hari setelah registrasi anda akan mendapatkan credit $100 gratis dari vultr untuk mencoba layanan mereka.

    More Less
    Doesn't expire

    Recent Articles

    apa itu mirkotik

    Apa itu Mikrotik dan Fungsinya

    0
    Apa itu mikrotik? - Untuk beberapa orang yang biasa berkecimpung di dunia jaringan, mungkin sudah tidak asing lagi dengan yang namanya Mikrotik. Alat tersebut biasa ada...
    aplikasi belajar online

    Moodle, Aplikasi Belajar Online Gratis

    0
    Aplikasi Belajar Online - Saat ini membuat aplikasi pembelajaran online sangatlah mudah. Banyak sekali platform yang bisa anda gunakan untuk pembelajaran online, salah satunya...
    cara install mikrotik CHR

    Cara Install Mikrotik CHR (Cloud Host Router) pada Centos 8

    0
    Cara Install Mikrotik CHR - Mikrotik seringkali diperlukan ketika mengelola sebuah network secara fisik atau virtual. Saat ini, Mikrotik tersedia dalam versi cloud yang bernama Mikrotik CHR. Sistem operasi...
    upgrade windows 11

    Cara Upgrade Windows 11 Gratis!

    0
    Pada tanggal 5 Oktober 2021, microsoft telah resmi meluncurkan generasi windowsnya yaitu windows 11. Dengan serangkaian fitur baru, Windows 11 diklaim akan menyajikan pengalaman menggunakan...
    tips memilih isp

    Tips Memilih ISP Untuk Kebutuhan Internet Anda

    0
    Dalam memilih ISP kita perlu mempertimbangkan beberapa hal, diantaranya ialah budget. Namun, selain itu tentunya kita perlu memilih isp yang cocok dengan kita. Memilih ISP...

    Related Articles

    39 Comments

    1. ini yang saya cari-cari..
      related post tanpa plugin. jadi lebih ringan..
      apalagi desain related ini cukup simple. biar loading blog ga berat-berat amat 😀

    2. mas, kala related post seperti dibawah artikel di blog ini pakai plugin atau manual mas?
      saya pingin pasang…

      oiya saya pasang related post yg inline kok ga muncul ya mas? saya pake theme landingpress…

      • untuk related post inline nya saya menggunakan tutorial di artikel ini mas, tapi belum bisa..

        untuk related post yg ada di blog ini jika menggunakan plugin, plugin apa ya mas? di blog saya related postnya bawaan theme tp kurang menarik, inginnya seperti yg ada di blognya mas Fikri ini, contohnya bisa dilihat disini mas: xxxpemutih,com/tentang-cream-hn-original/

    3. Mas bisa digunakan gak di theme generate press ? ini akan otomatis mengenerate related sususi tag apa kategori ya ? mohon jawabanya . terima kasih

    4. Itukan di urutkan berdasarkan tanggal postingannya kan om, trus kalau mau dirubah jadi random gimana ya? Soalnya postingan lama nanti gak ikut ketempel kalau pake kode diatas.

    5. jikan anda ingin menambahkan lebih dari satu tag, gunakan slug +

      kalo ini contohnya gimana mas?

      kalo yg ditampilin maunya random gimana mas ?
      apa bener kayak di komentar? order by nya di ganti ‘random ?

      makasih mas

    Leave A Reply

    Please enter your comment!
    Please enter your name here

    This site uses Akismet to reduce spam. Learn how your comment data is processed.

    Dapatkan konten terbaik dari kami!