» » » » Membuat dan Memodifikasi Tampilan Recent Post Template Evo Magz

Membuat dan Memodifikasi Tampilan Recent Post Template Evo Magz

,, Edit
Membuat dan Memodifikasi Tampilan Recent Post Template Evo Magz bisa dilakukan dengan cara yang sangat mudah, sebenaranya Template Evo Magz Sendiri sudah dilengkapi dengan fitur Recent Post, hanya saja fitur tersebut hanya menampilkan postingan/artikel perlabel, maka dari itu jika kita ingin membuat Recent Post untuk keseluruhan artikel, maka kita perlu sedikit Iseng - Iseng Modifikasi Template Evo Magz.

Susunan setiap template berbeda - beda dan mungkin tidak semua cara membuat recent post yang bertebaran di internet bisa berhasil dilakukan di template evo magz, maksudnya secara teknis memang bisa dan sama saja tapi tampilannya pasti tidak sesuai dengan yang kita inginkan. Karena disini kita tidak hanya membuat Javascript untuk membuat sebuah Recent Post di Template Evo Magz, tapi juga harus sedikit menambahkan susunan CSS yang terdapat di sidebar, karena memang kali Saya ingin mencoba menampilkan Recent Post pada bagian sidebar. 

Saya juga pernah mencoba untuk membuat Recent Post di Evo Magz menggunakan cara - cara yang sudah bertebaran di internet, umumnya memang beberapa tutorial di internet  menggunakan Javascript untuk menampilkan sebuah recent post di blog. Saya pernah mencoba beberapa tutorial dari beberapa blog dan Recent Post memang berhasil tampil, tapi kalau di perhatikan tampilannya memang kurang begitu rapih, jadi sebenarnya Javascript tidak salah, melainkan CSS yang berada di sidebar yang harus di rubah/ditambah.

 Dalam tutorial kali ini Saya ingin menampilkan Recent Post di sidebar kanan, Recent post yang ditampilkan hanya judulnya saja, berikut adalah langkah atau cara - caranya :

 1. Masuk ke Blog dan tambahkanlah sebuah gadget HTML/Javascript baru
2. Copy kode yang ada di bawah ini 

<script type="text/javascript">

function showrecentposts(json){for(var i=0;i<numposts;i++){var 

entry=json.feed.entry[i];var posttitle=entry.title.$t;var posturl;if

(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if

(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break}}

posttitle=posttitle.link(posturl);if(standardstyling)document.write

('<li>');document.write(posttitle)}if(standardstyling)document.write('</li>')}

</script>

<script type="text/javascript">var numposts = 9;var showpostdate = false;var 

showpostsummary = false;var numchars = 0;var standardstyling = true;</script>
<script type="text/javascript" src="/feeds/posts/default?

orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts"></script>

3. Pada Tahap ini sebenarnya Recent Post sudah berhasil di tampilkan, tapi mungkin nanti tampilannya akan terlihat seperti gambar di bawah ini
Recent Post berhasil ditampilkan, tapi ada titik - titiknya
Menurut Saya tampilan tersebut kurang rapih, ada titik - titik seperti sebuah penanda pada setiap post, dan titik - titik tersebut juga terlalu dekat dengan garis postingan/artikel.

 4. Untuk memperbaiki tampilannya kita harus sedikit melakukan modifikasi
    terhadap class .sidebar li yang terdapat dalam template, kita harus
    merubah isi/properti CSS nya
5. Tekan CTRL+F lalu masukan .sidebar li pada kolom pencarian script

6. Ganti properti yang terdapat dalam .sidebar li menggunakan properti atau
     CSS berikut

.sidebar li {
 margin: 8px 0;
 padding: 0 0 5px;
 border-bottom: 1px solid #f0f0f0;
 list-style: none;
}

5.Save Template, bila berhasil nanti tampilan resent postnya akan terlihat
   seperti berikut
Recent Post berhasil ditampilkan dengan rapih

Menurut Saya tampilan tersebut terlihat lebih rapih dibandingkan dengan tampilan yang sebelumnya, Saya menambahkan garis bawah pada setiap post yang ditampikan dan mengatur jarakanya agar tidak terlalu berdekatan.

Untuk menampilkan recent post perlabel atau berdasarkan label, Anda bisa mengikuti langkah - langkahnya pada artikel Membuat Recent Post Sederhana Untuk Blog Berdasarkan Label

Related Posts :

6 Responses to "Membuat dan Memodifikasi Tampilan Recent Post Template Evo Magz"

  1. Mangs AbdulAugust 4, 2016 at 9:55 PM

    mantep modivikasinya.
    mas kayanya harus segera buat templete sendiri nih.

    ReplyDelete
    Replies
    1. Ahmad ZaelaniAugust 5, 2016 at 7:52 AM

      jhahaha,,, duuh kayaknya saya masih butuh banyak waktu untuk belajar lagi mang... XD

      Delete

Silahkan untuk meninggalkan komentar, santai saja dan mulailah berkomentar...

Subscribe to:Post Comments (Atom)
mahjongways menghadirkan evolusi visual digital melalui perpaduan animasi adaptif dan teknologi antarmuka modernintegrasi teknologi real time mengubah cara platform digital mengelola interaksi dan respons penggunaperan random number generator menjaga independensi hasil pada sistem permainan digital modernmengenal cara mahjongways mengembangkan pengalaman interaktif melalui sistem respons simbol dan desain grafis digitalarsitektur microservices menjadi fondasi penting dalam membangun infrastruktur platform digital yang lebih fleksibelmengenal volatilitas dan distribusi hasil dalam karakteristik matematis permainan digital berbasis rngmahjong ways dan evolusi budaya digital melalui perpaduan warisan tradisional dengan teknologi interaktif moderntransformasi infrastruktur digital memperlihatkan peran penting otomatisasi dalam menjaga stabilitas sistemmahjongways memperlihatkan perkembangan desain permainan digital melalui optimalisasi animasi dan transisi visualgame pg soft dan perubahan standar desain visual dalam industri hiburan digitalmengapa game pg soft sering dibahas dalam perkembangan permainan berbasis smartphonedi balik game pg soft bagaimana teknologi animasi membentuk pengalaman penggunagame pg soft dalam sorotan perbedaan antara fitur interaktif dan mekanisme acakketika tampilan game pg soft menjadi bahan diskusi tentang psikologi warnamengulas game pg soft dari sisi perkembangan antarmuka dan kenyamanan navigasigame pg soft dan tantangan membedakan informasi resmi dari klaim komunitasbagaimana game pg soft mengadaptasi elemen budaya dalam konsep visual permainangame pg soft dan pentingnya memahami perbedaan antara rtp serta hasil sesaatfenomena konten video pendek yang membentuk persepsi publik tentang game pg softgame online dan fenomena munculnya pemimpin komunitas dari kalangan pemain biasamengapa sistem reputasi menjadi bagian penting dalam interaksi game onlineketika game online menghadirkan tantangan baru dalam menjaga etika komunikasiperubahan pola kerja sama tim menjadi sorotan dalam perkembangan game onlinegame online dan peran sistem moderasi dalam membangun lingkungan bermain yang sehatbagaimana game online menghubungkan komunitas kecil menjadi jaringan globalfenomena pemain game online yang mengembangkan keterampilan organisasi komunitasgame online dalam kajian perubahan kebiasaan sosial di ruang virtualmengapa transparansi sistem peringkat menjadi perhatian dalam komunitas game onlineketika game online menjadi ruang kreatif bagi pembuat konten dan pemaingame digital dan perubahan cara pengembang membangun dunia virtual yang realistismengapa teknologi haptic feedback menjadi pembahasan menarik dalam game digitalketika game digital menghadirkan karakter yang bereaksi terhadap keputusan pemainperan pencahayaan dinamis dalam membangun suasana permainan game digitalgame digital dan tantangan menjaga identitas seni di tengah perkembangan aibagaimana sistem penyimpanan cloud mengubah pengalaman mengakses game digitalfenomena game digital yang mengangkat cerita rakyat menjadi petualangan interaktifgame digital dalam sorotan perubahan cara studio indie mengembangkan karyamengapa pelestarian game digital lama menjadi topik penting dalam arsip teknologiketika game digital digunakan untuk mengenalkan konsep sains melalui simulasigates of olympus dan kisah mitologi zeus yang diadaptasi menjadi hiburan digitalmengapa sweet bonanza menggunakan tema permen dalam membangun identitas visual gamestarlight princess dan peran karakter fantasi dalam perkembangan desain slot modernfenomena big bass bonanza yang menggabungkan tema memancing dengan mekanisme permainansugar rush 1000 dan cara animasi warna warni membentuk pengalaman visual penggunamengenal the dog house megaways dari sisi desain karakter dan variasi fitur gamegates of hades mengangkat dunia bawah mitologi yunani ke dalam konsep permainan digitaldi balik sweet rush bonanza ada konsep pengali yang menarik dibahas secara matematisfortune of olympus dan perbedaan desain mekanisme permainan bertema dewa yunanimengapa gates of olympus 2500 menarik dikaji dari sisi evolusi seri game digital