Cara Membuat Maintenance Mode di Blogger
Arsipbiru.com - Ketika menjelajah suatu blog atau website tentu pernah menjumpai suatu tampilan yang unik, yang bisa dikenal dengan Maintenance Mode. Maintenance Mode atau mode pemeliharaan adalah tampilan yang menyajikan informasi bahwa suatu website atau aplikasi sedang dalam proses pemeliharaan atau perbaikan fitur atau hal lain.
Maintenance Mode memiliki fungsi tidak lain adalah sebagai tampilan pengganti pada suatu blog atau website yang sedang dalam perbaikan. Suatu blog atau website yang menerapkan Maintenance Mode akan membuat pengunjung lebih mudah memahami bahwa blog atau website tersebut sedang tidak dapat diakses untuk sementara waktu.
Membuat Maintenance Mode sangatlah mudah dan sederhana. Tidak perlu menambahkan barisan kode yang cukup rumit. Hanya perlu menambahkan kode HTML dan CSS untuk mempercantik tampilan, Anda sudah dapat membuat tampilan Maintenance Mode di blog.
Nah, pada kesempatan kali ini, saya akan membagikan tutorial bagaimana cara membuat Maintenance Mode di Blogger. Maintenance Mode ini memiliki keunggulan tersendiri, yaitu dapat diaktifkan dan dinonaktifkan dengan mudah. Cukup menambahkan kata 'Maintenance' di akhir judul blog, Anda sudah dapat mengaktifkan Maintenance Mode di blog Anda. Sangat mudah, bukan? Untuk membuatnya, silahkan ikuti langkah-langkah berikut ini dengan seksama agar Maintenance Mode dapat aktif dengan baik.
Cara Membuat Maintenance Mode di Blogger
Pertama, silahkan masuk ke dashboard akun Blogger Anda.
Selanjutnya, pilih menu Tema > klik ikon panah ke bawah di samping menu Sesuaikan > klik Edit HTML.
Untuk berjaga-jaga jika terjadi kesalahan, Anda dapat mencadangkan template terlebih dahulu dengan cara klik ikon panah ke bawah di samping menu Sesuaikan > klik Cadangkan.
Jika sudah masuk ke tampilan Editor Template, salin dengan cara double click dan tempelkan kode berikut ini tepat di atas atau sebelum kode <head>.
<!-- Maintenance Mode by Arsipbiru.com -->
<b:if cond='data:blog.title == "NamaBlogAnda Maintenance" and !data:view.isPreview and !data:view.isLayoutMode'>
<b:tag name='head'>
<title>Maintenance NamaBlogAnda</title>
<meta content='width=device-width,initial-scale=1' name='viewport'/>
<b:include data='blog' name='all-head-content'/>
<link href='//use.fontawesome.com/releases/v5.12.1/css/all.css' rel='stylesheet'/>
<link href='//cdn.jsdelivr.net/gh/zkreations/[email protected]/dist/css/under.min.css' rel='stylesheet'/>
</b:tag>
<b:tag name='body'>
<div class='under'>
<header class='under__content'>
<h1 class='under__title'>Maintenance!</h1>
<div class='under__text'>Blog NamaBlogAnda sedang dalam proses pemeliharaan, kami akan segera kembali!</div>
</header>
<footer class='under__footer'>
<a href='//www.facebook.com/#' target='_blank'><i class="fab fa-facebook-f"/></a>
<a href='//www.twitter.com/#' target='_blank'><i class="fab fa-twitter"/></a>
<a href='//www.github.com/#' target='_blank'><i class="fab fa-github"/></a>
<a href='//www.instagram.com/#' target='_blank'><i class="fab fa-instagram"/></a>
<a href='//www.youtube.com/#' target='_blank'><i class="fab fa-youtube"/></a>
</footer>
<b:loop values='1 to 3' var='l'><div expr:class='"wave wave" + data:l'/></b:loop>
</div>
</b:tag>
<b:else/>Sesuaikan juga link akun media sosial dengan link media sosial yang Anda miliki.
<!-- End Maintenance Mode -->
</b:if>Cara Mengaktifkan dan Menonaktifkan Maintenance Mode di Blog
Pengaturan Maintenance Mode
<b:if cond='data:blog.title == "NamaBlogAnda Maintenance" and !data:view.isPreview and !data:view.isLayoutMode'>
<!-- Background Maintenance Mode --> <style>/*<![CDATA[*/
.wave {
background: #fff; /*
}
.under {
background-color: #fdd9292;
}
/*]]>*/</style><!-- Maintenance Mode by Arsipbiru.com -->………<b:tag name='body'><!-- Background Maintenance Mode --> <style>/*<![CDATA[*/.wave {background: #fff; /*}.under {background-color: #fdd9292;}/*]]>*/</style>………<b:else/>
1 komentar