Ads 720 x 90

Motivasi Menulis
Home » Penelusuran Other

Cara Membuat Background Anime Seperti Fansub

Cara Membuat Background Anime Seperti Fansub - Background Anime di Fansub / Fanshare biasanya berada di sebelah kiri dan kanan kontennya. Background Anime berguna untuk memperbagus tampilan pada Fansub / Fanshare.

Cara Membuat Background Anime Seperti Fansub, Cara Membuat Background Seperti Fansub, Cara Membuat Background di Kiri dan Kanan Seperti Fansub, Cara Membuat Background Anime di Kiri dan Kanan, Tutorial Membuat Background Anime Seperti Fansub

Pada Kesempatan kali ini saya ingin berbagi tentang Cara Membuat Background Anime Seperti Fansub atau Fanshare. Untuk membuat Background Anime Fansub caranya cukup mudah, jika ingin membuatnya kamu hanya tinggal mengikuti dua langkah di bawah ini.


  • Pertama, Buka Blogger > Edit HTML > Salin, Terapkan dan Simpan Kode di bawah ini sebelum </b:skin> atau </style>

/* CSS Background Anime Fansub - Aka321 */
body {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHv2-gz4YqAofmq5Fa8VeNMD-uV304VgFEf_Pty830ysR4uALrEM719ItW214EydT1V1niEyLHqbOb_p-3376cAJ17jC8QXpX0rOkssnJExwh_kHDSr_qh_PI27DsuS-_ow9qlTdlv4HY/s1600/bgleft3.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjfrhFAWbN0m3dVYxd581UZo2fpxD571pCNzf-vrdikJCZU3rYXpU74MRdZF5Vpa6Rtmms-Qf-HdOoAvDYbhgGkDIiLolX4odMiQnm1rVw_yDHLJZ3drQP8W6XQw4uNc7CDYOHz9GU8q0/s1600/bgright3.png) !important;
background-repeat: no-repeat !important;
background-attachment: fixed !important;
background-position: top left,top right !important;
background-size: auto auto, auto auto !important;
}

  • Jika sudah, silahkan kamu mengganti kode yang sudah ditandai dengan LINK atau URL Gambar yang ingin dijadikan Background. Simpan Template, dan lihatlah hasilnya.


Sekian ilmu yang dapat saya bagikan hari ini. Semoga bermanfaat. Terima kasih. Sampai jumpa di tutorial selanjutnya.

Cara Membuat Random Background

Cara Membuat Random Background - Pernahkah kamu melihat background yang berganti-ganti secara acak saat kamu merefresh website tersebut? Background yang berganti-ganti itu biasanya dibuat menggunakan script. Tetapi harus diketahui jika kamu menggunakan random background ini, websitemu akan berkurang kecepatan loadingnya. Ini dikarenakan setiap kali kita merefresh halaman kita akan meload gambar yang berbeda.

Cara Membuat Random Background di Blogger, Cara Membuat Random Background di Blogspot, Cara Membuat Random Background Seperti Fansub, Cara Membuat Background Ganti Saat di Refresh, Cara Membuat Background Acak, How To Create Random Background on Refresh, How To Create Multi Random Background, Cara Membuat Fansub, Cara Membuat Widget Fansub, Tutorial Fansub, Website Fansub, Aka321, Aka321.blogspot.com

Bagi kamu yang mempunyai website fansub atau fanshare random background ini cocok untuk memperbagus website kamu. Sebelumnya saya memposting tentang pembuatan background parallax, yaitu Cara Membuat Background Parallax Seperti Tiramisubs, dan pada kesempatan kali ini saya ingin berbagi ilmu tentang Cara Membuat Random Background. Langsung saja mari ikuti langkah-langkah yang ada di bawah ini.

Cara Membuat Random Background


  1. Buka Blogger > Edit HTML > Salin dan Terapkan kode di bawah ini sebelum </body>.

    2. <script type='text/javascript'>
    var Background= new Array()
    Background[0]='#FFF url('#IMG') no-repeat top center fixed'
    Background[1]='#FFF url('#IMG') no-repeat top center fixed'
    Background[2]='#FFF url('#IMG') no-repeat top center fixed'
    Background[3]='#FFF url('#IMG') no-repeat top center fixed'
    var random=Math.floor(4*Math.random());
    document.write('<style>');
    document.write('body {');
    document.write('background: '+ Background[random] +';');
    document.write('background-size:100%;');
    document.write(' }');
    document.write('</style>');
    </script>

  2. Jika sudah, silahkan kamu mengganti kode yang sudah ditandai sesuai keinginanmu, dan silahkan di simpan template lihat bagaimana hasilnya.

KodePengaturan
#IMG
Ganti dengan URL atau Link gambar yang ingin dipasang.

Live Preview

Sekian postingan kali ini semoga bermanfaat untuk kalian, jangan lupa di bagikan ke teman-teman, dan jika ada yang ingin ditanyakan silahkan bertanya di kolom komentar. Sampai jumpa di tutorial berikutnya Terima kasih.

Cara Membuat Background Parallax Seperti Tiramisubs

Cara Membuat Background Parallax Seperti Tiramisubs - Mungkin ada dari kalian yang belum tahu apa itu parallax. Apa itu Parallax? Parallax Scrolling adalah suatu desain web yang dimana background yang berada di belakang bergerak lebih lambat dari pada bacground yang berada di depan. Parallax Scrolling akan memberikan kesan 3D jika diterapkan pada objek 2D. Contohnya kita akan merubah objek 2D menjadi tampak seperti objek 3D karena seakan-akan objek-objek tersebut mempunyai jarak dan pergerakan yang berbeda.

Cara Membuat Background Parallax Seperti Tiramisubs, Tutorial Membuat Background Parallax Seperti Tiramisubs, Cara Membuat Background Seperti Tiramisubs, Cara Membuat Background Bergerak Seperti Tiramisubs, Background Bergerak Tiramisubs, How To Create Parallax Background, How To Create Simple Parallax, Cara Membuat Fansub, Cara Membuat Widget Fansub, Tutorial Fansub, Website Fansub, Aka321, Aka321.blogspot.com

Parallax scrolling ini di terapkan oleh fansub yang cukup terkenal dengan subtitlenya yang rapih yaitu Tiramisu fansub atau yang biasa dikenal Tiramisubs. Tiramisubs menerapkan parallax scrolling untuk gambar backgroundnya. Sebelumnya saya memposting tentang pembuatan spoiler, yaitu Cara Membuat Spoiler Seperti Kaskus, dan pada kesempatan kali ini saya ingin berbagi ilmu tentang Cara Membuat Background Parallax Seperti Tiramisubs. Langsung saja mari ikuti langkah-langkah yang ada di bawah ini.

Cara Membuat Background Parallax Seperti Tiramisubs


  1. Buka Blogger > Edit HTML > Salin dan Terapkan kode di bawah ini sebelum </b:skin> atau </style>.

    2. /* CSS Parallax Background Tiramisub - Aka321 */
    .pstsback1{background: url(http://s5.postimg.org/xuvfoh9d3/back11.jpg) repeat;background-size: 100% auto;position: fixed;width: 100%;height: 300%;top: 0;left: 0;z-index: -3;}
    .pstsback2{background: url(http://s5.postimg.org/9seltlspz/para11.png) repeat;background-size: 35%;position: fixed;width: 100%;height: 300%;top: 0;left: 0;z-index: -2;opacity: 0.7;}
    .pstsback{background: url(http://s5.postimg.org/81vks4b6v/para11a.png) repeat;background-size: 35%;position: fixed;width: 100%;height: 300%;top: 0;left: 0;z-index: -2;opacity: 0.7;}

  2. Setelah itu, salin dan terapkan kode di bawah ini Sesudah <body> atau <body ... >

    3. <div class='psts321'>
     <div class='pstsback1' data-parallax='true' data-speed='0.1' data-direction='up'></div>
     <div class='pstsback2' data-parallax='true' data-speed='0.5' data-direction='up'></div>
     <div class='pstsback3' data-parallax='true' data-speed='0.3' data-direction='up'></div>
    </div>

  3. Jika sudah, salin dan terapkan kode di bawah ini Sebelum </body>

    4. <script type='text/javascript'>
    $(document).ready(function(){function draw(){requestAnimationFrame(draw);scrollEvent();}draw();});function scrollEvent(){if(!is_touch_device()){viewportTop=$(window).scrollTop();windowHeight=$(window).height();viewportBottom=windowHeight+viewportTop;if($(window).width())$('[data-parallax="true"]').each(function(){distance=viewportTop*$(this).attr('data-speed');if($(this).attr('data-direction')==='up'){sym='-';}else{sym='';}$(this).css('transform','translate3d(0, '+sym+distance+'px,0)');});}}function is_touch_device(){return'ontouchstart'in window||'onmsgesturechange'in window;}
    </script>

  4. Jika sudah, silahkan kamu mengganti kode yang sudah ditandai sesuai keinginanmu, dan silahkan di simpan template lalu lihat bagaimana hasilnya.

KodePengaturan
http://s5.postimg.org/xuvfoh9d3/back11.jpg/, http://s5.postimg.org/9seltlspz/para11.png/, http://s5.postimg.org/81vks4b6v/para11a.png/
Ganti dengan URL/Link gambar parallax.
0.1 / 0.5 / 0.3
Ganti dengan kecepatan background parallax yang diinginkan.

Live Preview

Sekian postingan kali ini semoga bermanfaat untuk kalian, jangan lupa di bagikan ke teman-teman, dan jika ada yang ingin ditanyakan silahkan bertanya di kolom komentar. Sampai jumpa di tutorial berikutnya Terima kasih.

Cara Membuat Spoiler Seperti Kaskus

Cara Membuat Spoiler Seperti Kaskus - Spoiler, mungkin jika kamu sudah pernah mengunjungi forum Kaskus atau melihat Thread di Kaskus. Kamu akan menemukan Quote atau yang biasa disebut Spoiler. Fungsi Spoiler juga bermacam-macam contohnya yaitu, membantu kita dalam menghemat tempat, ataupun membantu mempercepat load dari suatu halaman dimana nanti si pembaca memilih untuk membuka atau tidak Spoiler tersebut.

Cara Membuat Spoiler Seperti Kaskus, Cara Membuat Spoiler Kaskus, Cara Membuat Quote Kaskus, Cara Membuat Tombol Hide dan Show

Dan pada kesempatan kali ini saya ingin berbagi ilmu tentang Cara Membuat Spoiler Seperti Kaskus di Blogger. langsung saja kamu ikuti langkah-langkah yang ada di bawah ini.

  • Pertama, buka Blogger > Edit HTML > Salin dan Terapkan Kode di bawah ini sebelum </b:skin> atau </style>

/* CSS Spoiler Kaskus - Aka321 */
#spoiler {margin: 1em 0;color: #000;}
#spoiler img {max-width: 100%;}
#spoiler iframe {max-width: 100%;}
.txtspoiler{margin-bottom: 2px;font-weight: 400;font-size: 11px;padding: 3px 0;font-family: sans-serif;height: 20px !important;}
#btnshow{background: #ccc!important;border-radius: 3px;cursor: pointer;width: 40px!important;border: none;font-size: 10px;margin: 0px;padding: 0px;font-family: inherit;height: 14px;}
#btnhide{background: #ccc!important;border-radius: 3px;cursor: pointer;width: 40px!important;border: none;font-size: 10px;margin: 0px;padding: 0px;font-family: inherit;display:none;height: 14px;}
#contentspoiler{background: #EEE;border: 1px solid #CCC;color: black;margin: 0px;padding: 6px;}
.isispoiler{display: block;background: rgb(238, 238, 238);}

  • Setelah itu, salin dan Terapkan kode dibawah ini sebelum </body>.

<script type = 'text/javascript'>
$(document).ready(function() {
    $('#btnshow').click(function() {
        $('#btnshow').hide();
        $('#btnhide').show();
        $('.isispoiler').show();
    });
    $('#btnhide').click(function() {
        $('#btnhide').hide();
        $('#btnshow').show();
        $('.isispoiler').hide();
    });
});
</script>

  • Jika Sudah, silahkan Simpan Template.

  • Selanjutnya saat kamu membuat postingan baru dan ingin menambah spoiler pada postingan tersebut, silahkan Salin dan Terapkan kode di bawah ini di postingan Tab HTML (Bukan Compose).

<div id="spoiler">
 <div class="txtspoiler">
  <b>Spoiler</b>
  &nbsp;for
  <i>Judul Spoiler</i> :
  <input id="btnshow" onclick="spoiler(this);" type="button" value="Show"/>
  <input id="btnhide" onclick="spoiler(this);" type="button" value="Hide"/>
 </div>
 <div id="contentspoiler">
  <div class="isispoiler">
   <div class="texty">

    Isi Spoiler

   </div>
  </div>
 </div>
</div>

  • Setelah itu, ubahlah Kode yang sudah ditandai sesuai yang kamu inginkan. Selesai.


Sekian ilmu yang saya bagikan hari ini. Semoga bermanfaat. Sampai jumpa di tutorial selanjutnya.

Tutorial Membuat Lagu Menjadi Nightcore

Tutorial Membuat Lagu Menjadi Nightcore - Nightcore adalah suatu musik yang memiliki ritme nada yang cepat. Nightcore tercipta apabila kita mengubah Speed serta Pitch lagu orisinil  menjadi 20% - 30% atau bahkan bisa lebih.

Tutorial Membuat Lagu Menjadi Nightcore, Cara Membuat Lagu Menjadi Nightcore, How To Make Nightcore Music, How To Make Nightcore Video, How To Make Anime Nightcore Music.

Dan pada kesempatan kali ini Saya akan berbagi ilmu tentang Tutorial Membuat Lagu Nightcore. Langsung saja kita buat lagu Nightcorenya dengan mengikuti langkah-langkah yang ada di bawah ini.

Sebelum memulai langkah-langkahnya Kamu harus mempunyai Software untuk mengubah lagu menjadi Nightcore. Dan pada kesempatan kali ini saya memakai Software Audacity, dan Softwarenya bisa anda download disini : Download Audacity

  1. Cari lagu yang terdengar bagus untuk dijadikan Nightcore. Ketika membuat lagu Nightcore Saya menyarankan untuk mencari lagu lambat dengan vokal Perempuan. Ini biasanya pilihan yang terbaik.
  2. Jika sudah mendapatkan lagunya, Import lagunya ke Audacity "File > Import > Audio"
  3. Lalu Klik "Effect > Change Pitch". Tingkatkan Pitch antara 10 sampai 30% atau bisa lebih jika masih kurang pas.
  4. Setelah itu Klik "Effect > Change Tempo". Tingkatkan Tempo antara 10 sampai 30% atau bisa lebih jika masih kurang pas.
  5. Apabila sudah semua, sekarang kita simpan lagunya. Klik "File > Ekspor" simpan lagu dalam format yang kamu inginkan.

Dan itulah langkah-langkah untuk Membuat Lagu Menjadi Nightcore. Apabila masih kurang begitu jelas Kamu bisa menonton video cara membuat lagu Nightcore-nya di bawah ini.


Sekian Ilmu yang saya bagikan hari ini. Dan apabila masih kurang jelas anda bisa berkomentar dibawah. Semoga bermanfaat. Terima kasih.
Back To Top