Cara Memasang Favicon dengan HTML

Konbawa Minna ^^, Malam ini mimin akan membagikan tutorial Terbaru xD

Karna udah buka puasa :v jadinya mimin semangat buat ngepost ya :v Hueheheh :v

Langsung aja kita mulai tutorialnya , Tutorial kali ini adalah "Cara Memasang Favicon Dengan HTML"

Tau Favicon ? :v Nih menurut saya Favicon itu Icon Gambar yang berada di Tab Browser kamu :v

Nah, Cara memasangnya begini ^^

Pertama Silahkan Cari </head> , Lalu letakkan Javascript bawah ini tepat diatasnya :)

 <link href='LINK GAMBAR 20x20' rel='shortcut icon' type='image/x-icon'/> 

Biasanya Gambar Favicon itu normal 20x20 :3
Lalu SAVE TEMPLATE.

Semoga tutorial ini bisa membantu anda ^^

Jangan Lupa Tinggalkan Komentar kalian yah ! ^^

Dan Jangan Lupa Like Fanpages kami dan Share Blog ini juga ^^

Read More

Cara Membuat Footer Widget Full Width

Konichiwa Minna-san !! ^^ , Siang ini mimin akan membuat Tutorial Baru nih :3

Tutorial cukup Simple dan mudah kok :3 

Kalau gk Work , coba ulangin lagi deh ^^

DEMO

---

Lihat Bagian Bawah Blog ini

---

Langsung saja ikuti caranya dibawahnya ~
Pertama , Silahkan Masukkan Kode CSS dibawah ini diatas </style> / </b:skin>

 /*==== FOOTER MOE ====*/
#footer-wrapper {width: 100%;text-align: left;border-top: 2px solid #112121;overflow: hidden;background: #333;margin: -20px 0px 0px 0px;padding: 15px 0 0 0;}
#footer-widgetfix .footer-widget {width:30%;float:left;margin-left:30px;padding-top:10px;padding-bottom:15px;}
#footer-widgetfix {max-width:1140px;overflow:hidden;margin: 0 auto;}
#footer-wrapper h2 {font-family: "Open Sans";font-size: 14px;font-weight: 600;color: #888;padding: 5px 0;text-transform: uppercase;border-bottom: 1px solid #888;margin-top: -10px;}
#footer-wrapper .widget-content {text-align: left;font-family: 'Exo 2', Open sans, sans-serif;margin: 0 0 15px;color: #888;}
#footer-wrapper a {color: #DDD;font-weight: 700;font-family: "Open Sans";}#footer-wrapper a:hover{color:#dce1e2;text-decoration:underline;}
#footer-wrapper .widget-content li {margin-left:-14px;color:#888}
#footer-wrapper .widget li {margin:5px 0 0 0;padding:5px 0 0 0;display:block;}
.footer li a {font-size: 12px;font-weight: 400;font-family: 'Exo 2', Open sans, sans-serif;color: #eee;margin: 0;}
.footer li a:hover {color: #eee;text-decoration:underline;}
#footerfix {overflow:hidden;background:#111;padding:10px 5px;margin:15px 0 0 0;}
.cpleft {float:left;margin:10px;color:#888;font-size:11px;font-family:'Exo 2', Open sans, sans-serif;font-weight:400;}
#cpright {float:right;margin:10px;color:#888;font-size:11px;font-family:'Exo 2', Open sans, sans-serif;font-weight:400;}
.cpleft a,#cpright a {color:#dce1e2;text-decoration:none;}
.cpleft a:hover,#cpright a:hover {color:#ffa812;text-decoration:none;}
.footer-bottom {min-height:40px;}
#footx1,#footx2,#footx3 {margin:0 .2%}
.footer {font-weight:400;padding-bottom:.2em;}
.footer-bottom .recpost li{overflow:hidden;border-bottom:1px solid #333;padding:10px 0}
.footer-bottom .recpost li:first-child{padding-top:0}
.footer-bottom .recpost li:last-child{border-bottom:none}
.footer-bottom .recpost .arl-tmb{display:block;width:60px;height:60px;}
.footer-bottom .recpost .rcp-title{font-family:'Exo 2', Open sans, sans-serif;font-size:15px;font-weight:400;margin:5px 0 8px}
.footer-bottom .recpost .rcp-title a{color:#bbb;font-weight:700;font-size:14px}
.footer-bottom .recpost .rcp-title a:hover{color:#ffa812;text-decoration:none}
#footer-wrapper .label-size {color: #fff;display: block;float: left;font-size: 11px;transition: all .3s ease-out;}
#footer-wrapper .label-size a {display: inline-block;padding: 2px 3px;font-weight: 400;transition: all .3s ease-out;}
#footer-wrapper .label-size a:hover {color:#fff;}
#footer-wrapper .label-size a:before {content:"\f02b";font-family:FontAwesome;
font-style:normal;font-weight:normal;text-decoration:none;padding-right:4px;
color:#fff;transition:all .3s ease-out;}
#footer-wrapper .label-size a:hover:before {content:"\f061";font-family:FontAwesome;
font-style:normal;font-weight:normal;text-decoration:none;color:#4791d2;}
#footer-wrapper .label-size:hover, #footer-wrapper-inner .label-size:hover{background:#111;color:#fff;border-color:#444;}
#footer-wrapper .label-count {white-space:nowrap;padding:3px;
background:#222;color:#fff!important;transition:all .3s ease-out;}
.pelangi {height: 6px;margin:20px 0px;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYYC1c9CnnWnAh5kaXZBCPrcHQNiw87mgvUBE_Isi6asOxqZpPZgvhCzrFhOPtWvf-MBwtZ5XWrdC-7kUCDPhoAIac14HyGKZRuu7Nn1ZiNFwmFq7R10NOBN_OcK1Jb1D7tBBQyKJApdRK/s1600/rainbow.png) repeat-x;}
.copyright3 {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxNkt_J0T-hJPluFqMXA48ztXjVTcyqWD_OdCPX3JrEsR5pd_o0bcb4wQxzIsxCqOvstt6Tg8a5SGez8-Q9XLx4OQkV3zLDpKTEnjkyun4iUkq4XFI4omlXEwV2huyJUVqtmmIg4B-nBE/s1600/Footer.png") #222 5px;color: #fff;height: 20px;padding: 25px 0px;text-align: center;font-family: "Open Sans",sans-serif;font-size: 13px;} 

Sesudah diletakkan Kode CSSnya, Lalu letakkan HTMLnya
Tepat diatas HTML Credit anda, ( Kalau anda Memakai Template saya Maka Cari Kode <!-- END OUTER --> )

 <!-- FOOTER WRAPPER -->
<div class='pelangi'/>
<footer id='footer-wrapper'>
<div class='footer-bottom'>
<div id='footer-widgetfix'>
<div class='footer-widget' id='footx1'>
<b:section class='footer' id='footer1'>
  <b:widget id='HTML5' locked='false' title='Fanpages' type='HTML'>
    <b:includable id='main'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>

  <b:include name='quickedit'/>
</b:includable>
  </b:widget>
</b:section>
</div>
<div class='footer-widget' id='footx2'>
<b:section class='footer' id='footer2'>
  <b:widget id='Label2' locked='false' title='Categories Cloud' type='Label'>
    <b:includable id='main'>
  <b:if cond='data:title != &quot;&quot;'>
    <h2><data:title/></h2>
  </b:if>
  <div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'>
    <b:if cond='data:display == &quot;list&quot;'>
      <ul>
        <b:loop values='data:labels' var='label'>
          <li>
            <b:if cond='data:blog.url == data:label.url'>
              <span expr:dir='data:blog.languageDirection'><data:label.name/></span>
            <b:else/>
              <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
            </b:if>
            <b:if cond='data:showFreqNumbers'>
              <span dir='ltr'>(<data:label.count/>)</span>
            </b:if>
          </li>
        </b:loop>
      </ul>
    <b:else/>
      <b:loop values='data:labels' var='label'>
        <span expr:class='&quot;label-size label-size-&quot; + data:label.cssSize'>
          <b:if cond='data:blog.url == data:label.url'>
            <span expr:dir='data:blog.languageDirection'><data:label.name/></span>
          <b:else/>
            <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
          </b:if>
          <b:if cond='data:showFreqNumbers'>
            <span class='label-count' dir='ltr'>(<data:label.count/>)</span>
          </b:if>
        </span>
      </b:loop>
    </b:if>
    <b:include name='quickedit'/>
  </div>
</b:includable>
  </b:widget>
</b:section>
</div>
<div class='footer-widget' id='footx3'>
<b:section class='footer' id='footer3'>
  <b:widget id='Label4' locked='false' title='Categories List' type='Label'>
    <b:includable id='main'>
  <b:if cond='data:title != &quot;&quot;'>
    <h2><data:title/></h2>
  </b:if>
  <div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'>
    <b:if cond='data:display == &quot;list&quot;'>
      <ul>
        <b:loop values='data:labels' var='label'>
          <li>
            <b:if cond='data:blog.url == data:label.url'>
              <span expr:dir='data:blog.languageDirection'><data:label.name/></span>
            <b:else/>
              <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
            </b:if>
            <b:if cond='data:showFreqNumbers'>
              <span dir='ltr'>(<data:label.count/>)</span>
            </b:if>
          </li>
        </b:loop>
      </ul>
    <b:else/>
      <b:loop values='data:labels' var='label'>
        <span expr:class='&quot;label-size label-size-&quot; + data:label.cssSize'>
          <b:if cond='data:blog.url == data:label.url'>
            <span expr:dir='data:blog.languageDirection'><data:label.name/></span>
          <b:else/>
            <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
          </b:if>
          <b:if cond='data:showFreqNumbers'>
            <span class='label-count' dir='ltr'>(<data:label.count/>)</span>
          </b:if>
        </span>
      </b:loop>
    </b:if>
    <b:include name='quickedit'/>
  </div>
</b:includable>
  </b:widget>
</b:section>
</div>
</div>
</div>
</footer>

Lalu Save Template anda :)
Dan Lihat Hasilnya :)
Jika ada masalah silahkan Komentar dibawahnya :)

Jangan Lupa Tinggalkan Komentarnya yah ! xD

Dan Jangan Lupa Like Fanpages kami dan Share Post ini ! :D

Read More

Cara Membuat DL Box V8

Oi, Coeg kali ini gw mau berbagi tutorial caram membuat DL Box V8,
DL Box ini dibuat oleh bang frozen..... :v

DEMO

---

GOES TO TKP

---

Langsung saja, ikuti Caranya Dibawahnya ^^

Pertama, Silahkan masukkan CSS dibawah ini, diatas </style> / </b:skin>

/* Download Box */
.dlbc1 h3.dl-title{font-size:15px;font-weight:400;font-family:Segoe UI,sans-serif;color:#4C8BD8;padding:15px;padding-left:150px;background-color:#fff;margin-bottom:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.dlbc1.dl-box{background-color:#4C8BD8;position:relative;min-height:130px;margin:10px 0;border:1px solid #4C8BD8;color:#fff;padding-bottom:7px;}
.dlbc1.dl-box:before{content:"";background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0U5mIqMjTojSwcTYIb1SwaH-Mnk6FPqTH90MZb8h6f1-X3jl0KEJT41hUMajps7IKTgdaQtgCXyUQY5C2jEcDgl8vzga9aGyRgwB02R-ltSqsFPSzRAWKf49stb0Aaf8HosLe9MFpz1s/s1600/download_box.png)no-repeat left bottom;background-size:145px;position:absolute;left:0;bottom:0;height:200px;width:150px;}
.dlbc1 .dl-item{padding:7px 0 7px 150px;}
.dlbc1 .dl-item a{color:#fff;background-color:#397dd0;border:1px solid #3373c0;padding:3px 15px;display:inline-block;border-radius:3px;min-width:56px;margin-right:1px;text-align:center;margin-bottom:5px;}
.dlbc1 .dl-anime{padding-top:5px;}
.dlbc1 .dl-item a:hover{background-color:#4C8BD8;color:#fff;}
.dlbc1 .dl-quality{border:1px solid #134f9b;padding:5px;display:block;margin-right:10px;border-radius:5px;color:#fff;background-color:#296bbd;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

Jika sudah diletakkan, Silahkan Save Template ya dahulu

Lalu silahkan Masukkan Kode HTML dibawah ini, di dalam Post / Page anda

<div class='dlbc1 dl-box'><h3 class='dl-title'>Download Arslan Senki &#8211; Episode 08 [Subtitle Indonesia]</h3><div class='dl-item'><span class='dl-quality'>[Fansubs]Arslan Senki &#8211; 08 [720P].mkv</span><br /><div class='dl-anime'><a href='#'>[MF]</a> <a href='#'>[SF]</a> <a href='#'>[TF]</a> <a href='#'>[SB]</a> <a href='#'>[Mirror]</a></div><span class='clear'></span></div><div class='dl-item'><span class='dl-quality'>[Fansubs]Arslan Senki &#8211; 08 [720P].mkv</span><br /><div class='dl-anime'><a href='#'>[MF]</a> <a href='#'>[SF]</a> <a href='#'>[TF]</a> <a href='#'>[SB]</a> <a href='#'>[Mirror]</a></div><span class='clear'></span></div><div class='clear'></div></div>

Pengunjung yang baik, pasti akan meninggalkan Komentarnya,

Biarpun itu Hanya Pertamax! / Sankyuu

Jangan Lupa Like & Share yah ! (y)

Read More

Cara Membuat Tombol Buka Tutup Ala Fansub

Kali ini saya mau berbagi cara membuat tombol buka tutup ala fansub,
kalo nggak salah pernah ada yang request tutorial ini, yang pernah request mana suaranyaaa!!!!

Penampakan Tombolnya

---

Sinopsis

Pada tahun 1972, Apollo 17 menemukan Hypergate, artefak peradaban kuno Mars, di permukaan Bulan. Setelah mendarat, para astronot juga menemukan “Aldnoah” yang sangat mempesona. Terbukalah jalan bagi kolonisasi manusia dan pengembangan Mars. Namun, hal itu menyebabkan munculnya Kekaisaran Vers. Kekaisaran Vers mengklaim kepemilikan terhadap peninggalan Mars serta Aldnoah sebagai teknologi kuno mereka, sehingga menyebabkan konflik berkepanjangan. Setelah kegagalan Putri Asseylum, seorang putri kerajaan Mars, yang turun ke bumi dalam upaya membawa perdamaian antara kedua planet, perang pecah antara Bumi dan Mars. Tentara Mars turun dari langit, menaiki baja raksasa, berniat membasmi umat manusia.

---

Cara pembuatan:
Pertama copy kode dibawah ini diatas </style> atau ]]></b:skin>

.sp-wrap {background: none 0% 0% repeat scroll rgb(233, 233, 230); border-color: rgb(195, 203, 209); border-image-source: none; border-style: solid; border-width: 1px 1px 1px 2px; box-sizing: border-box; clear: both; color: #630000; font-family: Roboto, sans-serif; font-size: 15px; line-height: 21.4285717010498px; margin-bottom: 10px; padding: 0px;}
.sp-head {background: url(http://neosubs.web.id/wp-content/plugins/bbspoiler/img/icon_plus.gif) 0% 50% no-repeat; box-sizing: border-box; color: #2a2a2a; cursor: pointer; font-weight: bold; margin-left: 6px; padding: 2px 14px 4px;text-align: left;}
.sp-body {background: rgb(245, 245, 245); border-top-color: rgb(195, 203, 209); border-top-style: solid; border-top-width: 1px; box-sizing: border-box; height: auto; padding: 2px 6px;}

Setelah itu kalian letakan kode HTMLnya pada postinga kalian

<div class="sp-wrap">
<div class="sp-head">Sinopsis</div>
<div class="sp-body folded">
<p style="text-align: center"><span style="line-height: 1.5">Pada tahun 1972, Apollo 17 menemukan Hypergate, artefak peradaban kuno Mars, di permukaan Bulan. Setelah mendarat, para astronot juga menemukan &#8220;Aldnoah&#8221; yang sangat mempesona. Terbukalah jalan bagi kolonisasi manusia dan pengembangan Mars. Namun, hal itu menyebabkan munculnya Kekaisaran Vers. Kekaisaran Vers mengklaim kepemilikan terhadap peninggalan Mars serta Aldnoah sebagai teknologi kuno mereka, sehingga menyebabkan konflik berkepanjangan. Setelah kegagalan Putri Asseylum, seorang putri kerajaan Mars, yang turun ke bumi dalam upaya membawa perdamaian antara kedua planet, perang pecah antara Bumi dan Mars. Tentara Mars turun dari langit, menaiki baja raksasa, berniat membasmi umat manusia.</span></p>
</div>
</div>

Jangan lupa simpan Script ini di atas kode </head>

<script type='text/javascript'>
/* <![CDATA[ */
var title = {"unfolded":"Klik untuk membuka","folded":"Klik untuk menutup"};
/* ]]> */
</script>
<script type='text/javascript' src='https://googledrive.com/host/0B5JXgBc-xBGTZzF0ZVJSTUVBekU/Spoiler_by_Ardiansyah21.js'></script>

Jika ada masalah silahkan melapor ke ketua RT Setempat,
Karena pa RTnya nggak ada jadi lapor ke ketua RW aja.

Read More

Cara Clipping Mask Gambar Dengan Photoshop

Haii Minna-san , !! :D Udah lama nih mimin gak update Tutorial Mengenai Photoshop :), Yosh Hari ini mimin abis liat di Menu "Request"Ada Pesanan Tutorial Photoshop xD , jadinya langsung aja mimin buat Tutorialnya :D. 
Langsung saja yah , ikuti Caranya dari Mimin :D

Kita Akan Membuat Tutorial "Cara Clipping Mask Gambar Dengan Photoshop". Maksud dari Tutorial ini adalah , kita Akan mencrop Gambar dengan Rapi dan Disatukan Dengan Gambar Background ataupun Shapes :D *Maaf Penjelasan mimin Rumit* hehe :D

Hasilnya akan Seperti ini XD



















Langsung saja kita mulai Tutorialnya :D
1. Siapkan Canvas / Lembar Untuk Meletak Gambar dan Shapesnya.

 

2. Siapkan Gambarnya dan Letakkan Gambarnya di Canvas yang kita buat tadi, Hasilnya seperti Gambar dibawah.

3. (1.)Tambahkan Layer Baru 

(2.)Pilih Shapesnya (Bebas)

(3.)Letakkan Shapes ya di Canvas tersebut , Hasil Seperti Gambar dibawah.

4. Silahkan Letakkan Layer Gambar diatas, Lalu Letakkan Gambarnya Tepat didepan Shapes yang anda letak tadi Hasil Seperti Gambar dibawah.

5. Lalu Klik Kanan Pada Layer 1 (Punya Saya) / Layer Gambarnya, lalu pilih "Create Clipping Mask" , Hasil Seperti gambar dibawah.

6. Dan Lihat Hasil Akhir ^^ Selamat !! :D 
Jika tidak berhasil , Silahkan Ulang dari nomor 1 yah ! :D

Jangan Lupa tinggalkan Komentar anda yah Minna !! :D

Dan Jangan Lupa Like Fanpages ini dan Share post ini !! xD

Read More

HoverFansub V3.5 Template Blogger [ Final + Fixed ]

HOVERFANSUB THEME BLOGGER

Theme Name: HoverFansub Theme Blogger

Version: 3.5 (3 July, 2015)

Designer: Onee-chan

Category: Free Template

Release: 10 June , 2015

Features :

- SEO

- Simple Classic

- Related Posts

- Recommended Series

- Fontawesomes

- 404 Page Not Found

- ETC

Demo Click here Download Click Here

Info : ini adalah Versi Terakhir dari Template HoverFansub
Dan Sebagai Kenyamanan, Saya sudah Men-fix semua Error di Template ini :)
Saya Harap jika anda menggunakan Template ini , Harap Jangan Menghapus Link Credit :)

Read More

Komik 21 V2.0 Blogger Template

Komik21 V2.0 Template Blogger

Theme Name: Komik21 V2.0 Template Blogger

Version: 2.0

Designer: Ardiansyah Twentyone

Category: Free Template

Release: Jum'at, 26 Juni 2015

Features :

- SEO

- Siple

- Fast Loading

- Responssives

- Fontawesomes

- Disqus Comment

- Tombol Back To Top

- ETC

Demo Click here Download Click Here

Template ini masih akan di Update ke versi 2.5 untuk penambahan fitur Related Post dan Gambar yang otomatis jadi Fulsize.
Bagi kalian yang menggunakan template ini, dimohon untuk tidak menghapus link Credit pada Footer ataupun pada HTMLnya.
Jangan lupa berkomentar coeg..... walaupun cuma cingcong PERTAMAX doang!!!!
Sekian dan Terima Gajih......

Read More