Cara Memasang Status Puasa Terbaru Di Blog Oleh ARDL Season 2

0
Ini Puasa Ramadhan Ini Status Puasa Apakah Ini Blog. Oleh ARDL Season 2 Pada Status Puasa Ini. Ini Status Puasa Adalah Waktu Ini Nanti Mulai Sahur, Sahur, Imsak, Batal Puasa, Ngabuburit, Berbuka Puasa, Sholat Tarawih dan Selamat Tidur Semuanya Ada. Ini ARDL Season 2 Berpuasa Ramadhan Ini.

Ramadhan Puasa Ini Blog Cara Memasang Status Puasa Terbaru Di Blog Apakah Ini. Ini Template Di Atas Status Puasa Di Minisite Ini Maharani Template Terbaru Ini. Apakah Ini Puasa Ramadhan Ini.

(VER 1) Cara Memasang Widget Status Puasa Terbaru Di blog

1. Masuk Blogger
2. Klik Tata Letak
3. Terus Klik Tambahkan Gadget
4. Terus Klik HTML/Javascript
5. Letakkan Kode Di Bawah Status Puasa

Script Panjang

<div style="font-size: 30px;">Status Puasa:</div>
<div style="font-size: 30px;">
<script type="text/javascript">
    var d = new Date();
    var time = d.getHours();
    if (time>=0 && time<3){document.write("Nanti Mulai Sahur");
    }
    else if (time>=3 && time<4){document.write("<a href='http://paket-r-l-intan-brov2.blogspot.co.id/2016/05/status-puasa-sahur.html' target='_blank'>Sahur</a>");
    }
    else if (time>=4 && time<5){document.write("<a href='http://paket-r-l-intan-brov2.blogspot.co.id/2016/05/status-puasa-imsak-dan-sholat-subuh.html' target='_blank'>Imsak</a>");
    }
    else if (time>=5 && time<15){document.write("<a href='http://paket-r-l-intan-brov2.blogspot.co.id/2016/05/status-puasa-batal-puasa.html' target='_blank'>Batal Puasa</a>");
    }
    else if (time>=15 && time<18){document.write("<a href='http://paket-r-l-intan-brov2.blogspot.co.id/2016/05/status-puasa-ngabuburit.html' target='_blank'>Ngabuburit</a>");
    }
    else if (time>=18 && time<19){document.write("<a href='http://paket-r-l-intan-brov2.blogspot.co.id/2016/05/status-puasa-berbuka-puasa.html' target='_blank'>Berbuka Puasa</a>");
    }
    else if (time>=19 && time<21){document.write("<a href='http://paket-r-l-intan-brov2.blogspot.co.id/2016/05/status-puasa-sholat-tarawih.html' target='_blank'>Sholat Tarawih</a>");
    }
    else if (time>=21 && time<=23){document.write("<a href='http://paket-r-l-intan-brov2.blogspot.co.id/2016/05/status-puasa-selamat-tidur-malam.html' target='_blank'>Selamat Tidur</a>");
    }
     </script>
</div>

atau Script Pendek Di Github

Ini Javascript Sebelum HTML

<script src="https://cdn.rawgit.com/songketwarnetma/maharani-site-ma/master/statuspuasa.js"></script>

Ini Javascript Sesudah HTML

<div style="font-size: 30px;">Status Puasa:</div>
<div style="font-size: 30px;">
<script src="https://cdn.rawgit.com/songketwarnetma/maharani-site-ma/master/statuspuasa.js"></script>
</div>
6. Selesai Klik Simpan
7. Lihat Hasil Blog

(VER 2) Cara Memasang Di Atas Header Ini Status Puasa Di Blog

1. Masuk Blogger
2. Klik Template
3. Terus Edit HTML
4. Terus Cari Ini Ctrl+F
5. Terus Ketik </style> atau </head>
6. Letakkan Kode CSS Dibawah </style> Diatas atau </head> Diatas ini Ditambah <style> dan </style>
/* Header Status Puasa */
.headerstatuspuasa{background-color: green;color: white;text-align: center;font-size: 20px;}
.headerstatuspuasa a{color: white; text-decoration:none}
.headerstatuspuasa a:visited{color: lightblue}
.headerstatuspuasa a:hover{color: lightgreen}
.headerstatuspuasa a:active{color: darkgreen}
7. Selanjutnya Ketik <div id='wrapper'> atau <div id='outer-wrapper'> atau Ini Minisite Bootstrap <div class='container'>
8. Letakkan Kode Status Puasa Di Bawah <div id='wrapper'> atau <div id='outer-wrapper'> atau <div class='container'> di bawah
<div class="headerstatuspuasa">
<script src="https://cdn.rawgit.com/songketwarnetma/maharani-site-ma/master/tanggal-ahad.js"></script> 
<script src="https://cdn.rawgit.com/songketwarnetma/maharani-site-ma/master/waktujammenit.js"></script> - 
<script src="https://cdn.rawgit.com/songketwarnetma/maharani-site-ma/master/statuspuasa.js"></script>
</div>
9. Selesai Klik Simpan Template
10. Lihat Hasil Blog

(VER 3) Cara Memasang Untuk Mobile Di Atas Header Ini Status Puasa Di Blog

1. Masuk Blogger
2. Klik Template
3. Terus Edit HTML
4. Ini CSS VER 2 Sebelum Letakkan Itu Di Atas
5. Terus Cari Ini Ctrl+F
6. Selanjutnya Ketik <div id='wrapper'> atau <div id='outer-wrapper'>
7. Letakkan Kode Status Puasa Di Bawah <div id='wrapper'> atau <div id='outer-wrapper'> di bawah
<b:if cond='data:blog.isMobile'>
<div class="headerstatuspuasa">
Status Puasa : <script src="https://cdn.rawgit.com/songketwarnetma/maharani-site-ma/master/statuspuasa.js"></script>
</div>
</b:if>
8. Selesai Klik Simpan Template
9. Lihat Hasil Blog

(VER 4) Cara Memasang Untuk Mobile Di Atas Fixed Di jQuery Scroll Ini Status Puasa Di Blog

1. Masuk Blogger
2. Klik Template
3. Terus Edit HTML
4. Terus Cari Ini Ctrl+F
5. Terus Ketik </style> atau </head>
6. Letakkan Kode CSS Dibawah </style> Diatas atau </head> Diatas ini Ditambah <style> dan </style>
/* Header Status Puasa */
.headerstatuspuasafixed{background-color: green;left:0px;right:0px;width:100%;top:-100px;color: white;text-align: center;font-size: 20px;position:fixed;transition:all .4s ease-out;z-index: 20000;}
.headerstatuspuasafixed a{color: white; text-decoration:none}
.headerstatuspuasafixed a:visited{color: lightblue}
.headerstatuspuasafixed a:hover{color: lightgreen}
.headerstatuspuasafixed a:active{color: darkgreen}
7. Selanjutnya Ketik </body>
8. Letakkan Kode jQuery Scroll Di Bawah </body> di atas
<b:if cond='data:blog.isMobile'>
<script type='text/javascript'>
//<![CDATA[
$(window).scroll(function(){$(".headerstatuspuasafixed").css($(this).scrollTop()>100?{top:"0px"}:{top:"-100px"})});
//]]>
</script>
</b:if>
9. Selanjutnya Ketik <body>
10. Letakkan Kode Status Puasa Di Bawah <body> di bawah
<b:if cond='data:blog.isMobile'>
<div class="headerstatuspuasafixed">
Status Puasa : <script src="https://cdn.rawgit.com/songketwarnetma/maharani-site-ma/master/statuspuasa.js"></script>
</div>
</b:if>
11. Selesai Klik Simpan Template
12. Lihat Hasil Blog

(VER 5) Cara Memasang Untuk Responsif Di Atas Fixed Di jQuery Scroll Ini Status Puasa Di Blog

1. Masuk Blogger
2. Klik Template
3. Terus Edit HTML
4. Terus Cari Ini Ctrl+F
5. Terus Ketik </style> atau </head>
6. Ini CSS VER 4 Sebelum Letakkan Itu Di Atas
7. Letakkan Kode Responsif Untuk Tablet dan Phone Dibawah </style> Diatas
@media only screen and (min-width: 768px) {
.headerstatuspuasafixed{display: none;}
}
8. Selanjutnya Ketik </body>
9. Letakkan Kode jQuery Scroll Di Bawah </body> di atas
<script type='text/javascript'>
//<![CDATA[
$(window).scroll(function(){$(".headerstatuspuasafixed").css($(this).scrollTop()>100?{top:"0px"}:{top:"-100px"})});
//]]>
</script>
10. Selanjutnya Ketik <body>
11. Letakkan Kode Status Puasa Di Bawah <body> di bawah
<div class="headerstatuspuasafixed">
Status Puasa : <script src="https://cdn.rawgit.com/songketwarnetma/maharani-site-ma/master/statuspuasa.js"></script>
</div>
12. Selesai Klik Simpan Template
13. Lihat Hasil Blog

Selamat Mencoba, Selamat Menunaikan Ibadah Puasa

Referensi: http://paket-r-l-intan-brov2.blogspot.co.id/2016/05/cara-memasang-status-puasa-di-blog.html
Anime :
Facebook twitter Google

Related Post

Berlangganan update artikel terbaru via email:

0 Komentar