Hello sobat ICloudzer kali ini admin akan membahas mengenai cara membuat widget Maintenance pada template median UI 1.7
Info: Jika kamu penasaran dengan pembahasan kita kali ini yuk langsung aja kita bahas bersama sama
Widget Maintenance
Widget maintenance di blogger merupakan fitur untuk menampilkan pesan ke pada pembaca bahwa halaman blog sedang di lakukan perbaikan, sedangan tampilan dari widget maintenance nantinya akan menutupi seluruh halaman blog tanpa terkecuali, dengan menampilkan waktu berakhirnya maintenance atau perbaikan blog tersebut, silahkan Download Template median UI terbaru v1.7 yang sudah di lengkapi fitur maintenance di dalam nya
Contoh Tampilan
Jika kamu berhasil menerapkan script widget maintenance ini pada template median UI 1.7, maka hasil arau tampilan akan seperti contoh gambar di bawah ini
Info: Jika di mungkinkan script kode pembuat widget maintenance ini bisa di terapkan di semua template atau semua versi template median UI tanpa terkecuali
Cara pembuatan
Baiklah sobat ICloudzer sekarang saatnya admin akan menjelaskan mengenai cara membuat widget maintenance pada template median UI 1.7 atau versi terbaru, silahkan baca dan ikuti setiap arahan yang admin jelaskan di bawah ini
- Langkah pertama silahkan login ke akun blogger, milikmu menggunakan akun google
- Kemudian silahkan pergi ke menu Themes atau Tema kemudian pilih menu Edit HTML
- Langkah selanjutnya silahkan cari kode seperti di bawah ini
- Jika sudah ketemu silahkan salin kode HTML dan Javascript di bawah ini, kemudian taruh di atasnya
- Kemudian simpan template dan lihat bagaimana hasilnya, semoga bermanfaat
<!--[ Wrapper ]-->
<b:tag class='mainW' name='div'>Info: Kode tersebut berada di bawah tag kode <body> alias paling atas dari source kode template
<b:comment><!--[ Maintenance Mode ]--></b:comment>
<b:section id='maintenance-mode' maxwidgets='1' showaddelement='false'>
<b:widget cond='!data:view.isPreview' id='HTML353' locked='true' title='Site is Under Maintenance' type='HTML' version='2' visible='true'>
<b:widget-settings>
<b:widget-setting name='content'>Please come back again in...
<script type='text/javascript'>/*<![CDATA[*//* Gunakan penulisan bahasa inggris misal July, August, dan September */
const maintenanceEndOn = 'August 08 2030 00:00:00 GMT+05:30';
/*]]>*/</script></b:widget-setting>
</b:widget-settings>
<b:includable id='main'>
<div class='rahMtm'>
<div class='rahMtmC'>
<div class='rahMtmS'>
<svg class='line' viewBox='0 0 24 24'><path d='M13.2852 19.3647L5.82243 20.7506C4.39103 21.0164 3.67534 21.1493 3.26303 20.737C2.85072 20.3246 2.98362 19.6089 3.24943 18.1774L4.63523 10.7143C4.85745 9.51762 4.96856 8.91925 5.36302 8.5577C5.75749 8.19616 6.47889 8.1256 7.9217 7.98448C9.31227 7.84847 10.6283 7.37177 12 6L18 12.0005C16.6283 13.3723 16.1513 14.6874 16.0151 16.0781C15.8738 17.5211 15.8031 18.2426 15.4416 18.637C15.0801 19.0314 14.4818 19.1425 13.2852 19.3647Z'></path><path d='M11 15.2105C10.4405 15.1197 9.92895 14.8763 9.52632 14.4737M9.52632 14.4737C9.12368 14.0711 8.8803 13.5595 8.78947 13M9.52632 14.4737L4 20'></path><path d='M12 6C12.7123 4.9491 13.6771 3.1812 15.1065 3.01098C16.0822 2.89479 16.8906 3.70312 18.5072 5.31978L18.6802 5.49277C20.2969 7.10944 21.1052 7.91777 20.989 8.8935C20.8188 10.3229 19.0509 11.2877 18 12'></path></svg>
</div>
<div class='rahMtmH'><data:title/></div>
<div class='rahMtmD'><data:content/></div>
<div class='rahClock'>
<div class='rahTbox'>
<span class='rahDays'>00</span>
<span class='rahUnit'>Days</span>
</div>
<div class='rahTbox'>
<span class='rahHours'>00</span>
<span class='rahUnit'>Hours</span>
</div>
<div class='rahTbox'>
<span class='rahMinutes'>00</span>
<span class='rahUnit'>Minutes</span>
</div>
<div class='rahTbox'>
<span class='rahSeconds'>00</span>
<span class='rahUnit'>Seconds</span>
</div>
</div>
</div>
</div>
<script>/*<![CDATA[*/ /* Maintenance mode created by ICloudice.com */
const rahMtmBg = 'var(--themeBg)';
const rahTboxBg = 'var(--contentBg)';
const rahFontB = 'var(--fontBody)';
eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('W i=["\\t\\e\\c\\j\\A\\a\\r","\\1w\\G\\d\\e\\z\\O\\d\\o\\d\\w\\a\\f\\e","\\t\\e\\c\\j\\J\\x\\f\\l\\q\\t\\e\\c\\j\\1c\\c\\z\\m","\\t\\e\\c\\j\\J\\x\\f\\l\\q\\t\\e\\c\\j\\1d\\f\\G\\e\\m","\\t\\e\\c\\j\\J\\x\\f\\l\\q\\t\\e\\c\\j\\A\\b\\g\\G\\a\\d\\m","\\t\\e\\c\\j\\J\\x\\f\\l\\q\\t\\e\\c\\j\\O\\d\\w\\f\\g\\s\\m","\\v\\d\\a\\J\\b\\r\\d","\\y\\o\\f\\f\\e","\\b\\g\\g\\d\\e\\J\\d\\l\\a","\\p","\\j\\s\\g","\\c\\s\\s","\\w\\o\\c\\m\\m\\1x\\b\\m\\a","\\m\\a\\z\\o\\d","\\w\\e\\d\\c\\a\\d\\1y\\o\\d\\r\\d\\g\\a","\\a\\z\\n\\d","\\a\\d\\l\\a\\1e\\w\\m\\m","\\a\\d\\l\\a\\P\\f\\g\\a\\d\\g\\a","\\t\\e\\c\\j\\A\\a\\r\\C\\n\\f\\m\\b\\a\\b\\f\\g\\h\\y\\b\\l\\d\\s\\k\\o\\d\\y\\a\\h\\p\\k\\e\\b\\v\\j\\a\\h\\p\\k\\a\\f\\n\\h\\u\\X\\B\\Q\\k\\x\\f\\a\\a\\f\\r\\h\\u\\X\\B\\Q\\k\\s\\b\\m\\n\\o\\c\\z\\h\\y\\o\\d\\l\\k\\c\\o\\b\\v\\g\\u\\b\\a\\d\\r\\m\\h\\w\\d\\g\\a\\d\\e\\k\\1z\\G\\m\\a\\b\\y\\z\\u\\w\\f\\g\\a\\d\\g\\a\\h\\w\\d\\g\\a\\d\\e\\k\\x\\c\\w\\L\\v\\e\\f\\G\\g\\s\\h","\\k\\a\\e\\c\\g\\m\\b\\a\\b\\f\\g\\h\\c\\o\\o\\q\\t\\B\\m\\q\\d\\c\\m\\d\\k\\u\\H\\d\\x\\L\\b\\a\\u\\a\\e\\c\\g\\m\\b\\a\\b\\f\\g\\h\\c\\o\\o\\q\\t\\B\\m\\q\\d\\c\\m\\d\\k\\N\\b\\m\\b\\x\\b\\o\\b\\a\\z\\h\\N\\b\\m\\b\\x\\o\\d\\k\\f\\n\\c\\w\\b\\a\\z\\h\\D\\k\\R\\u\\b\\g\\s\\d\\l\\h\\Y\\1f\\1f\\E\\q\\t\\e\\c\\j\\A\\a\\r\\t\\j\\s\\g\\C\\N\\b\\m\\b\\x\\b\\o\\b\\a\\z\\h\\j\\b\\s\\s\\d\\g\\k\\f\\n\\c\\w\\b\\a\\z\\h\\p\\E\\q\\t\\e\\c\\j\\A\\a\\r\\P\\C\\r\\c\\l\\u\\H\\b\\s\\a\\j\\h\\Y\\B\\p\\n\\l\\k\\n\\c\\s\\s\\b\\g\\v\\h\\M\\p\\n\\l\\k\\a\\d\\l\\a\\u\\c\\o\\b\\v\\g\\h\\w\\d\\g\\a\\d\\e\\E\\q\\t\\e\\c\\j\\A\\a\\r\\O\\C\\c\\o\\b\\v\\g\\u\\b\\a\\d\\r\\m\\h\\w\\d\\g\\a\\d\\e\\k\\r\\c\\e\\v\\b\\g\\u\\x\\f\\a\\a\\f\\r\\h\\D\\p\\n\\l\\E\\t\\e\\c\\j\\A\\a\\r\\O\\q\\m\\N\\v\\C\\H\\b\\s\\a\\j\\h\\D\\B\\p\\n\\l\\k\\j\\d\\b\\v\\j\\a\\h\\D\\B\\p\\n\\l\\E\\t\\e\\c\\j\\A\\a\\r\\1d\\C\\y\\f\\g\\a\\u\\H\\d\\b\\v\\j\\a\\h\\1A\\p\\p\\k\\y\\f\\g\\a\\u\\m\\b\\R\\d\\h\\D\\t\\B\\e\\d\\r\\k\\y\\f\\g\\a\\u\\y\\c\\r\\b\\o\\z\\h","\\k\\r\\c\\e\\v\\b\\g\\u\\x\\f\\a\\a\\f\\r\\h\\D\\p\\n\\l\\E\\q\\t\\e\\c\\j\\A\\a\\r\\1c\\C\\r\\c\\e\\v\\b\\g\\u\\x\\f\\a\\a\\f\\r\\h\\D\\p\\n\\l\\E\\q\\t\\e\\c\\j\\A\\a\\r\\q\\t\\e\\c\\j\\P\\o\\f\\w\\L\\C\\H\\b\\s\\a\\j\\h\\D\\p\\p\\Q\\k\\y\\f\\g\\a\\u\\m\\b\\R\\d\\h\\M\\B\\n\\l\\k\\a\\d\\l\\a\\u\\c\\o\\b\\v\\g\\h\\w\\d\\g\\a\\d\\e\\k\\y\\f\\g\\a\\u\\y\\c\\r\\b\\o\\z\\h","\\k\\y\\f\\g\\a\\u\\H\\d\\b\\v\\j\\a\\h\\Y\\p\\p\\k\\n\\f\\m\\b\\a\\b\\f\\g\\h\\e\\d\\o\\c\\a\\b\\N\\d\\k\\o\\d\\y\\a\\h\\p\\k\\e\\b\\v\\j\\a\\h\\p\\E\\q\\t\\e\\c\\j\\A\\a\\r\\q\\t\\e\\c\\j\\J\\x\\f\\l\\C\\H\\b\\s\\a\\j\\h\\1g\\B\\n\\l\\k\\j\\d\\b\\v\\j\\a\\h\\1g\\B\\n\\l\\k\\r\\c\\e\\v\\b\\g\\h\\X\\n\\l\\k\\n\\c\\s\\s\\b\\g\\v\\u\\a\\f\\n\\h\\1h\\n\\l\\k\\x\\c\\w\\L\\v\\e\\f\\G\\g\\s\\u\\w\\f\\o\\f\\e\\h","\\k\\x\\f\\e\\s\\d\\e\\u\\e\\c\\s\\b\\G\\m\\h\\p\\q\\M\\p\\n\\l\\q\\M\\p\\n\\l\\q\\M\\p\\n\\l\\k\\s\\b\\m\\n\\o\\c\\z\\h\\b\\g\\o\\b\\g\\d\\u\\x\\o\\f\\w\\L\\k\\x\\f\\l\\u\\m\\j\\c\\s\\f\\H\\h\\p\\q\\B\\n\\l\\q\\M\\p\\n\\l\\q\\p\\q\\e\\v\\x\\1B\\p\\q\\p\\q\\p\\q\\1e\\q\\D\\p\\Q\\1C\\E\\q\\t\\e\\c\\j\\A\\a\\r\\q\\t\\e\\c\\j\\1D\\g\\b\\a\\C\\s\\b\\m\\n\\o\\c\\z\\h\\x\\o\\f\\w\\L\\k\\y\\f\\g\\a\\u\\m\\b\\R\\d\\h\\D\\p\\n\\l\\k\\r\\c\\e\\v\\b\\g\\h\\c\\G\\a\\f\\k\\y\\f\\g\\a\\u\\y\\c\\r\\b\\o\\z\\h","\\k\\f\\n\\c\\w\\b\\a\\z\\h\\p\\t\\1h\\E","\\c\\n\\n\\d\\g\\s\\P\\j\\b\\o\\s","\\j\\d\\c\\s"];1E(I[i[1]](i[0])!=1F){Z 1i=I[i[1]](i[2]),1j=I[i[1]](i[3]),1k=I[i[1]](i[4]),1l=I[i[1]](i[5]),1m=I[i[1]](i[0]),1n=1o 1p(1G);1q 1a=!1;Z 1r=()=>{1q 1s=1o 1p;W F=1n[i[6]]()-1s[i[6]]();F<=1t&&(1a=!0);W K=1H,S=T[i[7]](F/1u),U=T[i[7]](F%1u/K),K=T[i[7]](F%K/1v),F=T[i[7]](F%1v/1t);1i[i[8]]=S<10?i[9]+S:S,1j[i[8]]=U<10?i[9]+U:U,1k[i[8]]=K<10?i[9]+K:K,1l[i[8]]=F<10?i[9]+F:F};1I(()=>{1a?1m[i[12]][i[11]](i[10]):1r()},1J)};Z V=I[i[14]](i[13]);V[i[15]]=i[16];V[i[17]]=i[18]+1K+i[19]+1b+i[1L]+1b+i[1M]+1N+i[1O]+1b+i[1P];I[i[1Q]][i[1R]](V)',62,116,'||||||||||x74|x69|x61|x65|x72|x6F|x6E|x3A|_0x691c|x68|x3B|x78|x73|x70|x6C|x30|x20|x6D|x64|x2E|x2D|x67|x63|x62|x66|x79|x4D|x35|x7B|x31|x7D|_0xa04dxa|x75|x77|document|x54|_0xa04dxb|x6B|x32|x76|x53|x43|x25|x7A|_0xa04dxc|Math|_0xa04dxd|rahMtmJs|var|x33|x34|const|||||||||||maintenanceDone|rahFontB|x44|x48|x2F|x39|x36|x38|dayDisplay|hourDisplay|minuteDisplay|secondDisplay|maintainCont|maintainEndDate|new|Date|let|updateTimer|_0xa04dx9|1e3|864e5|6e4|x71|x4C|x45|x6A|x37|x28|x29|x55|if|null|maintenanceEndOn|36e5|setInterval|1000|rahMtmBg|20|21|rahTboxBg|22|23|25|24'.split('|'),0,{}))/*]]>*/</script>
</b:includable>
</b:widget>
</b:section>Info: Pada kode di atas kamu bisa mengatur waktu berakhirnya maintenance pada blog kamu, dengan menggunakan format bahasa inggris untuk menentukan bulan, dan kamu bisa mengubah warna dari background widget maintenance jika di mungkinkan sesuai template yang di gunakan, jika pengguna median UI 1.7 tidak perlu mengubah apapun selain format waktunya saja