Cara Membuat Halaman About, Contact, Sitemap, Disclaimer & Privacy Policy

Cucu Anwar Mubarok Belajar Online , Blogger , Cara , Internet , Website Comment

Artikel ini berisi 5 tutorial cara membuat 5 halaman statis paling penting di blog : about (tentang), contact (kontak), sitemap (peta situs), disclaimer (penafian/penolakan), privacy policy (kebijakan privasi).

Saya akan menjelaskan tutorialnya secara terpisah-pisah dan secara berurutan menjadi 5 sub tutorial, tetapi masih dalam satu artikel ini.

Pada masing-masing tutorialnya, saya juga akan menjelaskan sekilas manfaat dari memasang masing-masing halaman statis tersebut.

Oleh karena itu, artikel ini akan menjadi artikel yang lumayan panjang, sehingga anda harus sedikit bersabar untuk menuntaskan membaca tutorialnya.

Tentang (About)

Manfaat memasang halaman tentang (about) antara lain :

Sebagai gambaran umum website/blog anda. Karena tentunya visitor ingin tahu, mengenai gambaran umum website anda, seperti yang saya jelaskan pada halaman about ini
Sebagai salah satu syarat bagi website/blog yang akan didaftarkan menjadi publisher iklan, terutama google adsense

Langkah-langkah cara membuatnya adalah sebagai berikut :

Pada Dasboard admin blogger >> Klik Halaman >> Klik Halaman baru >> Klik Compose
Buat judul halaman. Ketik saja Tentang Kami
Pada mode compose, jelaskan tentang website/blog anda.
Lihat ke samping kanan, klik pilihan >> Klik Jangan izinkan mode tulis >> Klik Selesai
Klik Publikasikan

Sekarang halaman tentang (about) sudah jadi

Kontak (Contact)

Manfaat memasang halaman kontak (contact) antara lain :

Sebagai jalur komunikasi secara pribadi. Karena tidak baik jika semua jenis komunikasi dilayani melalui fasilitas kolom komentar. Dan kebanyakan visitor lebih memilih berkomunikasi melalui ini daripada langsung menyampaikannya melalui kolom komentar
Seperti halaman tentang, keberadaan formulir kontak menjadi salah satu syarat bagi website/blog yang dimaksudkan untuk didaftarkan menjadi publisher iklan, terutama iklan adsense.
Meningkatkan kepercayaan visitor. Karena website/blog yang tidak menyediakan formulir kontak, lebih mirip website/blog spam

Langkah-langkah cara membuatnya adalah sebagai berikut :

Pada Dasboard admin blogger >> Klik Tata letak
Pada Tata letak sidebar >> Klik Tambahkan gadget baru >> Klik Formulir kontak
Klik simpan pengaturan tata letak

Sampai langkah ini, blog anda sudah menampilkan formulir kontak. Tetapi formulir kontak yang ditampilkan merupakan formulir kontak default (bawaan).

Kebanyakan blogger memilih untuk tidak menggunakan formulir kontak jenis ini. Mungkin alasannya karena formulir kontak jenis ini terlalu menghabiskan tempat di sidebar.

Kebanyakan blogger memilih memindahkan formulir kontak ke halaman statis, atau menggantinya dengan form baru yang lebih unik dan ditempatkan di halaman statis.

Jika anda juga ingin membuatnya di halaman statis, maka langkah-langkahnya adalah sebagai berikut :

Dari dasboard admin blogger >> Klik Halaman >> Klik Halaman baru >> Klik Html
Buat judul halaman. Contoh : Kontak kami

Pada mode Html, pastekan script yang kami bagikan di bawah ini

Nama

Alamat Email <span style="color: red; font-weight: bolder;">*</span>

Isi Pesan <span style="color: red; font-weight: bolder;">*</span>

</div>

</div>

</form>

/* Menyembunyikan elemen dalam postingan */

#comments, #blog-pager, .breadcrumbs, .post-footer{display:none}

</style>

Pada bilah kanan, klik Pilihan >> Klik jangan izinkan mode menulis >> Klik Selesai
Klik Publikasikan

Sampai saat ini 2 formulir kontak anda sudah jadi dan keduanya tampil. Yang pertama adalah yang default dan tampil di sidebar, sedangkan yang kedua adalah yang anda buat di halaman statis.

Selanjutnya yang anda perlu lakukan bukan menghilangkan formulir yang default dari sidebar, melainkan menyembunyikannya dari tema. Caranya adalah :

Dari dasboard admin blogger >> Klik Tema >> Klik Edit Html
Di dalam tema, cari kode ]]></b:skin> dan pastekan script yang saya bagikan ini di atas kode tersebut

/* CSS Contact Form */

#ContactForm1{

display:none;

}

#ContactForm1_contact-form-name, #ContactForm1_contact-form-email{

width: 300px;

height:auto;

margin: 5px auto;

padding: 10px;

background: #f2f2f2;

border: 1px solid #ccc;

color:#777;

}

#ContactForm1_contact-form-name:focus, #ContactForm1_contact-form-email:focus, #ContactForm1_contact-form-email-message:focus{

background: #fffff7;

}

#ContactForm1_contact-form-email-message{

width: 450px;

height: 175px;

margin: 5px auto;

padding: 10px;

background: #f2f2f2;

border: 1px solid #ccc;

color:#777;

font-family:Arial, sans-serif;

}

#ContactForm1_contact-form-submit {

width: 101px;

height: 35px;

float: left;

color: #FFF;

padding: 0;

margin: 10px 0 3px 0 0;

cursor: pointer;

background: #5E768D;

border: 1px solid #556f8c;

border-radius:3px;

}

#ContactForm1_contact-form-submit:hover {

background:#435c74;

}

#ContactForm1_contact-form-error-message, #ContactForm1_contact-form-success-message{

width: 450px;

margin-top:35px;

}

Klik simpan

Sekarang formulir kontak default yang ditempatkan di sidebar sudah tidak tampil, dan formulir kontak yang ditempatkan di halaman statis menjadi satu-satunya yang anda tampilkan.

Peta Situs (Sitemap)

Sebelumnya penting diketahui, bahwa peta situs ada 2 jenis, yaitu :

Peta Situs Html : Peta Situs yang dibuat di website/blog kita, manfaatnya sebagai daftar isi untuk memudahkan kita dan pengunjung menemukan konten yang dicari, juga memudahkan proses crawl yang dilakukan oleh mesin pencari google.
Peta Situs XML : Peta Situs yang disubmitkan ke webmaster tools (sekarang google search console), manfaatnya agar setiap pembaharuan Peta Situs Html cepat diindeks dan dicrawl/dirayapi robot mesin pencari

Keduanya penting dibuat, karena fungsinya tidak sama tapi tujuannya sama yaitu agar website/blog kita ramah, bersahabat dan akrab dengan mesin pencari google.

Tanpa menggunakan peta situs, sebenarnya pembaharuan website/blog juga akan tetap diindeks dan dirayapi, tapi mungkin tidak secepat dan seakrab ketika memanfaatkan fungsi peta situs (sitemap).

Begitu juga ketika kita hanya menggunakan salah satunya, Peta Situs Html saja misalnya, itu sudah bagus. Dengan itu kita bisa menata konten, agar visitor jadi "betah dan anteng" mengunjungi website/blog kita.

Dengan itu mereka bisa mendapatkan kemudahan memilih konten yang cocok untuk dibaca atau dikunjungi. Sebagai contoh : silahkan melihat Peta Situs kami ini

Tetapi jika yang anda kejar adalah indeks cepat, maka peta situs (sitemap) Xml jangan dilupakan. Submitkan ke Webmaster Tools (Google Search Console)

Langkah-langkah cara membuat Halaman Statis Peta Situs Html adalah sebagai berikut :

Dari dasboard admin blogger >> Klik Halaman >> Klik Halaman baru >> Klik Html
Buat judul halaman. Biasanya dinamai : Peta Situs atau Sitemap. Ada juga sebagian blogger yang menamainya daftar isi. Tapi nama yang saya rekomendasikan adalah Peta Situs atau Sitemap
Pada mode Html, pastekan script berikut ini jangan lupa ganti tulisan https://www.baitussalam.web.id/ dengan URL Website anda

</style>

//<![CDATA[var postTitle=new Array();var postUrl=new Array();var postPublished=new Array();var postDate=new Array();var postLabels=new Array();var postRecent=new Array();var sortBy="titleasc";var tocLoaded=false;var numChars=250;var postFilter="";var numberfeed=0;function bloggersitemap(a){function b(){if("entry" in a.feed){var d=a.feed.entry.length;numberfeed=d;ii=0;for(var h=0;h<d;h++){var n=a.feed.entry[h];var e=n.title.$t;var m=n.published.$t.substring(0,10);var j;for(var g=0;g<n.link.length;g++){if(n.link[g].rel=="alternate"){j=n.link[g].href;break}}var o="";for(var g=0;g<n.link.length;g++){if(n.link[g].rel=="enclosure"){o=n.link[g].href;break}}var c="";if("category" in n){for(var g=0;g<n.category.length;g++){c=n.category[g].term;var f=c.lastIndexOf(";");if(f!=-1){c=c.substring(0,f)}postLabels[ii]=c;postTitle[ii]=e;postDate[ii]=m;postUrl[ii]=j;postPublished[ii]=o;if(h<10 {postRecent[ii]=true}else{postRecent[ii]=false}ii=ii+1}}}}}b();sortBy="titleasc";sortPosts(sortBy);sortlabel();tocLoaded=true;displayToc2();document.write('</br><div class="sitemap-link">

')}function filterPosts(a){scroll(0,0);postFilter=a;displayToc(postFilter)}function allPosts(){sortlabel();postFilter="";displayToc(postFilter)}function sortPosts(d){function c(e,g){var f=postTitle[e];postTitle[e]=postTitle[g];postTitle[g]=f;var f=postDate[e];postDate[e]=postDate[g];postDate[g]=f;var f=postUrl[e];postUrl[e]=postUrl[g];postUrl[g]=f;var f=postLabels[e];postLabels[e]=postLabels[g];postLabels[g]=f;var f=postPublished[e];postPublished[e]=postPublished[g];postPublished[g]=f;var f=postRecent[e];postRecent[e]=postRecent[g];postRecent[g]=f}for(var b=0;b<postTitle.length-1;b++){for(var a=b+1;a<postTitle.length;a++){if(d=="titleasc"){if(postTitle[b]>postTitle[a]){c(b,a)}}if(d=="titledesc"){if(postTitle[b]<postTitle[a]){c(b,a)}}if(d=="dateoldest"){if(postDate[b]>postDate[a]){c(b,a)}}if(d=="datenewest"){if(postDate[b]<postDate[a]){c(b,a)}}if(d=="orderlabel"){if(postLabels[b]>postLabels[a]){c(b,a)}}}}}function sortlabel(){sortBy="orderlabel";sortPosts(sortBy);var a=0;var b=0;while(b<postTitle.length){temp1=postLabels[b];firsti=a;do{a=a+1}while(postLabels[a]==temp1);b=a;sortPosts2(firsti,a);if(b>postTitle.length){break}}}function sortPosts2(d,c){function e(f,h){var g=postTitle[f];postTitle[f]=postTitle[h];postTitle[h]=g;var g=postDate[f];postDate[f]=postDate[h];postDate[h]=g;var g=postUrl[f];postUrl[f]=postUrl[h];postUrl[h]=g;var g=postLabels[f];postLabels[f]=postLabels[h];postLabels[h]=g;var g=postPublished[f];postPublished[f]=postPublished[h];postPublished[h]=g;var g=postRecent[f];postRecent[f]=postRecent[h];postRecent[h]=g}for(var b=d;b<c-1;b++){for(var a=b+1;a<c;a++){if(postTitle[b]>postTitle[a]){e(b,a)}}}}function displayToc(a){var l=0;var h="";var e="Post Title";var m="Click to sort by title";var d="Date";var k="Click to sort by date";var c="Category";var j="";if(sortBy=="titleasc"){m+=" (descending)";k+=" (newest first)"}if(sortBy=="titledesc"){m+=" (ascending)";k+=" (newest first)"}if(sortBy=="dateoldest"){m+=" (ascending)";k+=" (newest first)"}if(sortBy=="datenewest"){m+=" (ascending)";k+=" (oldest first)"}if(postFilter!=""){j="Click to view all"}h+="<table>";h+="

";for(var g=0;g<postTitle.length;g++){if(a==""){h+='

<tr><td class="entry1"><a href="'+postUrl[g]+'">'+postTitle[g]+'</a></td><td class="entry2">'+postDate[g]+'</td><td class="entry3">'+postLabels[g]+'</td><td class="entry4"><a href="'+postPublished[g]+'">Read</a></td></tr>

';l++}else{z=postLabels[g].lastIndexOf(a);if(z!=-1){h+='

';l++}}}h+="</table>

";if(l==postTitle.length){var f='<span class="toc-note">Show All '+postTitle.length+" Posts<br/></span>"}else{var f='<span class="toc-note">Show '+l+" posts by category '";f+=postFilter+"' the "+postTitle.length+" Total Posts<br/></span>"}var b=document.getElementById("toc");b.innerHTML=f+h}function displayToc2(){var a=0;var b=0;while(b<postTitle.length){temp1=postLabels[b];document.write("<p/>");document.write('<p class="labels">

<ol>");firsti=a;do{document.write("

<li>");document.write('<a class="post-titles" href="'+postUrl[a]+'">'+postTitle[a]+"</a>");if(postRecent[a]==true){document.write(' - <strong><span style="color: rgb(255, 0, 0);">New!</span></strong>')}document.write("</li>

");a=a+1}while(postLabels[a]==temp1);b=a;document.write("</ol>

");sortPosts2(firsti,a);if(b>postTitle.length){break}}}function toggleTitleSort(){if(sortBy=="titleasc"){sortBy="titledesc"}else{sortBy="titleasc"}sortPosts(sortBy);displayToc(postFilter)}function toggleDateSort(){if(sortBy=="datenewest"){sortBy="dateoldest"}else{sortBy="datenewest"}sortPosts(sortBy);displayToc(postFilter)}function showToc(){if(tocLoaded){displayToc(postFilter);var a=document.getElementById("toclink")}else{alert("Just wait... TOC is loading")}}function hideToc(){var a=document.getElementById("toc");a.innerHTML="";var b=document.getElementById("toclink");b.innerHTML='<a href="#" onclick="scroll(0,0); showToc(); Effect.toggle(\'toc-result\',\'blind\');">?? Display Table of Contents</a> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNEEu3QDlmaXOe3gblzKB3L-65BYiMbyuHE935MagJJOOg_r0bhY3ImunKubxbeLkI-Samz5sGP441dw9r4aRLWSH0cEhztzANOnMe1wOW9fDrU0r1tBkrcAon2ujB-eaXTbuA9wPmAtCw/s1600/new_icon.gif"/>'}function looptemp2(){for(var a=0;a<numberfeed;a++){document.write("<br>");document.write('Post Link : <a href="'+postUrl[a]+'">'+postTitle[a]+"</a><br>");document.write('Read all : <a href="'+postPublished[a]+'">'+postTitle[a]+"</a><br>");document.write("<br>")}};

//]]>

</script>

Klik Pilihan >> Klik Jangan izinkan mode tulis >> Klik Selesai
Klik Publikasikan dalam kondisi masih pada mode Html, jangan dipublikasikan pada mode compose.

Sedangkan untuk membuat Peta Situs (sitemap) XML caranya adalah sebagai berikut :

Masuk ke akun anda di google search console. Jika belum memiliki akun di google search console, silahkan membuatnya sekalian, karena itu sangat penting bagi semua jenis website. Saya sudah membuatkan tutorial lengkapnya untuk anda.
Di dasboard akun google analityc, Klik menu Peta Situs/Site Map.
Pada kolom URL Sitemap, pastekan kode berikut ini.

atom.xml?redirect=false&start-index=1&max-results=500

Klik menu Inspeksi URL.
Pada kolom URL, pastekan URL Halaman Peta Situs (Sitemap) Html yang tadi sudah dibuat.

Penafian (Disclaimer)

Disclaimer sering diartikan sebagai suatu penolakan, penyangkalan atau penafian webmaster. Jika dinisbatkan kepada sebuah website ini berarti webmaster baitussalam.web.id menyatakan penafian, penyangkalan atau penolakan bertanggungjawab atas sesuatu hal atau banyak hal yang memang itu sebenarnya di luar tanggungjawab pengelolaan webmaster.

Manfaat dari memasang pernyataan disclaimer di website antara lain :

Disclaimer sangat penting dinyatakan oleh seorang webmaster. untuk membentengi diri dari sesuatu tuntutan yang di luar tanggungjawabnya. Untuk contohnya : anda bisa melihat halaman disclaimer web ini
Keberadaan halaman disclaimer juga merupakan salah satu syarat untuk website/blog yang akan didaftarkan menjadi publisher, termasuk publisher adsense.

Langkah-langkah cara membuatnya bagaimana?

Untuk membuatnya sebenarnya disesuaikan dengan kebutuhan.

Pemilik website bisa membuatnya sendiri pada mode compose seperti cara membuat halaman tentang (about).

Bisa juga membuatnya di situs penyedia gratis seperti di situs privacypolicyonline, sekalian membuat privacy policy dan terms of service.

Di situs privacypolicyonline sudah disediakan generator yang disebut privacy generator. Yang kita perlu lakukan selanjutnya hanya memasukan : nama website, url website, alamat email, negara, provinsi dan kontak website (biasanya email).

Jika kita membuatnya di situs penyedia gratis, maka pernyataan disclaimer yang dihasilkan adalah pernyataan disclaimer yang umum dipergunakan. Akan tetapi menurut saya, isi dari pernyataannya sudah cukup bagus dan layak untuk dipergunakan.

Untuk membuatnya sendiri, langkah-langkahnya adalah :

Dari dasboard admin blogger >> Klik Halaman >> Klik Halaman baru >> Klik Compose >> Ketik sendiri pernyataan disclaimernya sebagaimana cara menulis biasa
Klik Pilihan >> Klik jangan izinkan mode tulis >> Klik Selesai >> Klik Publikasikan dalam kondisi mode compose

Jika anda bermaksud untuk membuatnya di situs penyedia gratis privacypolicyonline, langkah-langkahnya adalah :

Sebelum mengunjungi situs tersebut, persiapkan terlebih dahulu : nama website, url website, nama negara, nama provinsi, alamat email dan url halaman kontak statis. Karena biasanya kita akan diminta untuk memasukan data-data tersebut. Agar pada waktu pengisian kolom data, anda tidak perlu bolak-balik pindah situs.
Kunjungi https://privacypolicyonline dan masukan data-data yang diminta, karena data tersebut adalah untuk digenerate dengan pernyataan disclaimer seperti yang sedang anda butuhkan dan Klik Generate.
Setelah digenerate, biasanya yang keluar adalah tulisan dalam format html. copy/salin tulisan html tersebut.
Masuk ke dasboard admin blogger >> Klik Halaman >> Klik Halaman baru >> Klik Html
Buat judul halaman. Misalnya : Penolakan atau Disclaimer
Pada mode Html, pastekan tulisan html hasil generate tadi
Klik Pilihan >> Klik Jangan izinkan mode tulis >> Klik selesai
Klik Publikasikan dalam kondisi mode Html. Sekarang anda sudah menerbitkan halaman yang berisi pernyataan disclaimer

Kebijakan Privasi (Privacy Policy)

Privacy policy biasa diartikan kebijakan privasi. Pernyataan ini lebih fokus pada menjelaskan bahwa website yang dikunjungi visitor tidak masuk terlalu jauh ke wilayah privasi visitor. Setiap data yang diambil dari visitor semata untuk pengembangan website, seperti penggunaan file log dan cokies, baik cokie yang dipergunakan oleh website tersebut maupun oleh pihak ketiga yang bekerjasama dalam pemanfaatan keberadaan website tersebut, seperti google adsense, amazon, chitika, dan sebagainya.

Manfaat memasang halaman privacy policy antara lain :

Agar pengunjung tidak berprasangka negatif terhadap pemilik website dan partnersitenya
Seperti disclaimer, halaman privacy policy merupakan salah satu kelengkapan persyaratan monetisasi website/blog, jika monetisasi melibatkan kerjasama dengan pihak ketiga. Biasanya dijadikan syarat oleh pihak ketiga.

Bagaimana langkah-langkah cara membuatnya?

Cara membuatnya dan segala yang mesti dipersiapkan sebelum membuatnya tidak jauh beda dengan tutorial cara membuat halaman disclaimer.

Formulir Kontak