Download Template Dafin Blogger versi belajaran

DB Template sitemap

Salam sahabat bogger terimakasih sudah berkunjung sebelumnya, saya ingin membagikan template blog saya ini yang dulu pernah saya gunakan template bikinan pertama belajar, walaupun masih banyak yang perlu di benahi silahkan sobat lakukan sendiri dengan sesuka hati sesuai dengan kreasi. untuk tampilan dan fitur silahkan lihat langsung demonya.



sedikit fitur ada yang ada di template ini adalah sudah saya berikan tooltip, bloked link spam pada komentar dan animasi loading sebagai hiasan. di bawah ini merupakan potongan javascruptnya..

1code-line:1-12code-line:1-23code-line:1-34code-line:1-45code-line:1-56code-line:1-67code-line:1-78code-line:1-89code-line:1-910code-line:1-1011code-line:1-1112code-line:1-1213code-line:1-1314code-line:1-1415code-line:1-1516code-line:1-1617code-line:1-1718code-line:1-1819code-line:1-1920code-line:1-2021code-line:1-2122code-line:1-2223code-line:1-2324code-line:1-2425code-line:1-2526code-line:1-2627code-line:1-2728code-line:1-2829code-line:1-2930code-line:1-3031code-line:1-3132code-line:1-3233code-line:1-3334code-line:1-3435code-line:1-3536code-line:1-3637code-line:1-3738code-line:1-3839code-line:1-3940code-line:1-4041code-line:1-4142code-line:1-4243code-line:1-4344code-line:1-4445code-line:1-4546code-line:1-4647code-line:1-4748code-line:1-48<script type='text/javascript'>
//<![CDATA[  
$(document).ready(function() {
// Tooltip only Text
$('.db-tooltip').hover(function(){
        // Hover over code
        var title = $(this).attr('title');
        $(this).data('tipText', title).removeAttr('title');
        $('<p class="db-simple-tooltip"></p>')
        .text(title)
        .appendTo('body')
        .fadeIn('slow');
}, function() {
        // Hover out code
        $(this).attr('title', $(this).data('tipText'));
        $('.db-simple-tooltip').remove();
}).mousemove(function(e) {
        var mousex = e.pageX + 20; //Get X coordinates
        var mousey = e.pageY + 10; //Get Y coordinates
        $('.db-simple-tooltip')
        .css({ top: mousey, left: mousex })
});
});
//]]>
</script>
<script type='text/javascript'>
//<![CDATA[
function blockLinks(parentID, children) {
    var parent = document.getElementById(parentID),
        content = parent.getElementsByTagName(children);
    for(var i = 0; i < content.length; i++) {
        if(content[i].innerHTML.indexOf('</a>') !== -1) {
          content[i].innerHTML = "<mark>Bloked link!!!</mark> Jangan komentar spam broo baca <a href=\'/p/tata-cara-berkomentar-yang-baik.html\' target=\'_blank\'>disini<\/a> aturannya...!!!";
            content[i].className = "deteksi-spam";
        }
    }
}
blockLinks('comment_block', 'p');
//]]>
</script>
<script type='text/javascript'>
//<![CDATA[
$(document.body).append('<div id="efek-load-db">Sedang Memuat...</div>');
$(window).on("beforeunload", function() {
    $('#efek-load-db').fadeIn(1000).delay(6000).fadeOut(1000);
});
//]]>
</script>

di oprek aja sob kalau ada pertanyaan silahkan tulis di komentar, semoga berguna buat sobat....

Artikel Terkait

  • Membuat ucapan terimakasih di bawah komentar
    Pagi sobat blogger lagi liburan buat posting hiasan untuk blogger, kali ini saya mau share cara dan trik untuk membuat pesan ucapan terimakasih di bawah kotak komentar.   Triknya cukup mudah tinggal menambahkan css dan sedikit kode html di template sobat, langsung aja berikut ini caranya Buka editor template blogger anda sperti bias…
  • Kalimaz Responsive Magazine template
    Kalimaz Responsive Magazine template Demo | Download | Setup Template Platform Blogger / Blogspot Nama Template Kalimaz Responsive Magazine blogger template DesignerUong Jowo Instalasi Template- KeteranganTemplate Free Fiture Tempalte Responsive Desain header background slide 3 Kolom Magazine Konten Media Dan F…
  • Membuat thumbnail hanya tampil di homepage
    Untuk sahabat yang belum tahu bagaimana menerapkan trik dan cara ini mungkin sering punya pertanyaan, kok bisa ya ketika di halaman beranda/depan/homepage blog image/gambarnya muncul tetapi ketika di halaman posting kok hilang...?, mungkin ini bukan bahasan baru lagi, hanya saja saya menulis ini untuk sobat yang ingin tahu trik dan caranya. ji…
  • Blogger Template DB-KW01
    Salam buat sobat yang berkunjung ke blog sederhana saya ini, kali ini saya akan membagikan template replika blog ini kepada sobat semua, bisa di bilang bukan replika karena seluruh markup template ini sama dengan template yang di gunakan oleh blog ini hanya saya berbeda tampilan dan fitur. Demo Download Dalam template ini sudah mem…
  • Membuat posting di homepage warna warni
    salam sahabat blogger yang ganteng - ganteng dan cantek, kali ini saya mau share tentang cara bagaimana agar tampilan postingan di halaman depan atau homepage kita bisa berwarna warni. buat sobat blogger yang tertarik dengan tampilan ini dan ingin memasang di blognya agar tampil menarik tanpa mengganti template silahken di coba dan di kreasika…
  • Memasang meta viewport
    Membahas responsive memang agak panjang lebar, dan perlu di pelajari satu persatu. untuk itu kali ini saya akan berbagi tentang kegunaan menggunakan meta tag viewport dalam responsive. Dalam Responsive Meta Tag Viewport sangat penting karena meta tag ini berguna untuk menentukan tata letak tampilan Mobile. ketika blog kita di akses lewat Brows…

17 komentar

  1. Keren sob, izin download yahh :D

    BalasHapus
  2. wah mntab ni gan
    visit back ya gan klu ad wktu

    BalasHapus
  3. sudah saya kasih link downlod sob :-bd

    BalasHapus
  4. bagus gan template nya. tapi lebih bagus template agan yang ini :D

    BalasHapus
    Balasan
    1. kalo mau template yang ni nunggu saya bosen dlu :p

      Hapus
  5. boleh juga nih templatenya, saya koleksi dulu ya biar bisa dicoba-coba dulu.

    Makasih mas.

    BalasHapus

Link aktif dalam komentar akan terhapus secara otomatis.
Untuk menyisipkan kode, gunakan tag <i rel="code">...KODE ANDA DI SINI...</i>
Untuk menyisipkan script, gunakan <i rel="pre">...KODE SCRIPT ANDA...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">...URL GAMBAR ANDA ...</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">...JUDUL ANDA...</b>
Untuk menyisipkan catatan, gunakan tag <b rel="quote">...CATATAN ANDA...</b>
Untuk menciptakan efek tebal gunakan tag <b>...TEKS ANDA...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>...TEKS ANDA...</i>

Konversi KodeOOT
:) :( =( :wa: :s ^_^ :D =D ^:D @@, ;) :-bd :-d :ya: :'( T_T :\ :p B) :Q :Ozz 7:( \o/ **p
Jika anda memiliki bahasan atau topik lain yang sama sekali tidak ada hubungan dengan tutorial diatas anda bisa menyampaikannya di halaman OOt. klik [link ini] untuk membuka halaman OOT.

Back to Top
Loading...