Apa itu artikel terkait / Related Post ?
Artikel terkait atau sering disebut related post merupakan suatu kumpulan artikel yang berbentuk gambar,judul atau hanya deskripsinya saja yang bila di klik akan menuju ke artikel tujuan.Related post biasanya muncul dihalaman artikel yang berhubungan langsung dengan label artikel tersebut dan kebanyakan para blogger memunculkan artikel hanya 6 judul.
Fungsi dan tujuan dipasang artikel terkait di blog
Banyak keuntungan yang bisa kita dapat jika kita memasang related post di blog :1. Mengurangi bounce rate.
2. Terlihat lebih propesional.
3. Membantu artikel lain agar dikunjungi.
4. Dan masih banyak lagi.
APakah related post mempengaruhi kecepatan blog ?
Related post akan mempengaruhi kecepatan suatu blog jika anda terlalu berlebihan ,gambar yang berlebih, dan ada saran yang bagus ketika anda memasang related post yaitu hanya memasang cuplikan judul blog jangan memakai gambar, dan itu akan membuat blog anda fast loading, apalagi dipasang di template AMP.Membuat artikel terkait / Related Post di blog AMP
Berikut cara memasang artikel terkait di blog.Pertama kita pasang script css, di css custom berikut script nya:
.share-this-pleaseeeee { display: inline-block; margin: 0; color: #afafaf; text-transform: uppercase; font-size: 14px; background: #fff; z-index: 1; position: relative; padding: 0 10px; font-weight: 500; } .label-line-c { position:relative; } .label-line-c { text-align: center; margin-top: 20px; margin-bottom: 6px; } .label-line-c:before { z-index: 1; content: ""; width: 100%; height: 1px; background: #dddddd; position: absolute; top: 50%; left: 0; margin-top: -1px; }
Lalu kita sisipkan kode dibawah ini dibawah kode <data:post.body/>.
<div class='label-line-c'> <p class='share-this-pleaseeeee'>Related Post</p> </div><b:loop values="data:post.labels" var="label"><b:if cond="data:label.isLast == "true""><amp-iframe expr:src=""https://cdn.staticaly.com/gh/rokim5421/Blog/423b6c06/amprelatedpost.html?fontSize=16px&color=333&url=https://tutorial-blog-amp.blogspot.com/&label=" + data:label.name" frameborder="0" height="532.84" layout="fixed-height" sandbox="allow-scripts allow-same-origin allow-modals allow-popups"> <amp-img height="532.84" layout="fixed-height" noloading="" placeholder="" src="https://cdn.staticaly.com/img/1.bp.blogspot.com/-x1yVa6ztsWY/WyHFPLG0uLI/AAAAAAAAyIg/3C5Lb5EjGywOPzO_XSwK1XTu6VlBZE4SgCLcBGAs/s1600/back-iframe.png" width="auto"> </amp-img></amp-iframe></b:if></b:loop>
Ganti url https://tutorial-blog-amp.blogspot.com/ dengan url kalian.