Sebenarnya. kamu dapat membeli template seperti Dea ini ke mbak arlina disini. dan tentu kamu sudah mendapatkan fasilitas Notifikasi tersebut dan kamu dapat mempelajari strukturnya.
sebenarnya. Dea hanya ingin membagikan cara ini karena memang Dea ingin aar kamu tau saja. tentu jika ingin seluruh fasilitas pada template Asal Seo Responsive. mau tidak mau kamu harus membeli template tersebut untuk menghormati pembuatnya. nah dibawah ini Dea akan berikan cara agar kamu dapat membuatnya dan memasangnya tepat pada menu navigasi kamu.
2. Jika sudah maka pergi ke tab/menu "Tema" dan click tombol "Edit HTML"
3. jika sudah disini. carilah code </Style>. lalu pastekan code dibawah ini tepat diatas code </Style> tersebut :
4. Setelah itu masukan text javascript dibawah ini tepat dibawah code //<![CDATA[ :
5. Yaitu langkah terakhir. disini buatlah sebuah widget/gadget baru dengan cara pergi ke menu/tab "Tata Letak/Layout" Setelah Itu click tulisan "Add Gadget/Tambahkan Widget". lalu akan muncul kotak tabel. disini pilih "HTML/JavaScript". maka Copy dan pastekan code dibawah ini. tepat pada kotak kolom besar tersebut :
Enjoy. Sekarang cobalah untuk mengetestnya terlebih dahulu. Bisa? jika bisa selamat. jika masih ada kesalahan. tanyakan pada kolom komen dibawah ini.
sebenarnya. Dea hanya ingin membagikan cara ini karena memang Dea ingin aar kamu tau saja. tentu jika ingin seluruh fasilitas pada template Asal Seo Responsive. mau tidak mau kamu harus membeli template tersebut untuk menghormati pembuatnya. nah dibawah ini Dea akan berikan cara agar kamu dapat membuatnya dan memasangnya tepat pada menu navigasi kamu.
Step By Step :
1. Masuklah ke akun blogger kamu terlebih dahulu disini2. Jika sudah maka pergi ke tab/menu "Tema" dan click tombol "Edit HTML"
3. jika sudah disini. carilah code </Style>. lalu pastekan code dibawah ini tepat diatas code </Style> tersebut :
/* Modal Box */
.asalseonotif,.matilampu{visibility:hidden;opacity:0}.asalseonotif{background:#fff;position:fixed;padding:25px;top:20%;transform:scale(1.2);max-width:450px;margin:auto;left:0;right:0;z-index:100;border-radius:4px;box-shadow:0 10px 3rem -1rem rgba(0,0,0,0.5);transition:all .5s}.asalseonotif button{border:none;position:absolute;margin-top:17px;right:30px;cursor:pointer;background:#e8e8e8;padding-left:7px;outline:0}a.waves-light.close-sf{background:#2ecc71;color:#fff;margin-top:15px;display:inline-block;padding:6px 13px;border-radius:3px;float:right;font-size:13px}a.waves-light.close-sf:hover{background:#2bc063;color:#fff}.matilampu{position:fixed;top:0;background:rgba(255,255,255,0.39);left:0;right:0;bottom:0;margin:0;z-index:99;transition:all .4s ease-in-out}.asalseotitle{margin-bottom:15px;font-weight:600}.asalseonotif.aktif,.matilampu.aktif{visibility:visible;opacity:1}.asalseonotif.aktif{transform:scale(1)}.icx{position:absolute;top:10px;right:15px;transform:rotate(180deg);transition:all .3s}.icx:before{content:'\f00d';font-family:fontawesome;font-size:18px;color:#ccc;transition:all .3s}.icx:hover{transform:rotate(360deg)}.icx:hover:before{color:#222}.notiftext{font-size:14px}a.shownotif{background:#f39c12;color:#fff;font-size:16px;padding:0;position:absolute;right:80px;top:15px;width:35px;height:35px;line-height:35px;text-align:center;border-radius:99em;transition:all .3s}a.shownotif:hover{background:#e67e22;color:#fff}
#menuheady.aktif,#pagepix.aktif,#downpix.aktif{filter-blur(4px):;-webkit-filter:blur(4px)}
@media screen and (max-width:768px){.asalseonotif,a.shownotif,.matilampu{display:none}}
// Modal box
$(document).ready(function(){$(".close-sf").click(function(){$(".asalseonotif,.matilampu,#menuheady,#pagepix,#downpix").removeClass("aktif")})}),$(document).ready(function(){$(".shownotif").click(function(){$(".asalseonotif,.matilampu,#menuheady,#pagepix,#downpix").toggleClass("aktif")})});
<div class='asalseonotif'>
<div class='asalseotitle'>Notification</div>
<div class='notiftext'>
Nandea Bunga </div>
<a class='waves-effect waves-light close-sf' href='javascript:;' title='Done'>Done</a>
<a class='waves-effect icx close-sf' href='javascript:;'/>
</a></div>
<div class='matilampu'/></div>
Enjoy. Sekarang cobalah untuk mengetestnya terlebih dahulu. Bisa? jika bisa selamat. jika masih ada kesalahan. tanyakan pada kolom komen dibawah ini.