Cara Membuat Permalink Keren Di Bawah Postingan Blog

Cara Membuat Permalink Keren Di Bawah Postingan Blog

Setelah lama saya tidak update, kali ini saya akan berbagi kepada kalian sebuah tutorial blogger tentang bagaimana cara membuat permalink keren di bawah postingan blog. Permalink ini akan sangat bermanfaat bagi blog dan visitor kita. Sebenarnya saya mendapatkan tutorial ini dari blog teman saya Ne-Gen. Kemudian saya sempurnakan lagi. Pertama, kalian harus tahu terlebih dahulu apa yang saya maksud dengan permalink itu. Jika kalian belum tahu, kalian bisa melihat demonya di link di bawah ini :

Demo

Bagaimana? Pada halaman tersebut di akhir postingan terdapat permalinknya bukan? Apakah kalian tertarik membuatnya? Oke, langsung saja. Berikut ini adalah cara membuatnya :
  • Seperti biasa, pertama buka dasboard blog kalian.
  • Masuk ke Tata Letak dan edit widget postingan untuk mengaktifkan rating bintangnya (Kalian bisa melewati langkah ini).
  • Jika sudah kalian aktifkan, kemudian masuk ke Template, kemudian pilih Edit HTML.
  • Cari kode ]]></b:skin>.
  • Masukkan kode di bawah ini tepat di atas kode ]]></b:skin> :
.yondafuq-Permalink{
    display:block;
    width:auto;
    height:135px;
    background:#ffffff;
    border:5px solid #1c6beb;
    padding:0px;
    margin:30px 0px 10px 0px;
    color:#000;
    }
    .yondafuq-Permalink .kontainer{padding:5px;}
    .NEGen-Permalink h4{
    background:#ffffff;
    border:none;
    border-bottom:5px solid #1c6beb;
    color:#000000;
    padding:5px 10px;
    margin:0px 0px 0px 0px;
    display:block;
    }
    .yondafuq-Permalink h4 a{color:#1c6beb;}
    .yondafuq-Permalink img{
    width:86px;
    height:86px;
    margin:0px 10px 0px 0px;
    float:left;
    border:1px solid #1c6beb;
    padding:2px;
    background:#1c6beb;}
Keterangan :
Kode yang berwarna PINK adalah kode lebar. Kalian bisa menggatinya sesuai keinginan.
Kode yang berwarna ORANGE adalah kode tinggi. Kalian bisa menggatinya sesuai keinginan.
Kode yang berwarna KUNING adalah kode background. Kalian bisa menggatinya sesuai keinginan.
Kode yang berwarna HIJAU adalah kode garis border. Kalian bisa menggatinya sesuai keinginan.
Kode yang berwarna UNGU adalah kode jarak margin. Kalian bisa menggatinya sesuai keinginan.
Kode yang berwarna CYAN adalah kode warna text. Kalian bisa menggatinya sesuai keinginan.


  • Belum selesai sampai disini, sekarang cari kode <data:post.body/>.
  • Letakkan kode di bawah ini tepat setelah kode <data:post.body/>:
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='yondafuq-Permalink'>
<h4>Penulis: Yonda Tamvan | Tentang Artikel Ini : </h4>
<div class='kontainer'>
<img src='http://4.bp.blogspot.com/-wEMvurMH1YM/UGLOHpVRZdI/AAAAAAAABAs/KZa_BusWG6M/s220/untitled122.PNG'/>
Viewed Article: <script src='http://amitjain.in/pageviews.php' type='text/javascript'/>.<br/>Posting Name: <strong><a expr:href='data:post.url'><data:post.title/></a></strong>.<br/>Url:<strong><data:post.url/></strong>.<br/><b:if cond='data:top.showStars'>
<div expr:g:background-color='data:backgroundColor' expr:g:text-color='data:textColor' expr:g:url='data:post.absoluteUrl' g:height='40' g:type='RatingPanel' g:width='200'/>
</b:if>
<div style='clear:both;'/>
</div>
</div>
</b:if>
  • Kalian ganti kode yang bercetak TEBAL dengan nama atau kata-kata kalian sendiri dan kode bercerak MIRING dengan link gambar kalian.
  • Terakhir tinggal kalian simpan.
Bagaimana? Berhasil? Sekian artikel saya kali ini. Semoga bermanfaat bagi kita semua, Jangan lupa untuk mampir ke blog ini lagi dan klik tombol like di bawah ini.

Cara Membuat Headline Latest Post Di Blog

Cara Membuat Headline Latest Post Di Blog

Sudah lama saya tidak update lagi, kali ini saya akan berbagi kepada kalian sebuah tutorial blogger tentang bagaimana cara membuat headline latest post (Breaking News) di blog. Kalian pasti sudah tahu apa yang saya maksud dengan headline latest post ini. Jika belum, headline yang saya maksud ini adalah widget yang akan menampilkan postingan terbaru blog kalian. Fungsinya sama seperti recent post, namun headline ini berbentuk horisontal dan biasanya diletakkan di header blog. Jika masih bingung, kalian bisa melihat demonya di link di bawah ini :

Bagaimana? Kalian tertarik? Tenang saja, cara membuatnya sangat mudah dan headline ini tidak akan terlalu memperlambat blog kalian atau bisa disebut ringan. Oke, langsung saja. Berikut ini adalah cara membuatnya :

  • Seperti biasa, masuk ke dasboard blog kalian.
  • Masuk ke pilihan Tata Letak (Layout).
  • Kemudian klik Tambah Gadget (Add a Gadget). Jika ada banyak, klik salah satu. Yang mana saja tidak masalah. Namun saya sarankan untuk meletakannya di paling atas, supaya lebih cepat diload.
  • Pilih yang  HTML/JavaScript.
  • Kosongkan saja judulnya dan masukkan kode di bawah ini pada konten :
<style type='text/css' scoped="scoped">
#news { background:#2980b9; border-bottom: 5px solid #2c3e50; border-top: 5px solid #2c3e50; display: block; float: left; height: 20px; line-height: 20px; overflow: hidden; padding: 5px 30px; width: 100%; position: fixed; top: 0px; left: 0px; }
.titlenews { background:#2c3e50; color: #fff; display: block; float: left; font: bold 12px/22px Tahoma; padding: 9px; margin-top: -10px; position: absolute; }
#ltsposts { float: left; margin-left: 120px; }
#ltsposts ul,#ltsposts li{list-style:none;margin:0;padding:0;}
#ltsposts li a { background: none !important; #2c3e50 !important; font: bold 12px/22px Tahoma; text-decoration: none; }
ul.shsocial { background:#2c3e50; float: right; margin: -8px 0; }
ul.shsocial li {float:left;list-style: none outside none;border:none;}
ul.shsocial li a{background-color:transparent;background-image:url(http://4.bp.blogspot.com/-Pe-J5S7YCa0/UdXsJoN7GLI/AAAAAAAAL68/ongZAtcNF1E/s1600/spice-social-gadget-sprite.png);background-repeat:no-repeat;background-size:auto 96px;border:0 none;color:white;direction:ltr;display:block; height:32px;overflow:hidden;text-align:left;text-decoration:none;text-indent:-999em;transition:all 0.2s ease 0s;width:32px}
ul.shsocial li.fb a{ background-position:0 0}
ul.shsocial li.gp a{ background-position:-96px 0}
ul.shsocial li.rs a{ background-position:-192px 0}
ul.shsocial li.tw a{ background-position:-256px 0}
ul.shsocial li.fb a:hover{ background-position:0 -32px}
ul.shsocial li.gp a:hover{ background-position:-96px -32px}
ul.shsocial li.rs a:hover{ background-position:-192px -32px}
ul.shsocial li.tw a:hover{ background-position:-256px -32px}
</style>
<div id='news'><span class='titlenews'>Latest Post</span>
<div id='ltsposts'>Loading...</div>
<ul class='shsocial'>
<li class='fb'>
<a href='http://www.facebook.com/yondarkness.blog' rel='dofollow' target='_blank' title='facebook'>
</a></li>
<li class='gp'>
<a href='https://plus.google.com/118163047156925704991' rel='dofollow' target='_blank' title='googleplus'>
</a></li>
<li class='tw'>
<a href='http://twitter.com/yondarkness' rel='dofollow' target='_blank' title='twitter'>
</a></li>
<li class='rs'>
<a href='LINK RSS FEED DISINI' rel='dofollow' target='_blank' title='rss'>
</a></li>
</ul>
</div>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function () {
var url_blog = 'http://www.yondarkness.com', // Replace With your Blog Url
numpostx     = 20; // Maximum Post
$.ajax({
    url: ''+url_blog+'/feeds/posts/default?alt=json-in-script&max-results=' + numpostx + '',
    type: 'get',
    dataType: "jsonp",
    success: function(data) {
        var posturl, posttitle, skeleton = '',
            entry = data.feed.entry;
        if (entry !== undefined) {
            skeleton = "<ul>";
        for (var i = 0; i < entry.length; i++) {
                for (var j=0; j < entry[i].link.length; j++)
                {
                     if (entry[i].link[j].rel == "alternate")
                        {
                            posturl = entry[i].link[j].href;
                            break;
                         }
                }              
            posttitle = entry[i].title.$t;
            skeleton += '<li><a href="' + posturl + '" target="_blank">' + posttitle + '</a></li>';
        }
            skeleton += '</ul>';
            $('#ltsposts').html(skeleton);
            function tick(){
            $('#ltsposts li:first').slideUp( function () { $(this).appendTo($('#ltsposts ul')).slideDown(); });
            }
        setInterval(function(){ tick () }, 5000);
        } else {
            $('#ltsposts').html('<span>No result!</span>');
        }
    },
    error: function() {
            $('#ltsposts').html('<strong>Error Loading Feed!</strong>');
       }
});
});
//]]>
</script>
  • Jika sudah, sekarang tinggal tinggal disimpan.
Keterangan :
Kode berwarna PINK adalah kode warna, kalian bisa mengganti dan menyesuaikannya sesuai keinginan kalian.
Ganti kode berwarna BIRU dengan link url Facebook kalian.
Ganti kode berwarna MERAH dengan link url G+ kalian.
Ganti kode berwarna CYAN dengan link url Twitter kalian.
Ganti kode berwarna ORANGE dengan link url Rss blog kalian,
Ganti kode berwarna UNGU dengan link url blog kalian.

Bagaimana? Bisa bukan? Jika ada kesalahan atau error, mungkin karena ada langkah atau kode ukuran yang kurang pas dikarenakan template blog yang berbeda beda. Jika itu terjadi, silakan kalian tanyakan di komentar, jika saya sempat akan saya bantu sebisanya. Sekian artikel kali ini. Semoga bermanfaat. Jangan lupa untuk mampir kembali ke blog sederhana saya ini, tinggalkan komentar, dan klik tombol like di bawah ini.

Cara Menginstall Android Kitkat 4.4-r1 Di PC

Cara Menginstall Android Kitkat 4.4-r1 Di PC

Setelah lama blog ini tidak update lagi karena kesibukan di dunia nyata, kali ini saya akan berbagi kepada kalian sebuah tutorial yang berhubungan dengan Android. Cara menginstall Android Kitkat 4.4-r1 di pc. Sebenarnya sudah banyak beredar cara menginstall Android di pc, namun yang ini adalah versi terbarunya. Saya mendapat tutorial ini dari blog teman saya CahJaya Share. Untuk tutorial yang beredar biasanya hanya bisa menggunakan sd_card max 2gb, sedangkan di tutorial ini kita bisa menggunakan hardisk kalian sampai full juga dual boot. Oke langsung saja.

Pertama kita harus menyiapkan alat bahannya terlebih dahulu. Berikut ini adalah alat dan bahannya :
  1. PC/Laptop.
  2. Image android x86. Kita akan menggunakan yang 4.4-r1. Download disini.
  3. Grub2win untuk dual bootnya. Download disini.
  4. Siapkan partisi untuk Androidnya menggunakan Easus atau aplikasi partisi lainnya.
  5. Rufus. Download yang versi terbaru. Download di sini.
  6. Flashdisk minimal 1gb untuk boot installernya.
Nah, jika sudah lengkap alat dan bahannya, kalian bisa mengikuti langkahnya di bawah ini :
  • Buat terlebih dahulu bootable installernya menggunakan Rufus. Caranya buka Rufus kemudian pilih flashdisknya kemudian klik gambar cd. Pilih image Android x86. Kemudian Start. Dalam hal ini flashdisk kalian akan terformat. Jadi usahakan untuk memback up datanya terlebih dahulu.
  • Matikan pc kalian. Nyalakan lagi dan jangan lupa untuk mengganti bootnya menjadi flashdisk atau saat menyala tekan f10/f12/f2 tergantung pc kalian.
  • Jika muncul Press Any Key, tekan tombol apa saja terserah kalian.
  • Kemudian pilih install di hardisk kalian.
  • Kemudian Create/Modifi. Pilih partisi yang sudah kalian buat dan pilih Write. Hati-hati saat melakukan langkah ini. Salah sedikit maka hardisk kalian bisa terformat.\
  • Ubah formatnya menjadi ext2.
  • Jika muncul Do you want to install bootloader?, pilih No saja.
  • Tunggu sampai selesai. Kemudian restart dan buka windows.
  • Sekarang buat dual bootnya.
  • Extract Grub2win ke C:\.
  • Buka Grub2winnya.
  • Kemudian close.
  • Buka grup.cfg menggunakan Notepad.
  • Pastekan kode di bawah ini tepat di paling bawah :
###Android KitKat###
menuentry "Android KitKat" {
set root='(hd0,3)'
linux /android-4.4-r1/kernel quiet root=/dev/ram0 androidboot.hardware=android_x86 video=-16 SRC=/android-4.4-r1
initrd /android-4.4-r1/initrd.img
}

menuentry "Android KitKat (Debug Mode)" {
set root='(hd0,3)'
linux /android-4.4-r1/kernel quiet root=/dev/ram0 androidboot.hardware=android_x86 video=-16 SRC=/android-4.4-r1 DEBUG=1
initrd /android-4.4-r1/initrd.img
}

### End Android ###
  • Angka yang berwarna MERAH adalah posisi partisi yang tadi terdapat Androidnya. Misalnya saja SDA 5. Maka kita tinggal mengganti 3 menjadi 5.
  • Kemudian save.
  • Restart pc kalian.
  • Kemudian pilih yang Android.
  • Tunggu prosesnya sama seperti Windows.
  • Selesai. Sekarang pc kalian sudah ada Androidnya.
Bagaimana? Membingungkan ya? Sama saya juga bingung. Saya hanya berbagi saja. Jika ada yang kurang jelas, kalian bisa bertanya langsung kepada orangnya Lian CahJaya. Sekian artikel saya kali ini. Semoga bermanfaat. Jangan lupa untuk mampir ke blog sederhana saya ini, tinggalkan komentar, dan klik tombol like di bawah ini.

Download Template Blogger Flat Green Shiba Miyuki Mahouka

Setelah lama saya tidak berbagi template, kali ini saya akan berbagi kepada kalian sebuah template blogger anime Mahouka Koukou no Rettousei dengan gaya flat secara free alias gratis. Dengan warna hijau laut dengan sedikit kolaborasi dengan warna flat lainnya, template ini menjadi sangat simple dan cocok untuk kalian para blogger pecinta anime. Dan dengan tambahan wajah imut Miyuki template ini semakin perfect untuk kalian. Template ini bukan 100% buatan saya. Namun, saya hanya me-redesign template dari Blog Zulfikar. Berikut ini adalah beberapa gambaran tentang template ini :
  • Template 2 kolom.
  • Desain flat style minimalist.
  • Warna didominasi putih dan hijau laut.
  • Visitor friendly.
  • SEO friendly.
  • Fast load.
  • Auto read more.
  • Menu navigasi keren.
  • Social button keren.
  • Share button keren.
  • Related post keren.
  • Anime bergeser di header.
  • Slider keren.
  • Dan masih banyak lagi.
Screenshot

Download Template Blogger Flat Green Shiba Miyuki Mahouka

Untuk tampilan tata letak, saya jamin rapi seperti tampilan luarnya

Demo Download
( Nama File : File Template 006 )

Cara Memodifikasi Navigasi :
Untuk mengganti link menu navigasi, kalian bisa mengedit kode di bawah ini :
  • Menu Navigasi Atas :
<!-- primary navigation menu start -->
<ul class='nav-menu'>
<li><a href='http://www.yondarkness.com/' rel='dofollow'>About</a></li>
<li><a href='http://www.yondarkness.com/' rel='dofollow'>Contact Us</a></li>
<li><a href='http://www.yondarkness.com/' rel='dofollow'>Privacy Policy</a></li>
<li><a href='http://www.yondarkness.com/' rel='dofollow'>Disclaimer</a></li>
</ul>
<!-- primary navigation menu end -->
  • Menu Navigasi Bawah : 
<ul>
      <li><a expr:href='data:blog.homepageUrl'><span class='icon-home'/></a></li>
 <li><a href='http://freenum.blogspot.com/' rel='dofollow' title='Software'>Software</a></li>
 <li><a href='http://www.yondarkness.com/' rel='dofollow' title='Tutorial'>Tutorial <span class='icon-angle-down'/></a>
        <ul class='dropdown'>
 <li><a href='http://www.yondarkness.com/' rel='dofollow' title='Blog'>Blog</a></li>
 <li><a href='http://www.yondarkness.com/' rel='dofollow' title='Photoshop'>Photoshop</a></li>
</ul>
 </li>
 <li><a href='http://www.yondarkness.com/' rel='dofollow' title='Anime Complete'>Anime Complete <span class='icon-angle-down'/></a>
        <ul class='dropdown'>
 <li><a href='http://www.yondarkness.com/' rel='dofollow' title='Captain Earth'>Captain Earth</a></li>
 <li><a href='http://www.yondarkness.com/' rel='dofollow' title='Mahouka Koukou no Rettousei'>Mahouka Koukou no Rettousei</a></li>
 <li><a href='http://www.yondarkness.com/' rel='dofollow' title='Nisekoi'>Nisekoi</a></li>
 <li><a href='http://www.yondarkness.com/' rel='dofollow' title='Seikoku no Dragonar'>Seikoku no Dragonar</a></li>
</ul>
 </li>
 <li><a href='http://www.yondarkness.com/' rel='dofollow' title='Staff'>Staff</a></li>
</ul>

Cara Memodifikasi Social Button :
Untuk mengganti link social button, kalian bisa mengedit kode di bawah ini :
<ul class='nav-social'>
<li><a class='fcb' href='https://facebook.com/pages/Yondarkness/372878842803751?ref=hl' rel='nofollow'><i class='fa fa-facebook-square fa-2x'/></a>
</li>
<li><a class='gpl' href='https://plus.google.com/118163047156925704991' rel='nofollow'><i class='fa fa-google-plus-square fa-2x'/></a>
</li>
<li><a class='twt' href='https://www.twitter.com/yondarkness/' rel='nofollow'><i class='fa fa-twitter-square fa-2x'/></a>
</li>
<li><a class='ytb' href='http://www.youtube.com/channel/UCHYYxQN554QPr1Ek_oklrVg' rel='nofollow'><i class='fa fa-youtube fa-2x'/></a>
</li>
</ul>

Cara Memodifikasi Slider Gambar :
Untuk mengganti gambar, title, dan deskripsi slider gambar, kalian bisa mengedit kode di bawah ini :
<ul>
<li><a href='http://www.yondarkness.com/' rel='dofollow' title='View my second image link'><img alt='description' src='http://www.presepe.jp/wp-content/uploads/2014/04/P0098653_2.jpg'/></a>
  <h3>Title Blog</h3>
<p>Description Blog</p>
</li>
<li><a href='http://www.yondarkness.com/' rel='dofollow' title='View my second image link'><img alt='description' src='http://img2.blog.zdn.vn/52410700.jpg'/></a>
  <h3>Title Blog</h3>
<p>Description Blog</p>
</li>
<li><a href='http://www.yondarkness.com/' rel='dofollow' title='View my second image link'><img alt='description' src='http://ftp.gameshot.net/article/2013_04/gsGA516acf1e683fcp1n5.jpg'/></a>
  <h3>Title Blog</h3>
<p>Description Blog</p>
</li>
<li><a href='http://www.yondarkness.com/' rel='dofollow' title='View my second image link'><img alt='description' src='http://3.bp.blogspot.com/-c2XNHHqwNkM/U0PrnP7WKEI/AAAAAAAACJY/TzpKtIuSreA/s1600/Image_004.jpghttp://img2.blog.zdn.vn/52269273.jpg'/></a>
  <h3>Title Blog</h3>
<p>Description Blog</p>
</li>
</ul>

Nah, itu dia templatenya. Jika ada error di template ini, tolong dilaporkan. Supaya saya bisa membetulkannya. Kalian boleh menggunakan template ini asalkan tidak menghapus link kreditnya. Hargai karya orang lain. Sekian artikel saya kali ini. Semoga bermanfaat bagi kita semua. Jangan lupa untuk meninggalkan komentar, join this site, dan klik tombol like di bawah ini.

    Cara Membuat Anime Bergerak Dan Berubah Di Header Blog Dengan Css

    Cara Membuat Anime Bergerak Dan Berubah Di Header Blog Dengan Css

    Oke, kali ini saya akn berbagi kepada kalian sebuah tutorial blog tentang bagaimana caranya membuat anime bergerak atau bergeser dan juga berubah di header blog saat di hover atau di arahi mouse menggunakan css. Mungkin kalian sudah pernah melihatnya di template blog saya yang sebelumnya, Blue Madness. Nah sekarang saya akan membagikan cara membuatnya. Jika kalian masih belum tahu, kalian bisa melihat contohnya di link di bawah ini :

    Demo

    Bagaimana? Kalian tertarik? Jika kalian ingin membuatnya, kalian bisa ikuti langkah di bawah ini. Namun, saya sarankan untuk terlebih dahulu belajar mengenai dasar css dan html. Berikut ini adalah caranya :
    • Pertama, buka dulu dasboard blog kalian.
    • Masuk ke menu Template.
    • Pilih Edit HTML.
    • Cari kode ]]></b:skin>.
    • Masukkan kode di bawah ini tepat di atas kode ]]></b:skin>.
    div.Yondax {
    background: url("http://i1273.photobucket.com/albums/y407/maskedx/smss_zps333f1dc9.png") no-repeat ;
    -webkit-transition: all 560ms ease-out;
    -moz-transition: all 560ms ease-out;
    -ms-transition: all 560ms ease-out;
    -o-transition: all 560ms ease-out;
    transition: all 560ms ease-out;
    margin:0px 0px 0px 300px;
    position:absolute;
    height: 200px;
    width: 277px;
    }
    #header-wrapper:hover .Yondax {
    margin:0px 0px 0px 490px;
    opacity:0;
    }
    div.Yondax1 {
    background: url("http://i1273.photobucket.com/albums/y407/maskedx/sms_zpsa1544df1.png") no-repeat;
    -webkit-transition: all 560ms ease-out;
    -moz-transition: all 560ms ease-out;
    -ms-transition: all 560ms ease-out;
    -o-transition: all 560ms ease-out;
    transition: all 560ms ease-out;
    margin:0px 0px 0px 405px;
    position:absolute;
    height: 200px;
    width: 277px;
    opacity:0;
    }
    #header-wrapper:hover .Yondax1 {
    margin:0px 0px 0px 490px;
    opacity:1;
    Keterangan :
    Kode yang ITALIC adalah kode saat gambar di arahi mouse.
    Kode yang berwarna KUNING adalah url gambar sebelum diarahi mouse. Kalian bisa menggantinya dengan url gambar yang kalian inginkan.
    Kode yang berwarna ORANGE adalah kode lamanya transisi dalam micro second. Kalian bisa mengaturnya sesuai keinginan.
    Kode yang berwarna UNGU adalah kode margin (Letak posisi) gambar. Kalian bisa mengaturnya sendiri.
    Kode yang berwarna HIJAU adalah kode jenis posisi gambar. Kalian bisa menggantinya, namun saya sarankan untuk membuarkannya absolute.
    Kode yang berwarna CYAN adalah kode ukuran tinggi gambar. Kalian sesuaikan dengan tinggi gambar yang kalian gunakan.
    Kode yang berwarna BIRU adalah kode ukuran lebar gambar. Kalian sesuaikan dengan lebar gambar yang kalian gunakan.
    Kode yang berwarna PINK adalah kode margin (Letak posisi) gambar saat di arahi mouse. Atur supaya berbeda dengan kode margin yang berwarna UNGU supaya ketika di arahi mouse gambar akan bergerak.
    Kode yang BOLD adalah url gambar saat diarahi mouse. Jika kalian buat berbeda dengan url gambar yang berwarna KUNING maka gambar akan berubah saat di arahi mouse. Jika kalian samakan maka gambar hanya akan bergerak atau bergeser.
    Saya sarankan untuk menyamakan kode yang mempunyai warna sama.

    • Masih di Edit HTML, cari kode <header id="header-wrapper">. Jika tidak ada, carilah kode yang mirip.
    • Masukkan kode di bawah ini tepat di bawah kode <header id="header-wrapper"> :
    <div class='Yondax'/>
    <div class='Yondax1'/>
    •  Sebelum kalian simpan, kalian preview terlebih dahulu dan lihat apakah sudah pas atau belum. Jika belum, kalian bisa mengatur kodenya lagi.
    • Jika sudah, sekarang tinggal kalian simpan.
    Bagaimana? Sudah jadi bukan? Memang membingungkan, karena setiap template blog mempunyai ukuran dan kode yang berbeda beda. Oleh karena itu saya sarankan untuk terlebih dahulu mempelajari tentang dasar css dan html. sekian artikel saya kali ini. Semoga bermanfaat bagi kita semua. Jangan lupa untuk selalu mampir ke blog sederhana saya ini. Dan jangan lupa untuk selalu meninggalkan komentar dan klik tombol like di bawah ini.

    Cara Membuat Tombol Follow Twitter Di Blog

    Cara Membuat Tombol Follow Twitter Di Blog

    Lama saya tidak update, kali ini saya akan berbagi kepada kalian sebuah tutorial tentang bagaimana caranya membuat atau lebih tepatnya memasang tombol/button follow akun twitter di blog dengan mudah. Dalam blogging, kita juga perlu memanfaatkan sosial media seperti twitter untuk menunjang blog kita. Untuk itu, kita perlu mempunyai follower twitter yang banyak. Nah, akan sangat sulit mendapat follower jika kita hanya memberikan link menuju twitter blog kita karena visitor mungkin malas atau tidak punya waktu untuk membuka twitter. Nah, hal itu bisa diatasi dengan membuat tombol follow twitter ini. Tinggal klik, langsung follow selesai. Untuk contoh tombolnya, kalian mungkin akan melihatnya di blog saya ini. Bagaimana? Apa kalian tertarik untuk memasangnya? Jika iya, kalian bisa mengikuti caranya di bawah ini :
    • Pertama, tentu saja kita harus mempunyai akun twitter. Jika belum, kalian bisa daftar terlebih dahulu.
    • Jika kalian sudah punya, langkah selanjutnya, klik link ini.
    • Pertama-tama kalian akan diarahkan ke adf.ly. Tunggu sekita 5 detik. Kemudian akan muncul Skip Ad di pojok kanan atas.
    • Kemudian kalian akan diarahkan ke tempat pembuatan tombol follow ini.
    • Pada Choose a button, pilih yang Follow.
    • Di bawahnya terdapat Button option. Isi user dengan username twitter kalian. Contoh : @Yondarkness, @FreeNum, dan sebagainya.
    • Untuk setting lainnya, kalian bisa sesuaikan sesuai selera kalian.
    • Jika sudah, kalian bisa melihat hasilnya di preview di samping bagian kanan.
    • Nah, di bawah preview ini terdapat sebuah kode seperti ini :
    <a href="https://twitter.com/Yondarkness" class="twitter-follow-button" data-show-count="false">Follow @Yondarkness</a>
    <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
    • Kode inilah nanti yang akan kita butuhkan. Jika sudah puas dengan settingannya, copy kode tersebut.
    • Sekarang kita tinggal memasangnya. 

    Kalian bisa memasangnya di postingan, header, sidebar, footer, dimana saja bisa. Namun, saya hanya akan memberi caranya lewat tambah gadget blogger. Bagaimana caranya? Berikut ini adalah caranya :
    • Seperti biasa, masuk ke dasboard blog kalian.
    • Masuk ke pilihan Tata Letak (Layout).
    • Kemudian klik Tambah Gadget (Add a Gadget). Jika ada banyak, klik salah satu. Yang mana saja tidak masalah.
    • Pilih yang  HTML/JavaScript.
    • Masukkan judul dan masukkan kode yang tadi kalian dapat pada konten.
    • Jika, sudah tinggal kita simpan.
    Hasilnya nanti akan terlihat seperti ini :


    Bagaimana? Sukses bukan? Sekian artikel saya kali ini. Semoga bermanfaat bagi kita semua. Jangan lupa untuk terus mampir ke blog sederhana saya ini, tinggalkan komentar, dan klik tombol like di bawah ini. Follow twitternya juga tidak apa. Hehehe..

    Cara Membuat Social Media Buttons Keren Melayang Di Samping Blog


    Seperti biasanya, saya akan berbagi kepada kalian sebuah tutorial blogger. Kali ini adalah tutorial tentang bagaimana caranya membuat tombol sosial atau social button yang melayang di samping blog. Sosial button ini sangatlah penting bagi blog kita, oleh karena itu jika kalian belum punya di blog kalian, saya sarankan untuk mencobanya. Tenang saja, widget ini tidaklah berat alias ringan. Desainnya yang bagus ala Om-dayz.blogspot.com juga akan menunjang tampilan blog kalian. Untuk lebih jelasnya, kalian bisa melihat demonya di link di bawah ini :

    Demo

    Bagaimana? Bagus bukan? Kalian tertarik? Terus bagaimana cara membuatnya? Sabar. Berikut ini adalah caranya :
    • Pertama, buka dulu dasboard blog kalian.
    • Masuk ke menu Template.
    • Pilih Edit HTML.
    • Cari kode ]]></b:skin>.
    • Masukkan kode di bawah ini tepat di atas kode ]]></b:skin>.
    .staticbar {position: fixed;right: 0;top: 35%;width: 25px;animation:static-bar .8s;-moz-animation:static-bar .8s; -webkit-animation:static-bar .8s;}
    .staticbar:hover {z-index: 1000;}
    .rt-social-buttons a, .loginbtn {background: none repeat scroll 0 0 #0e0e0e;background-repeat: no-repeat;display: block;height: 20px;margin-bottom: 3px;padding: 4px 0 4px 4px;right: 0px;width: 140px;position: relative;-moz-border-radius: 3px 0px 0px 3px;-webkit-border-radius: 3px 0px 0px 3px;-khtml-border-radius: 3px 0px 0px 3px;border-radius: 3px 0px 0px 3px;background-position: 4px 4px;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all 0.3s ease;border:1px solid rgb(51, 51, 51)}
    .rt-social-buttons span, .loginbtn span {background-repeat: no-repeat;color: #FFFFFF;display: block;font-size: 10px;height: 18px;letter-spacing: -1px;line-height: 1.9em;padding-left: 20px;text-transform: uppercase;text-shadow:0px 1px 1px rgba(0, 0, 0, 0.2);}
    .rt-social-buttons a:hover, .loginbtn:hover {background: none repeat scroll 0 0 #4bb847;border:1px solid rgb(70, 0, 0);
    right: 119px;}
    .rt-social-buttons a#rt-buzz-btn span {background-image: url(http://3.bp.blogspot.com/-1cFpImgVPc8/UDU5KDWTlVI/AAAAAAAABVk/SyYxxqwO5wU/s1600/socialsprite.png);background-position:-2px -68px;}
    .rt-social-buttons a#rt-twitter-btn span {background-image: url(http://3.bp.blogspot.com/-1cFpImgVPc8/UDU5KDWTlVI/AAAAAAAABVk/SyYxxqwO5wU/s1600/socialsprite.png);background-position:-2px -24px;}
    .rt-social-buttons a#rt-facebook-btn span {background-image: url(http://3.bp.blogspot.com/-1cFpImgVPc8/UDU5KDWTlVI/AAAAAAAABVk/SyYxxqwO5wU/s1600/socialsprite.png);background-position:-2px -46px;}
    .rt-social-buttons a#rt-rss-btn span {background-image: url(http://3.bp.blogspot.com/-1cFpImgVPc8/UDU5KDWTlVI/AAAAAAAABVk/SyYxxqwO5wU/s1600/socialsprite.png);background-position:-2px -89px;}
    a.loginbtn span {background-image: url(http://3.bp.blogspot.com/-1cFpImgVPc8/UDU5KDWTlVI/AAAAAAAABVk/SyYxxqwO5wU/s1600/socialsprite.png);background-position:-2px 0px;}
    @keyframes static-bar{0%   {right:-25px;} 100%   {right:0px;}}
    @-moz-keyframes static-bar{0%   {right:-25px;} 100%   {right:0px;}}
    @-webkit-keyframes static-bar{0%   {right:-25px;} 100%   {right:0px;}}
    Keterangan :
    Kode yang berwarna BIRU adalah kode warna background tombol. Kalian bisa menggantinya sesuai keinginan.
    Kode yang berwarna HIJAU adalah kode warna background tombol saat diarahi cursor. Kalian bisa menggantinya sesuai keinginan.
    Untuk melihat kode warna, kalian bisa klik disini.

    • Masih di Edit HTML, cari kode </body>.
    • Masukkan kode di bawah ini tepat di atas kode </body> :
    <div class="staticbar">
    <div class="login">
    <div id="rt-login-button">
    <a class="loginbtn buttontext" href="http://blogger.com" rel="nofollow" target="_blank" title="Login Blogger">
    <span class="desc">Blogger Login</span></a>
    </div>
    <div class="clear"></div>
    </div>
    <div class="rt-social-buttons">
    <a class="lightbox" data-options="{&quot;width&quot;:300, &quot;height&quot;:430, &quot;iframe&quot;: true}" href="https://facebook.com/pages/Yondarkness/372878842803751?ref=hl" id="rt-facebook-btn" rel="nofollow" title="Facebook Yondarkness">
    <span> Facebook Fanspage</span></a>
    <a class="lightbox" data-options="{&quot;width&quot;:420, &quot;height&quot;:405, &quot;iframe&quot;: true}" href="https://www.twitter.com/yondarkness/" id="rt-twitter-btn" rel="nofollow" title="Twitter Yondarkness">
    <span>Follow Me On Twitter</span></a>
    <a href="https://plus.google.com/118163047156925704991" id="rt-buzz-btn" rel="nofollow" target="_blank" title="Google Plus Yondarkness">
    <span>Circle Me On Google Plus</span></a>
      <a href="http://www.yondarkness.com/" id="rt-rss-btn" rel="nofollow" target="_blank" title="RSS Yondarkness">
    <span>Subscribe To RSS Feed</span></a>
    </div>
    </div>
    • Terakhir, tinggal kalian simpan. 
    Keterangan :
    Kode yang berwarna UNGU adalah url Fanspage Facebook. Kalian ganti dengan url Fanspage Facebook kalian sendiri.
    Kode yang berwarna PINK adalah url Twitter. Kalian ganti dengan url Twitter kalian sendiri.
    Kode yang berwarna ORANGE adalah url Google Plus. Kalian ganti dengan url Google Plus kalian sendiri.
    Kode yang berwarna CYAN adalah url RSS Blog. Kalian ganti dengan url RSS blog kalian sendiri.

    Bagaimana? Sudah jadi bukan? Sekian tutorial saya kali ini. Semoga bermanfaat bagi kita semua. Saya berterima kasih juga kepada blog Om-Dayz. Jangan lupa untuk mampir ke blog saya lagi, tinggalkan komentar, dan klik tombol like di bawah ini.

    Cara Membuat Akun SSH Gratis Sendiri Di Fast Premium SSH

    Cara Membuat Akun SSH Gratis Sendiri Di Fast Premium SSH

    Oke, kali ini saya akan berbagi kepada kalian, terutama para pengguna SSH yang cinta akan gratisan. Saya akan berbagi tentang bagaimana caranya menbuat akun SSH gratis sendiri menggunakan jasa dari Fast Premium SSH. Oke, tidak ada salahnya sih gratisan. Kenapa harus bayar kalau ada yang gratis? Hehehe.. Pertama, tentu saja kita harus sudah tahu bagaimana caranya menggunakan SSH dan software-software yang dibutuhkan. Jika belum, kalian bisa mencarinya di link di bawah ini :
    Nah itu dia. Jika kalian sudah tahu dan punya softwarenya, kalian bisa mengabaikannya dan lanjut membahas tentang bagaimana cara membuat akun gratisnya. Oke, langsung saja, berikut ini adalah caranya membuatnya :
    • Pertama, buka link berikut ini : Free Premium SSH. Kalian akan di arahkan ke halaman adf.ly. Tunggu sekitar 5 detik dan klik Skip Ad. Kalian akan di arahkan ke halaman untuk membuat akunnya.
    • Nah, di situ akan banyak tersedia beberapa list server akun ssh beserta detailnya. Kalian bisa memilih yang kalian inginkan. Namun saya sarankan untuk memilih yang ada detail Limit Acc : 999999/Day.
    • Atau kalian juga bisa menggunakan filter untuk menemukan akun yang kalian inginkan.
    Mencari Akun Server SSH Gratis Sesuai Keinginan Dengan Filter.
    • Jika sudah, klik tombol Create SSH Account Singapore. (Dalam hal ini saya menggunakan server Singapore. Kalian bisa menggunakan yang lain).
    Klik Tombol Untuk Membuat Akun SSH Premium Sendiri Secara Gratis
    • Kalian akan diarahkan ke sebuah halaman. Di sana ada formulir. Kalian harus mengisinya sesuai keinginan kalian.
    Mengisi Formulir Pembuat Akun SSH Premium Gratis
    • Jika sudah, klik Create Account. 
    • Tunggu loadingnya.
    • Dan akan muncul detail mengenai akun yang kalian buat. (Maaf, sekarang saya menggunakan server USA Public 2 karena Singapore sudah limit tadi. Tapi kalian tetap bisa menggunakan server lain selama belum limit. Inilah alasan mengapa saya sarankan menggunakan server yang ada detailnya Limit Acc : 999999/Day.
    Akun SSH Premium Gratis Sudah Jadi
    Bagaimana? Sudah jadi bukan? Selamat sekarang kalian sudah punya akun SSH sendiri. Akun ini hanya akan aktif selama 3 hari. Jika sudah mati, kalian bisa membuatnya lagi. Namun, 1 akun ini hanya boleh dipakai oleh 1 user saja. Oke, sekian artikel saya kali ini. Semoga bermanfaat bagi kita semua. Jangan lupa mampir terus ke blog Yondarkness, tinggalkan komentar, dan klik tombol like di bawah ini.

    Cara Membuat Anti Ctrl+U Dengan Gambar Di Blog


    Oke, kali ini saya akan berbagi kepada kalian sebuah script untuk blog kalian. Script apa itu? saya akan berbagi kepada kalian script anti Ctrl+U yang membuat blog kita memunculkan peringatan seperti gambar saat ada visitor yang mencoba membuka source kode blog kita. Tahukah kalian kalau source kode ini berisi beberapa kode dari template blog kita? Jika template yang kalian pakai adalah template buatan kalian sendiri dan ada orang yang ingin mencuri kode template kalian pastilah kalian merasa tidak rela bukan? Nah, untuk mencegahnya, kita bisa menggunakan script ini untuk mencegah para plagiator untuk mengintip source code blog kita. Namun, saya ingatkan. Script ini hanya bisa mengatasi plagiator kelas teri. Jika musuh kalian plagiator kelas kakap, mohon maaf. Mungkin script ini tidak akan terlalu membantu. Script ini saya dapat dari blog teman saya, bloganb.blogspot.com kemudian saya ubah sedikit supaya lebih mudah memasangnya. Kalian bisa melihat demonya di link di bawah ini. Saat, ada di blog demonya, kalian bisa menekan tombol Ctrl+U untuk melihatnya.

    Demo

    Lalu bagaimana cara memasangnya? Nah, berikut ini adalah caranya :
    • Seperti biasa, masuk ke dasboard blog kalian.
    • Masuk ke pilihan Tata Letak (Layout).
    • Kemudian klik Tambah Gadget (Add a Gadget). Jika ada banyak, klik salah satu. Yang mana saja tidak masalah. Namun saya sarankan untuk meletakannya di paling atas, supaya lebih cepat diload.
    • Pilih yang  HTML/JavaScript.
    • Kosongkan saja judulnya dan masukkan kode di bawah ini pada konten :
    <script src='https://googledrive.com/host/0B0E3jachWu1WLWJrVnNLNmhtSHM/' type='text/javascript'></script>
    •  Jika sudah, sekarang tinggal kalian simpan.
    Nah, bagaimana? Sekarang kalian bisa mengeceknya dengan cara menekan tombol Ctrl+U di blog kalian.

    Kalian juga bisa mencoba trik ini : Cara Membuat Anti Klik Kanan Dengan Gambar Di Blog.

    Atau menggunakan encryprt HTML dan kode ekternal supaya lebih aman.

    Sekian artikel saya kali ini. Semoga bermanfaat bagi kita semua. Jangan lupa tinggalkan komentar dan klik tombol like di bawah ini untuk menghargai jasa penulis.

    Cara Membuat Anti Klik Kanan Dengan Gambar Di Blog


    Oke, kali ini saya akan berbagi kepada kalian sebuah tutorial blogger lama dari dickeymaru.com tentang bagaimana caranya membuat anti right click/klik kanan di dengan menggunakan gambar yang muncul di blog. Dengan ini, kita akan membuat blog kita menjadi lebih aman dari copaser. Karena jika ada orang yang melakukan klik kanan akan muncul sebuah gambar. Tenang saja, widget ini ringan. Jadi tidak terlalu menghambat loading blog. Untuk contohnya, kalian bisa melihat demonya di link di bawah ini :

    Demo

    Bagaimana? Lumayan bagus bukan? Lalu bagaimana cara membuatnya? Untuk cara membuatnya, kalian bisa mengikuti langkah berikut :
    • Seperti biasa, masuk ke dasboard blog kalian.
    • Masuk ke pilihan Tata Letak (Layout).
    • Kemudian klik Tambah Gadget (Add a Gadget). Jika ada banyak, klik salah satu. Yang mana saja tidak masalah. Namun saya sarankan untuk meletakannya di paling atas, supaya lebih cepat diload.
    • Pilih yang  HTML/JavaScript.
    • Kosongkan saja judulnya dan masukkan kode di bawah ini pada konten :
    <script type='text/javascript'>
    var DADrightclicktheme = 'Dark';
    var DADrightclickimage = 'http://2.bp.blogspot.com/-J4If-Y4o9WA/UPETwsjx8iI/AAAAAAAABnE/GKOhBnjjf0k/s1600/No+Right+Click+copy.png';
    </script>
    <script type="text/javascript" src="https://googledrive.com/host/0B0E3jachWu1WWVNiRDlwLWdXT3M/"></script>
    •  Jika sudah, sekarang tinggal kalian simpan.
    Keterangan :
    Ganti kode berwarna BIRU dengan skema blog kalian. Jika blog kalian berwarna dasar gelap, isi dengan Dark. Dan jika blog kalian berwarna dasar terang, isi dengan Light.
    Ganti kode berwarna HIJAU dengan URL/Alamat gambar Anti Klik Kanan kalian.

    Bagaimana? Sudah jadikan? Sekarang blog kalian menjadi lebih aman dari para copaser. Namun, hanya copaser newbie menengah sedikit. Kalau copaser pro, beda lagi ceritanya.

    Kalian juga bisa mencoba trik ini : Cara Membuat Anti Ctrl+U Dengan Gambar Di Blog.

    Atau menggunakan encryprt HTML dan kode ekternal supaya lebih aman.

    Sekian artikel saya kali ini. Semoga bermanfaat bagi kita semua. Jangan lupa mampir lagi, tinggalkan komentar, dan klik tombol like di bawah ini.

    Cara Membuat Lapor Link Rusak Dengan Google Formulir

    Cara Membuat Lapor Link Rusak Menggunakan Google Formulir

    Hai, seperti biasanya, kali ini saya akan berbagi kepada kalian sebuah tutorial tentang blog. Tutorial apakah itu? Kali ini saya akan berbagi kepada kalian tentang bagaimana caranya membuat lapor link rusak atau mati menggunakan fasilitas yang disediakan oleh Google Drive. Dengan menggunakan lapor link rusak ini, visitor akan lebih mudah melaporkan masalah seperti link rusak atau mati sehingga kita bisa segera memperbaikinya. Untuk contohnya kalian bisa mengklik link demo di bawah ini :


    Bagaimana? Apakah kalian tertarik? Baiklah, kalian bisa mengikuti tutorialnya di bawah ini :
    • Pertama, kalian buka dulu Google Drive : Klik disini.
    • Jika ada tulisan "Installing Drive lets you keep files on your computer backed up and ready to access from anywhere.", kalian bisa memilih No thanks.
    Langkah Awal Membuat Lapor Link Rusak

    • Kemudian kalian akan masuk pada halaman utamanya.
    • Klik tombol buat.
    • Kemudian pilih Formulir.
    Membuat Formulir Baru Di Google Drive

    • Kalian akan di arahkan ke sebuah halaman untuk mengatur isi formulirnya.
    • Sesuaikan seperti keinginan kalian. Isi judul dan temanya.
    Memberi Judul dan Tema Form Google
    • Jika sudah, kalian bisa mengaturnya seperti sedemikian rupa. (Sebenarnya terserah kalian mau diatur seperti apa).
    Mengisi Google Formulir Untuk Lapor Link Rusak

    • Kemudian kalian tinggal melanjutkan untuk pertanyaan lain. Seperti judul postingan, url postingan, keterangan, dan lainnya.
    Isian Pertanyaan Google Formulir Untuk Lapor Link Rusak
    • Jika kita ingin melihat hasil jadinya, kalian bisa mengklik Lihat bentuk jadi.
    • Jika kalian ingin melihat tanggapan (Hasil pengisian formulir dari visitor), kalian harus mengaturnya terlebih dahulu. Caranya dengan mengklik pilihan Pilih tujuan tanggapan dan pilih Spreadsheet baru.
    • Jika sudah selesai, kalian klik Kirim formulir.
    • Akan muncul sebuah pop up dan Klik Sematkan.
    • Disana akan ada kode. Kode ini nanti yang akan kalian butuhkan. Atur terlebih dahulu lebar dan tingginya.
    • Kemudian copy kodenya.
    Nah, sekarang kita sudah mendapatkan kodenya. Sekarang kita akan memasangnya di postingan atau laman. Berikut ini adalah caranya :
    • Pertama, masuk ke dasboard blog kalian.
    • Buatlah postingan atau laman seperti biasanya.
    • Di editor postingan atau laman akan ada dua pilihan, Compose dan HTML.
    • Pilih yang HTML.
    • Pastekan kode yang tadi sudah kita dapatkan tadi.
    • Kemudian tinggal kalian edit postingan atau lamannya sesuai yang kita inginkan.
    • Jika sudah, tinggal kita publikasikan seperti biasa dan menunggu kalau ada yang mengisi formulirnya.
    Untuk melihat hasil pengisian formulir dari visitor, kalian bisa membuka Google Drive. Disana akan ada file baru berupa Spreadsheet dengan nama "Judul Formulir (Tanggapan)". Kalian bisa membuka dan melihat hasilnya. Jangan lupa untuk mengeceknya secara rutin.
    Bagaimana? Sudah jadikan? Mudah sekali menggunakan fasilitas yang di sediakan Google ini.  Sekian artikel saya kali ini. Semoga bermanfaat bagi kita semua. Jangan lupa terus berkunjung di blog saya ini, tinggalakan komentar, dan klik tombol like di bawah ini.

    Download Kumpulan Ikon Folder Anime

    Download Kumpulan Ikon Folder Anime

    Oke, kali ini saya akan berbagi sesuatu kepada kalian para pembaca blog ini terutama untuk yang suka mengoleksi anime hingga berfolder-folder. Sesuatu apakah itu? Saya kan berbagi sebuah file berisi 2000 lebih ikon/icon anime untuk kalian. Wah, banyak sekali ya. Iya lah, ukurannya saja hingga 800 MB. Tapi tenang saja, setelah di jadikan file .rar ukurannya menjadi 300 MB. Jadi kalian tidak perlu mendownload hingga hampir 1 GB. Untuk previewnya, kalian bisa melihat gambar di bawah ini :

    Kumpulan Ikon Folder Anime

    Bagaimana? Apakah kalian tertarik? Oke langsung saja. Kalian bisa mendownloadnya secara gratis di link di bawah ini :

    Download
    ( Nama File : File Lain 004 )

    Cara menggunakannya sangatlah mudah. Pertama, tentu saja kalian harus mendownload file. Jika sudah, kalian ekstrak menggunakan WinRar. Kemudian cari folder anime yang ingin kalian ganti ikonnya. Klik kanan. Pilih Properties. Klik tab Customize. Nah, disana ada tulisan Change Icon.... Kemudian cari ikon folder yang sesuai yang tadi sudah kalian download. Kemudian tinggal di Ok dan selesai.
    Oke, sekian artikel saya kali ini. Semoga bermanfaat bagi kita semua. Jangan lupa terus berkunjung, klik join this site di menu blog, tinggalkan komentar, dan klik tombol like di bawah ini.

    Cara Membuat Widget Anime Bergeser Di Pojok Blog

    Membuat Anime Bergeser Di Pojok Blog

    Oke, kali ini saya akan berbagi kepada kalian sebuah widget yang akan mempercantik blog kalian. Widget apakah itu? Ya, seperti judulnya ini adalah widget anime bergeser di pojok blog. Untuk demonya, kalian bisa klik link di bawah ini :


    Bagaimana? Tertarik? Namun, saat ini saya hanya mempunyai 4 koleksi saja. Jika kalian ingin lebih, kalian bisa mengirim gambar seperti widget yang saya share ini ke Fanspage Yondarkness. Berikut ini adalah link gambarnya, klik untuk melihat :

    Lalu bagaimana cara membuatnya? Oke langsung saja, berikut ini adalah caranya :

    • Seperti biasa, masuk ke dasboard blog kalian.
    • Masuk ke pilihan Tata Letak (Layout).
    • Kemudian klik Tambah Gadget (Add a Gadget). Jika ada banyak, klik salah satu. Yang mana saja tidak masalah.
    • Pilih yang  HTML/JavaScript.
    • Kosongkan saja judulnya dan masukkan kode di bawah ini pada konten sesuai dengan widget yang kalian inginkan.
    Widget 1 :
    <script type="text/javascript" src="https://googledrive.com/host/0B0E3jachWu1WelFHUDBKRGdGZ2s/"></script>
      Widget 2 :
      <script type="text/javascript" src="https://googledrive.com/host/0B0E3jachWu1WS2V5ODJwdkx3TGM/"></script>
        Widget 3 :
        <script type="text/javascript" src="https://googledrive.com/host/0B0E3jachWu1WX2ZPY0lqMXF0TEk/"></script>
          Widget 4 :
          <script type="text/javascript" src="https://googledrive.com/host/0B0E3jachWu1WWVN5d0NVTXZIVzg/"></script>
          • Jika sudah, sekarang tinggal kalian simpan.
          Sudah jadi kan? Bagaimana sekarang blog kalian ditemani tokoh anime di pojok dan seakan-akan malu jika disentuh? Hahaha.. Saya sudah mengupdate tutorial ini beberapa kali supaya lebih sempurna. Jika ada kesalahan harap laporkan. Sekian artikel saya kali ini. Semoga bermanfaat bagi kita semua. Jangan lupa mampir lagi, tinggalkan komentar, dan klik tombol like di bawah ini.

          Apa Itu Template Blog Responsive?

          Apa Itu Template Blog Responsive?

          Template blog Responsive, mungkin kalian sering mendengar kata itu di kalangan blogger. Lalu, apa itu template blog Responsive? Mungkin kalian bertanya seperti itu. Template blog Responsive adalah template blog yang membuat  blog yang menerapkannya menyesuaikan tampilan secara otomatis sesuai dengan lebar gadget yang digunakan untuk membuka blog tersebut. Bagaimana? Masih bingung? Baiklah tidak apa apa. Supaya kalian lebih mengerti, saya akan memberikan contoh 1 blog yang menggunakan template Responsive ini. Untuk melihatnya, kalian bisa mengklik link ini.

          Setelah kalian buka, sekarang coba kalian zoom tampilan blog tersebut (Ctrl+Scroll) menjadi lebih besar atau kalian coba membuka blog tersebut menggunakan pc, hp, smartphone, dan sebagainya dengan lebar layar yang berbeda. Tampilannya akan menyesuaikan bukan?

          Lalu apa kelebihan dari template Responsive ini dan apa pula kekurangannya? Kelebihan template ini akan membuat blog kita menjadi lebih Visitor Friendly karena menyesuaikan dengan gadget yang digunakan oleh visitor. Apa lagi saat ini Google sedang menggunakan algoritma Mobilegeddon yang mana Google akan memprioritaskan web atau blog yang Mobile Friendly pada pencarian menggunakan Mobile. Salah satu cara agar blog menjadi Mobile Friendly adalah dengan menggunakan template Responsive

          Untuk kekurangannya mungkin karena untuk template Responsive ini membutuhkan kode lebih. Sehingga akan sedikit memperlambat loading blog kita. Dan tentu untuk membuatnya akan lebih sulit.

          Saat ini template Responsive inilah yang menjadi trend dan banyak dicari. Kalian bisa mencarinya dengan mudah menggunakan google dengan keyword "Download Template Responsive" karena sekarang sudah banyak tersedia template responsive, baik free alias gratis ataupun premium alias berbayar.

          Untuk mengcheck apakah template Responsive atau tidak, kalian bisa mengzoom tampilannya atau menggunakan beberapa fitur yang tersedia di beberapa web seperti Responsinator dan lainnya.

          Lalu bagaimana cara membuatnya? Untuk saat ini saya sendiri belum tahu bagaimana. Jadi saya belum bisa memberi tahu.

          Oke, saya rasa cukup. Sekian artikel dari saya. Semoga bermanfaat bagi kita semua. Jangan lupa kunjungi blog saya ini, tinggalkan komentar, dan klik tombol like di bawah ini.

          Cara Modifikasi Label Blog Dengan Css

          Modifikasi Label Blog Dengan Css

          Kali ini saya akan berbagi kepada kalian sebuah tutorial blogger. Mungkin bukan hal bukan hal baru lagi. Namun, tidak masalah. Saya akan berbagi kepada yang membutuhkan saja. Tutorial apa itu? Ya, tutorial tentang bagaimana caranya memodifikasi tampilan label blog dengan css. Kalian sudah tahukan apa yang di maksud dengan label? Saya anggap sudah pada tahu. Kalian bisa melihat contohnya seperti di bawah ini :

          Contoh Modifikasi Label

          Bagaimana? Itu adalah tampilan label saya setelah saya modifikasi. Bagaimana? Tertarik? Oke, langsung saja. Berikut ini adalah caranya :
          • Pertama, tentu saja kalian harus sudah memasang widget label.
          • Jika belum, kalian pasang terlebih dahulu. Namun pilih yang label list.
          • Jika sudah, sekarang masuk ke dasboard blog kalian.
          • Masuk ke menu Template.
          • Pilih yang Edit HTML.
          • Cari kode ]]></b:skin>.
          • Masukkan kode di bawah ini tepat di atas kode ]]></b:skin>.
          /* LABEL */
          .Label ul {
          padding:5px;
          overflow:hidden;
          }
          .Label li {
          float:left;
          margin-right:2px;
          margin-bottom:2px;
          padding:4px 8px;
          color:#FFFFFF;
          background-color:#2980b9; list-style:none; -moz-transition:all 0.5s; -webkit-transition:all 0.5s;
          }
          .Label li:hover {
          color:#FFFFFF;
          background-color:#0e0e0e;
          }
          .Label li a {
          color:#FFFFFF;
          }
          • Terakhir tinggal disimpan. 
          Keterangan :
          Kode yang berwarna ORANGE adalah kode warna teks label. Kalian bisa mengaturnya sesuai keinginan.
          Kode yang berwarna KUNING adalah kode warna background label. Kalian bisa mengaturnya sesuai keinginan.
          Kode yang berwarna HIJAU adalah kode lamanya proses transisi animasi. Kalian bisa mengaturnya sesuai keinginan.
          Kode yang bercetak TEBAL adalah kode style label saat di arahi mouse. Style labe akan berubah. Seperti background atau warna teksnya. Kalian bisa mengaturnya sesuai keinginan.

          Bagaimana? Jadikan? Sekian artikel saya kali ini. Semoga bermanfaat bagi kita semua. Jangan lupa tinggalkan komentar dan klik like tombol like di bawah ini.

          Pengertian Fungsi Tool Pada Photoshop

          Fungsi Tool Photoshop

          Kali ini saya akan membagikan kepada kalian tentang pengertian atau penjelasan mengenai fungsi-fungsi dari tool yang ada pada Photoshop. Bagi kalian yang masih baru (Newbie) dalam menggunakan Photoshop, postingan ini wajib kalian baca. Sebenarnya saya mendapat pengertian ini dari blog F-Photoshop.com. Namun, tidak ada salahnya kan berbagi? Oke langsung saja, berikut ini adalah penjelasannya :

          Selection Tool

          Move Tool - Shortcut (V), digunakan untuk memindahkan posisi layer dalam satu foto ataupun memindahkan sebuah foto atau layer dalam sebuah foto ke foto yang lain / foto yang berbeda.
          Rectangular Marquee Tool - Shortcut (M), digunakan untuk menyeleksi objek yang berbentuk kotak. Klik kanan diatas alat ini maka akan muncul alat lain dari kelompok marquee tool seperti Eliptical Marquee Tool, Single Row Marquee tool dan Single Column Marquee Tool.
          Eliptical Marquee Tool - Shortcut (M), digunakan untuk menyeleksi objek yang berbentuk lingkaran seperti menyeleksi lingkaran mata, ban mobil dan objek lain. Alat ini masih satu kelompok dengan Rectangular Marquee Tool.
          Lasso Tool - Shortcut (L), digunakan untuk menyeleksi objek dengan bentuk bebas, alat ini akan membentuk seleksi sesuai dengan gerakan mouse, penggunaan alat ini sangat bergantung dengan gerakan mouse sehingga cukup sulit mengendalikan dan mencapai hasil yang maksimal.
          Polygonal Lasso Tool - Shortcut (L), digunakan untuk menyeleksi objek dengan bentuk bebas bersudut, alat ini membentuk seleksi melalui titik-titik point yang dibuat dengan menggunakan klik kiri mouse. Alat ini juga dapat digunakan untuk memotong dan mengubah background foto.
          Magnetic Lasso Tool - Shortcut (L), digunakan untuk menyeleksi objek dengan bentuk bebas, cara kerja alat ini adalah menempel pada tepi objek yang akan dipotong ketika mouse bergerak mengelilingi tepian objek, selama proses seleksi alat ini membentuk titik-titik penghubung seleksi.
          Magic Wand Tool - Shortcut (W), digunakan untuk  menyeleksi satu jenis warna (warna solid) pada foto. Alat ini dapat menyeleksi dengan pengaturan nilai tolerance atau nilai cakupan warna, semakin besar nilai tersebut maka semakin luas cakupan warna yang di seleksi.


          Crop & Slice Tool

          Crop Tool - Shortcut (C), digunakan untuk memotong gambar, foto ataupun canvas (kertas kerja). Pemotongan dengan alat ini dilakukan secara permanen mengubah bentuk dimensi lebar dan tinggi foto. Pemotongan dilakukan dengan menentukan area potong berbentuk kotak dari sebuah foto.
          Slice Tool - Shortcut (C), digunakan untuk kebutuhan website dengan cara memotong hasil desain yang telah dibuat di Photoshop menjadi potongan yang lebih kecil.
          Slice Select Tool - Shortcut (C), digunakan untuk memilih potongan pada sebuah desain yang telah dipotong sebelumnya dengan menggunakan slice tool.


          Annotation, Measuring & Navigation Tool
           
          Eyedropper Tool - Shortcut (I), digunakan untuk mengambil sample warna dari sebuah gambar ataupun foto, sample warna diambil dengan cara mengklik warna target yang kemudian secara otomatis akan mengubah warna depan (foreground color) pada toolbox.
          Ruler Tool - Shortcut (I), digunakan untuk mengukur dimensi lebar dan tinggi.  alat ini biasanya digunakan untuk kebutuhan website seperti mengukur dan memperkirakan interface tinggi & lebar tombol, header ataupun area website lainnya. Satuan yang digunakan biasanya pixels.
          Note tool - Shortcut (I), digunakan untuk memberikan catatan pada hasil desain yang telah di buat. Catatan ini berguna sebagai pengingat dalam proses pembuatan desain ataupun dapat berguna sebagai media untuk penyampaian sebuah pesan ketika bekerja secara team.
          Hand Tool - Shortcut (H), digunakan untuk menggeser/memindah bidang pandang foto atau gambar di dalam window view area atau dalam kondisi gambar sedang di perbesar (zoom in). Cukup tekan dan tahan tombol spasi untuk meminjam alat ini.
          Zoom Tool - Shortcut (Z), digunakan untuk memperbesar ataupun memperkecil tampilan foto atau gambar. Pengaturan zoom in atau zoom out dapat dilakukan melalui option bar.


          Retouching Tool

          Spot Healing Brush - Shortcut (J), digunakan untuk menghapus noda pada sebuah foto ataupun gambar, alat ini juga biasanya digunakan untuk menghilangkan noda di wajah ataupun menghilangkan jerawat diwajah.
          Patch Tool - Shortcut (J), digunakan untuk memperbaiki foto dengan cara memanfaatkan pola yang terdapat pada foto tersebut. Perbaikan dilakukan dengan menyeleksi kerusakan area kemudian menarik seleksi tersebut diatas pola target untuk menutupi area kerusakan.
          Red Eye Tool - Shortcut (J), digunakan untuk menghilangkan efek mata merah yang timbul pada foto akibat pengambilan foto dalam kondisi gelap menyebabkan flash kamera memantulkan warna merah pembuluh darah dibalik mata.
          Clone Stamp Tool - Shortcut (S), digunakan untuk mengambil sample dari sebuah area gambar kemudian mengkloning / menerapkan sample tersebut untuk dilukiskan diatas area foto lain berdasarkan sample foto yang diambil.
          Pattern Stamp Tool - Shortcut (S), digunakan untuk melukis image dengan menggunakan pola tertentu sesuai dengan pola yang dipilih pada option bar.
          Eraser Tool - Shortcut (E), digunakan untuk menghapus foto atau gambar dalam sebuah layer raster.
          Background Eraser Tool - Shortcut (E), digunakan untuk menghapus foto atau gambar sehingga menghasilkan layer transparant pada bagian foto atau pada area yang dihapus.
          Magic Eraser Tool - Shortcut (E), digunakan untuk menghapus area tertentu dari sebuah foto atau gambar yang memiliki warna yang serupa (satu warna solid) menjadi transparan dengan satu kali klik pada area warna tersebut. Bisa dimanfaatkan untuk menghapus background satu warna.
          Blur Tool - digunakan untuk menghaluskan/mengaburkan area tertentu dari sebuah foto atau gambar. Dengan mengaburkan gambar akan memberikan kesan halus, blur juga dapat menyamarkan pixels gambar.
          Sharpen Tool - digunakan untuk menajamkan area tertentu dari sebuah foto atau gambar.
          Smudge Tool - digunakan untuk menggosok/mencoreng area tertentu dari sebuah foto atau gambar seolah-olah di pengaruhi oleh sapuan jari telunjuk diatas sebuah lukisan.
          Dodge Tool - Shortcut (O), digunakan untuk menerangkan warna di area tertentu pada gambar atau foto dengan memberikan highlights pada area tertentu hingga area tersebut tampak lebih cerah / terang.
          Burn Tool - Shortcut (O), digunakan untuk menggelapkan warna di area tertentu pada gambar atau foto dengan memberikan shadow / bayangan pada area tertentu hingga tampak lebih gelap.
          Sponge Tool - Shortcut (O), digunakan untuk mengubah saturation di area tertentu pada area gambar atau foto.


          Painting Tool

          Brush Tool - Shortcut (B), digunakan untuk melukis foto atau gambar dengan goresan kuas berdasarkan warna depan (foreground color) yang telah dipilih.
          History Brush Tool - Shortcut (Y), digunakan untuk melukis image menggunakan snapshot atau state history dari Image.
          Art History Brush Tool - Shortcut (Y), digunakan untuk melukis image menggunakan snapshot atau state history dari image, dengan model artistik tertentu.
           Pencil Tool - Shortcut (B), digunakan untuk melukis dengan efek goresan pensil.

          Gradient Tool - Shortcut (G), digunakan untuk mengecat area yang dipilih (selected area) dengan perpaduan dua warna atau lebih. Gradient ini juga memiliki beberapa pengaturan dan tipe untuk menghasilkan efek perpaduan warna yang sesuai dengan keinginan.
          Paint Bucket Tool - Shortcut (G), digunakan untuk mengecat atau mewarnai area tertentu atau layer tertentu berdasarkan warna depan (foreground color) yang telah dipilih.

          Drawing and Type Tool

          Path Selection Tool - Shortcut (A), digunakan untuk menyeleksi path yang telah dibuat dengan menggunakan pen tool.
          Horizontal Type Tool - Shortcut (T), digunakan untuk membuat teks secara horizontal. Selain alat ini ada juga Vertical Type Tool untuk membuat teks secara vertical dan type mask untuk membuat teks dalam bentuk seleksi.
          Pen Tool - Shortcut (P), digunakan untuk menggambar path sudut ataupun lengkung. Alat ini biasa juga digunakan untuk menyeleksi objek. Selain alat ini ada kumpulan alat lain untuk menambah titik point, mengurangi dan memodifikasi path yang telah dibuat.

          Oke, itulah pengertian fungsi-fungsinya. Sumbernya dari http://www.f-photoshop.com/2013/08/fungsi-tool-tool-pada-photoshop.html. Sekian artikel kali ini. Semoga bermanfaat bagi kita semua. Jangan lupa tinggalkan komentar dan klik tombol like di bawah ini.