Selamat sore buat Ajeng Bersosial terlebih dahulu baru buat Aden Bersosial hehe Kali aja ada yang belum tahu cara buat sitemap HTML otomatis di Blogger makanya saya buat tread ini. Gunanya buat apa Sitemap HTML, kan udah ada Sitemap versi xml ataupun feed? Lagi-lagi buat kepuasan para pengunjung Blog Aden ataupun Ajeng Bersosial, dan juga sitemap merupakan salah satu saran yang diberikan di Panduan Webmaster Google Search Console. Yuk kita praktekin: Biasa masuk dulu ke Dashboard Blogger >>> Trus bikin Laman Baru disana, kayak gambar ini: Yang panah hitam tuh buat bikin Laman Barunya. Kemudian kita buat titlenya terlebih dahulu, terserah Ajen, Aden mau namanin apa itu titlenya, kaya Sitemap Manual atau Peta Situs, ataupun Daftar Isi, Sak Karep Mu. Trus ganti ke menu editingnya ke menu HTML (panah hitam), and jangan lupa kasih sedikit penjelasan (panah biru) seperti penampakan di bawah: Sekarang kita masukin dah nih 2 script di bawah ini di laman tersebut: Code: <script src="https://googledrive.com/host/0BxxpL9cw7zsvM3FtTUZBUHNyVjQ"></script> <script src="http://<span style="color:#ff0000;">alamat-blog-kalian</span>/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"></script> Jangan lupa ganti alamat blognya (harusnya textnya warna merah diatas, tapi gak nampak Y_Y) dengan alamat blog kalian, lalu kita publish (publikasikan). Jadi deh sukses gitu aja udah kelar hehehe Tapi kurang enak ya kalo gak dihias, coba kita hias sedikit dengan memasukan CSS didalamnya, Copy aja kode di bawah ini: Code: <style> .post-body{ width:99%; margin:5px auto; -webkit-box-shadow:14px 4px 8px 2px rgba(0,0,0, 0.2); -moz-box-shadow:14px 4px 8px 2px rgba(0,0,0, 0.2); box-shadow:14px 4px 8px 2px rgba(0,0,0, 0.2); } .post-body p{ color:#FF5F00; font-weight:bold; margin:0 -5px; padding:1px 0 2px 11px; background:-moz-linear-gradient(right,#C2EAFE 0%,#055A85 40%); background:-webkit-gradient(linear,left 10,right 80,color-stop(0.20,#055A85),color-stop(1,#C2EAFE)); border:1px solid #2D96DF; border-radius:4px;-moz-border-radius:4px; -webkit-border-radius:4px;box-shadow:3px 3px 1px #bbb; -moz-box-shadow:3px 3px 1px #bbb;-webkit-box-shadow:3px 3px 1px #bbb;display:block; } .post-body p a{ color:#AA80FE; -webkit-animation: warna 3s 1s forwards infinite; -moz-animation: warna 3s 1s forwards infinite; -ms-animation: warna 3s 1s forwards infinite; -o-animation: warna 3s 1s forwards infinite; animation: warna 3s 1s forwards infinite; } .post-body p a:hover{ color:#FF3300; } @keyframes warna { 10% { color: red; } 20% { color: yellow; } 30% { color: turquoise; } 40% { color: gold; } 50% { color: orange; } 60% { color: darkblue; } 70% { color: silver; } 80% { color: green; } 90% { color: blue; } 100% { color: purple; } } .post-body ol{ font-weight:normal; margin-left: 20px; background:-moz-linear-gradient(right,#C2EAFE 0%,#fff 40%); background:-webkit-gradient(linear,left 80,right 10,color-stop(0.60,#fff),color-stop(1,#C2EAFE)); } .post-body li{ border-bottom: #ddd 1px dotted; margin-right:5px; } .post-body li:hover{ background:##D4BFFE; } </style> Paste kode di atas tepat di atas script yang pertama kali kita cantumkan di awal tadi, nanti susunannya kayak ini nih DEN, Jeng: Code: <style> .post-body{ width:99%; margin:5px auto; -webkit-box-shadow:14px 4px 8px 2px rgba(0,0,0, 0.2); -moz-box-shadow:14px 4px 8px 2px rgba(0,0,0, 0.2); box-shadow:14px 4px 8px 2px rgba(0,0,0, 0.2); } .post-body p{ color:#FF5F00; font-weight:bold; margin:0 -5px; padding:1px 0 2px 11px; background:-moz-linear-gradient(right,#C2EAFE 0%,#055A85 40%); background:-webkit-gradient(linear,left 10,right 80,color-stop(0.20,#055A85),color-stop(1,#C2EAFE)); border:1px solid #2D96DF; border-radius:4px;-moz-border-radius:4px; -webkit-border-radius:4px;box-shadow:3px 3px 1px #bbb; -moz-box-shadow:3px 3px 1px #bbb;-webkit-box-shadow:3px 3px 1px #bbb;display:block; } .post-body p a{ color:#AA80FE; -webkit-animation: warna 3s 1s forwards infinite; -moz-animation: warna 3s 1s forwards infinite; -ms-animation: warna 3s 1s forwards infinite; -o-animation: warna 3s 1s forwards infinite; animation: warna 3s 1s forwards infinite; } .post-body p a:hover{ color:#FF3300; } @keyframes warna { 10% { color: red; } 20% { color: yellow; } 30% { color: turquoise; } 40% { color: gold; } 50% { color: orange; } 60% { color: darkblue; } 70% { color: silver; } 80% { color: green; } 90% { color: blue; } 100% { color: purple; } } .post-body ol{ font-weight:normal; margin-left: 20px; background:-moz-linear-gradient(right,#C2EAFE 0%,#fff 40%); background:-webkit-gradient(linear,left 80,right 10,color-stop(0.60,#fff),color-stop(1,#C2EAFE)); } .post-body li{ border-bottom: #ddd 1px dotted; margin-right:5px; } .post-body li:hover{ background:##D4BFFE; } </style> <script src="https://googledrive.com/host/0BxxpL9cw7zsvM3FtTUZBUHNyVjQ"></script> <script src="http://alamat-blog-kalian/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"></script> Sekarang tinggal di simpan lalu Publish ulang deh, jangan lupa untuk di cek ya ada yang janggal apa gak pada hasil laman yang baru kita buat tadi. Soal warna kalian bisa ganti sendiri sesuai selera, kalo soal kendala kode warna yang kurang hapal, bisa cek Kode Warnanya di sini : Klik Den/Jeng. Itu aja sih yang mau saya bagi, moga2 aja bermanfaat ya Den, Jeng Bersosial, Kalau mau lihat versi Blognya bisa lihat di sini: Pelan-pelan Pijitnya. Kalau ada salah-salah pengetikan atau kendala, mohon dimaafin ye, maklum manusia tempatnya salah dan lupa, jreennnng Selamat Mencoba Mugianto mugianto, Apr 14, 2016 #1 Tantowi Active Member Joined: May 9, 2015 Messages: 635 Likes Received: 24 Trophy Points: 48 Infonya bagus gan meski ane udah tau sihh hehe Tantowi, Apr 14, 2016 #2 mugianto Member Joined: Mar 7, 2016 Messages: 419 Likes Received: 48 Trophy Points: 28 Google+: Author sip Den klo dah tau hehehe mugianto, Apr 14, 2016 #3 Angkasa Bali Member Joined: Oct 20, 2014 Messages: 787 Likes Received: 72 Trophy Points: 28 mantap gan ane coba dulu makasi gan Angkasa Bali, Apr 25, 2016 #4 mugianto Member Joined: Mar 7, 2016 Messages: 419 Likes Received: 48 Trophy Points: 28 Google+: Author Semoga sukses Den salam bersosial mugianto, Apr 25, 2016 #5 ibrahimovic Member Joined: Apr 19, 2016 Messages: 20 Likes Received: 1 Trophy Points: 8 dicoba dulu gan di test di test hahaha ibrahimovic, Apr 28, 2016 #6 mugianto Member Joined: Mar 7, 2016 Messages: 419 Likes Received: 48 Trophy Points: 28 Google+: Author semoga berhasil den prakteknya mugianto, Apr 30, 2016 #7 Bloger jatim New Member Joined: Aug 19, 2016 Messages: 3 Likes Received: 0 Trophy Points: 1 Ada demonya ngak gan Bloger jatim, Aug 19, 2016 #8 (You must log in or sign up to reply here.) Show Ignored Content Loading... Similar Threads - Cara Bikin Sitemap Cara Mendapatkan Referensi Backlink Faizalr, Mar 28, 2023, in forum: Search Engine Optimization Replies: 8 Views: 10,434 Chandra Devi Jul 27, 2023 Cara Menghitung dan Meningkatkan Conversion Rate Website Nur Maulida, Apr 30, 2021, in forum: Search Engine Optimization Replies: 1 Views: 1,887 Mas Her Apr 30, 2021 Bagaimana Cara menulis Artikel SEO Friendly noer98, Mar 23, 2021, in forum: Search Engine Optimization Replies: 3 Views: 2,232 mangdullaharny May 31, 2021 Cara SEO Website Yang Sukses noer98, Mar 2, 2021, in forum: Search Engine Optimization Replies: 7 Views: 2,410 ziuma Mar 3, 2021 Cara Mudah untuk Memperbaiki Masalah Konten Duplikat noer98, Feb 27, 2021, in forum: Search Engine Optimization Replies: 9 Views: 7,111 egihrsn Jun 8, 2021 Share This Page Tweet Log in with Facebook Log in with Twitter Your name or email address: Do you already have an account? No, create an account now. Yes, my password is: Forgot your password? Stay logged in