NEWS
Loading...
  • Posted by : Johanes Djogan 24 Mei 2013



    Hello teman-teman,pada kesempatan ini,akhirnya ada waktu luang untuk membuat template blogger lagi.Tema dari template ini adalah Kurumi Tokisaki yang merupakan tokoh karakter dalam sebuah Anime "Date A Live" dan juga kurumi merupakan tokoh favorite saya~xD
    sedikit tentang kurumi;Kurumi sendiri mempunyai karakter yang bisa dibilang susah ditebak,bisa kawaii,psycho,Gothic Lolita dan kurumi adalah spirit yang paling berbahaya,karena diduga telah banyak menjatuhkan korban lebih dari 10.000 orang. wow xD


    PV


    Selanjutnya mengenai template ini,Template sederhana dengan 2 kolom posting,2 sidebar dan dilengkapi Popular post widget dengan thumbnail.
    Pada template ini,seperti biasa saya selalu mencoba membuat style yang baru,keunikan itu terletak pada style posting yang jarang ditemui oleh blogger template lain.jika kita arahkan kursor pada posting,gambar pada posting akan membesar dengan efek transisi css3,dan deskripsi posting akan hilang lalu menampilkan tanggal posting,penulis blog,jumlah komentar dan kategori posting.awalnya pada template ini,backgroundnya menggunakan gambar/pattern,tetapi karena saya rasa tidak cocok,jadi saya menggunakan css3 gradient untuk diterapkan sebagai background pada template ini,bagi teman teman yang masih tidak tahu cara mengganti warna/jenis background(gambar,warna solid,gradient) bisa dibaca dibawah postingan ini.

    Screenshot




    1. Pengaturan menu
    Buka blogger,pilih menu template=> Edit HTML lalu cari kode html yang seperti dibawah ini.
    setelah itu ganti tanda pagar '#' (tanpa tanda petik) dengan ulr/alamat link yang ingin dituju,dan ganti juga nama linknya.


    Contoh:
    <li><a href='http://www.facebook.com'>Facebook</a></li>



    <ul class='dark_menu'>
    <li><a class='selected' expr:href='data:blog.homepageUrl' title='Home'>Home</a></li>
    <li data-role='dropdown'><a href='#'>About</a><ul>
    <li><a href='#'>Lorem Ipsum</a></li>
    <li><a href='#'>Lorem Ipsum</a></li>
    <li><a href='#'>Lorem Ipsum</a></li>
    <li><a href='#'>Lorem Ipsum</a></li>
    <li><a href='#'>Lorem Ipsum</a></li>
    </ul></li><li data-role='dropdown'><a href='#'>Contact</a><ul>
    <li><a href='#'>Lorem Ipsum</a></li>
    <li><a href='#'>Lorem Ipsum</a></li>
    <li><a href='#'>Lorem Ipsum</a></li>
    <li><a href='#'>Lorem Ipsum</a></li>
    <li><a href='#'>Lorem Ipsum</a></li>
    </ul></li>
    <li data-role='dropdown'><a href='#'>Download</a><ul>
    <li><a href='#'>Lorem Ipsum</a></li>
    <li><a href='#'>Lorem Ipsum</a></li>
    <li><a href='#'>Lorem Ipsum</a></li>
    <li><a href='#'>Lorem Ipsum</a></li>
    <li><a href='#'>Lorem Ipsum</a></li>
    </ul></li>
    <li><a href='#'>Report</a></li>
    <li><a href='#'>Anime</a></li>
    </ul>


    Jika kamu ingin menambahkan menunya,tambahkan kode html dibawah ini diantara/didalam kode html
    <ul class='dark_menu'> ....</ul>

    Single menu
    <li class='jolor'><a href='#'>namalink</a></li>


    Dropdown menu
    <li class='jolor' data-role='dropdown'><a href='#'>link kamu</a><ul>
    <li><a href='#'>Lorem Ipsum</a></li>
    <li><a href='#'>Lorem Ipsum</a></li>
    <li><a href='#'>Lorem Ipsum</a></li>
    <li><a href='#'>Lorem Ipsum</a></li>
    <li><a href='#'>Lorem Ipsum</a></li>
    </ul></li>


    2. Setting SEO/Meta tag

    setting manual oleh pengguna mengenai deskripsi dan keyword blog anda.
    *ganti text yang berwarna merah
    <meta content='deskripsi blog kamu' name='DESCRIPTION'/>
    <meta content='keyword blog kamu' name='KEYWORDS'/>


    Untuk pengertian setting seo/meta tag,anda bisa cari tahu di google atau disini dan disini




    3. Setting Social media : facebook, Twitter, Rss,Pinterest.
    *ganti url linknya
    <a href='http://feeds.feedburner.com/alamat_feed_rss'><div class='rssjo'/></a>
    <a href='http://twitter.com/username'><div class='twitterjo'/></a>
    <a href='http://www.facebook.com/halaman_fan_page_facebook'><div class='facebookjo'/></a>
    <a href='http://www.pinterest.com/id%20kamu'><div class='pinterestjo'/></a>


    Tertarik dengan Template Kurumi Tokisaki Blogger Template?
    Silakan dicoba dan selalu ingat anda menggunakan template ini,selalu backup template lama anda agar tidak terjadi sesuatu yang tidak diinginkan.Terima kasih


    4. Cara mengganti background gradient.


    cari css dibawah ini
    body {
    margin: 0 auto;
    padding: 0px 0px 0px 0px;
    background: rgb(226,220,222); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(226,220,222,1) 0%, rgba(34,34,34,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(226,220,222,1)), color-stop(100%,rgba(34,34,34,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(226,220,222,1) 0%,rgba(34,34,34,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(226,220,222,1) 0%,rgba(34,34,34,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(226,220,222,1) 0%,rgba(34,34,34,1) 100%); /* IE10+ */
    font-family: 'Open Sans', sans-serif;
    color: #222;
    overflow-x: hidden;
    font-size: 13px;
    }


    Jika kalian perhatikan 6 css background diatas,masing" mempunyai fungsi untuk browser tertentu,mengapa?karena tidak semua css dapat bekerja baik pada seluruh browser,oleh karena itu,jika klian ingin mengganti background,kalian bisa menggunakan cara dibawah ini,Contoh:


    1. background warna solid:
    dengan hexa:
    background:#000;

    dengan rgba:
    background:rgba(255,255,255,1);

    2. background dengan gambar:
    background:url(http://alamatgambar.jpg);

    3.Background dengan Gradient.
    kalian bisa menggunakan css gradient generator.
    http://www.colorzilla.com/gradient-editor/

    -Lebih lanjut mengenai background,kalian bisa baca artikel ini:
    http://djogzs.blogspot.com/2010/11/tips-memilih-warna-design-blog.html

    -Mengenai rgba color
    http://djogzs.blogspot.com/2012/01/tips-design-menggunakan-css3.html


    Intinya,untuk mengganti warna,kalian hanya harus mengganti kode hexa warnanya,begitu juga paga rgba color :)







    *Bonus PSD File Header Kurumi~xD


    Semoga bermanfaat untuk semuanya ^^ ,tapi tetaplah ingat,selalu bijak menggunakan template gratis dan STOP aksi PLAGIAT ,karena itu perbuatan yang merugikan dan sungguh memalukan. Sankyuu minna-san~


    Note:
    -Saya tidak bertanggung jawab atas kerusakan/crash karena pengeditan template yang anda lakukan.

    Sebelum mencoba template ini,ada baiknya anda membaca kebijakan menggunakan template disini.

    http://djogzs.blogspot.com/p/privacy-policy-kebijakan-privasi.html


    { 108 comments... read them below or Comment }

    1. Balasan
      1. palingan .. kalo gw bilang "dy, kalo bang jo updet lagi bilang ya" pasti bakal komen pertamax dlo baru kasih tau =,="

        Hapus
    2. Nggk Ada Template Devil Survivor 2...??

      BalasHapus
      Balasan
      1. kalo mau ganti aja header sama warnanya jadi deh DEVIL SURVIVOR 2 :v

        Hapus
      2. cara ganti headernya mah gampang,cari css headernya,terus ganti urlnya

        Hapus
      3. ndy, tipsmu sungguh berguna buat ku :v

        Hapus
      4. bang Jo .. shingeki no kyojinnya xD

        Hapus
    3. Komentar ini telah dihapus oleh pengarang.

      BalasHapus
    4. Komentar ini telah dihapus oleh pengarang.

      BalasHapus
    5. cara ngatur banyak postnya gimana gan, kok waktu aku pakek template buatan agan postnya cuma muncul 2 post aja !

      balas ya gan, masih newbie nih gue !!!!

      BalasHapus
    6. cara ngatur banyak postnya gimana gan, kok waktu aku pakek template buatan agan postnya cuma muncul 2 post aja !

      balas ya gan, masih newbie nih gue !!!!

      BalasHapus
      Balasan
      1. setting=>post and comments,nanti tinggal isi mau berapa post yang mau ditampilkan.

        Hapus
    7. wew keren, ane tunggu link downloadnya


      Kunjungan Rutin Sobat, Jangan Lupa Kunjungan Baliknya....

      :D

      Salam Dari Sirau News | Blogger Pemula Berbagi

      BalasHapus
    8. wah akhirnya mas djogzs buat template baru seperti biasa keren temolatenya. salam dari pengemar template buatan mas

      BalasHapus
    9. mantaaaff...

      kunbal dong fachrul-gallery.blogspot.com :v

      BalasHapus
    10. Bang jo, Foto Post emang kecil ya? Ato bisa di Resize manual? :v

      Thanks, ada rencana edit sendiri Template Kurumi eh uda muncul diluan karya bang Jo XD Keren pula tuh...

      Salam dari AAO

      http://animeartonline.blogspot.com/

      BalasHapus
    11. bang jo cara ngatur backgrounnya gmna? background punya ku gk jadi satu.. malah semakin postingan panjang semakin banyak.. :v

      tolong dong bang jo jelasin.. ^^

      BalasHapus
    12. Komentar ini telah dihapus oleh pengarang.

      BalasHapus
    13. bang jo bisa di cek disini http://dcs-xp.blogspot.com/ background nya gk nyatu

      BalasHapus
    14. ini dia yang kutunggu-tunggu. :)
      Sip Bang jo..

      BalasHapus
    15. kebanyakan yang memakai kostum Gothic Lolita semanis itu memang serem serem karakterna -_-

      #gothic lolita diambil dari baju gothic yang berasal dari film drakula *bagi info

      thanks dah bang templatena, sungguh mantap!

      BalasHapus
    16. admin ketagihan date a live hahaha :D

      BalasHapus
    17. How can i replace the Pinterest icon into a g+ icon?

      BalasHapus
      Balasan
      1. search this css.

        .pinterestjo{
        background: #B12D3B url("http://2.bp.blogspot.com/-9piAQfPmxa8/UZ-rdm96t7I/AAAAAAAAGKw/BZQeZleoZhI/s1600/white_pinterest.png")no-repeat center center;}


        and change url http://2.bp.blogspot.com/-9piAQfPmxa8/UZ-rdm96t7I/AAAAAAAAGKw/BZQeZleoZhI/s1600/white_pinterest.png

        Hapus
    18. kudet kudet eh ada bal bal nyess
      :v numpang lewat header templatenya bagus tuh :P

      BalasHapus
    19. templatenya keren gan.. langsung sedot :)

      BalasHapus
    20. Mampir ke 1DragonNando.blogspot.com Guys :)

      BalasHapus
    21. how to get the black background behind social networks??

      como tirar o fundo preto atrás das redes sociais??

      BalasHapus
      Balasan
      1. .jorib {
        position: absolute;
        right: 34px;
        width: 185px;
        height: 42px;
        top: -326px;
        background: #222;
        z-index: 9;
        padding: 5px;
        border-radius: 5px 5px 5px 5px;
        border: 1px solid #222;
        box-shadow: inset 0 0px 5px rgba(0, 0, 0, 0.8);
        }

        just change code hex background :)

        Hapus
    22. Ini kenapa fungsi boldnya endak bisa dipakai -_-

      BalasHapus
    23. gan,ini kalo buat masang widget chatango bisa full gk?takutnya gk bisa

      BalasHapus
      Balasan
      1. bisa aja kq,tinggal diatur lebar widget chatnya

        Hapus
      2. kalo ganti fontnya header,dimananya om?

        Hapus
    24. kalo mau ganti header nya gmn cranya om?

      BalasHapus
      Balasan
      1. Iya susah banget sekarang ganti header.,
        bantuin bang joe

        Hapus
      2. tinggal gati url gambarnya aja kq


        #header {
        position: relative;
        margin: auto;
        overflow: hidden;
        width: 100%;
        height: 350px;
        background: url(http://2.bp.blogspot.com/-V4TWZw2erbo/UZ9rFF9jSZI/AAAAAAAAGKg/fxss6LiFhrk/s1600/Header-kurumi.jpg) no-repeat top left;
        border: 1px solid #ddd;
        box-shadow: 26px 15px 15px rgba(0, 0, 0, 0.15), -26px 15px 15px rgba(0, 0, 0, 0.15);
        }

        Hapus
      3. klo gradient nya mau di ilaging gimana?

        Hapus
      4. Ribet om,
        sebenernya, ukuran gambar headernya berapa sih?
        yang ukuran header kurumi .psd itu ya? 1120px X 350px
        tapi, pas dipasang, kok kekecilan ?

        Hapus
    25. bang joe, request template dragon ball donk

      BalasHapus
    26. Apakah anda tau cara memasang Hero Slider?

      BalasHapus
    27. gan,ganti background widget seperti followers itu gimana?

      BalasHapus
    28. Bang,untuk nambahin tulisan melayang di popular post itu gimana bang,yang kayak di tamplate date a live,soalnya nih template g'ada fitur kyk gitu...
      mohon pencerahannya....
      Arigatougozaimasu...

      BalasHapus
    29. kaka saya pakai template ini tapi populer postnya kok tidak muncul.. itu knapa yaah??
      nih link blog saya : http://www.the-avangerz.com/

      BalasHapus
    30. Komentar ini telah dihapus oleh pengarang.

      BalasHapus
    31. bang biar isi tulisan kayak Anime Blogger template gimana caranye ?

      BalasHapus
    32. kurumi is the one of yandere character in date a live, templatenya juga

      BalasHapus
    33. mau request bayar boleh enggak bang johanes?

      BalasHapus
    34. Cara Ngilangin Auto Sumbernya Gimana bang ???

      BalasHapus
      Balasan
      1. Pas Aku Nge Copy Di Blogku Kok Langsung Ada Sumbernya ??? Nah, Cara Ngilainginnya Gimana Sob ???

        Hapus
    35. Sob, di popular post gw ada yg error waktu mau nampilin full 10 pop post. kapan udh di setting 10 yg keluar 9 di setting 5 keluarnya 4 gitu.. kode apa yg kira2 ilang atau settingannya diganti gimana biar sip pas 10 di bagian atasnya :)

      Ini blog gw http://sophieriswandono.blogspot.com/ | Thx before sob :)

      BalasHapus
      Balasan
      1. popularpost itu sama aja kq kaya popular post biasa,memang bawaan dari blogger,settingnya sama saja,buka dari edit widget di layout blogger.

        tinggal atur mau nampilin berapa.

        Hapus
      2. Nah itu dia sob, perasaan gw kmrn2 juga nongol full 10 tapi kok tiba2 entah kenapa sekarang malah cuma nongol 9 doang..

        Oke deh gw coba2 lagi, thx bro :D

        Hapus
    36. Jadi terlihat kecil tampilan postingannya bang:3

      BalasHapus
    37. Hi!

      How can I remove the pagination navbar from pages?

      Thank you for this beautiful theme.

      BalasHapus
    38. misi, mau nanya. kok blog ane di bagian popular post yang keluar cuman tulisan doang?? gak ada gambarnya?? #butuh pencerahan dari agan" yang udah lebih tau.. tolong dibalas T^T
      thx

      BalasHapus
    39. as removing the black box of the comments?

      BalasHapus
    40. yang tulisan merah di suruh ganti "deskripsi anda" itu buat di bagian mana ?

      BalasHapus
      Balasan
      1. Itu untuk SEO, biar gampang keindex di google

        Hapus
    41. Izin redesign ya..hak cipta pasti ane taro kok..

      BalasHapus
    42. Cara mengecikan ukuran tulisan headernya gimana ya?

      BalasHapus
    43. Komentar ini telah dihapus oleh pengarang.

      BalasHapus
    44. Komentar ini telah dihapus oleh pengarang.

      BalasHapus
    45. kakak. saat saya buat laman kosong lalu saya publikasikan, sidebar sebelah kirinya kok hilang???
      mohon pencerahannya...

      BalasHapus
    46. Reup the image PSD and template please TT¬TT

      BalasHapus
    47. Gan,
      Templatenya tolong upload ulang dong.. T_T
      Onegaii.. m(_ _)m

      BalasHapus
    48. Linknya Rusak Gan... Reupload Gan... Pleasee... :3

      BalasHapus
    49. re upload please kak T^T ini keren banget

      BalasHapus
    50. Komentar ini telah dihapus oleh pengarang.

      BalasHapus
    51. kakak jo, bisa di re-upload ngak? karena linknya sudah di taken down oleh remove media LLC T_T , ane suka dengan ini template >_<

      BalasHapus
    52. Tolong Di Reupload dong min
      Bagus Nih Template nya

      BalasHapus

    "Maaf komentar anda tidak akan dibalas, karena blog ini sudah tidak aktif. Terima kasih"

    "Sorry your comment will not be replied, because this blog has been inactive. Thank you"

  • Translate

    Thank you for choosing Blogger Template from Blog Johanes! (*≧∇≦*)

    - Copyright ©DJogzs 2009-2013 - Some Right Reserve. - DJogzs - Powered by Blogger - Designed by Johanes Djogan -