Tampilkan postingan dengan label Blog. Tampilkan semua postingan
Tampilkan postingan dengan label Blog. Tampilkan semua postingan

Rabu, 11 April 2012

Upload Audio Mp3 Pada Hosting File

Jumpalagi Teman-teman pembaca blog AapaajA, kesempatan kali ini kita akan membahas tentang Upload Audio Mp3 Pada Hosting File , sebelumnya kita tentu perlu mengetahui apa aja kegunaannya yang dapat kita dapatkan dari Upload ini. Diantaranya tentusaja kita dapat menyimpan file secara online di dunia maya selain itu kita dapat memanfaatkannya untuk keperluan lain seperti yang Blog Aapaaja lakukan yaitu memmanfaatkannya untuk file sumber alamat akses yang di gunakan untuk background music blog. Ok kita lanjutkan saja bagaimana caranya.

  • Masukkan alamat tempat hosting file, dalam hal ini kita akan menggunakan web hosting www.dropbox.com
Create an account dan Sign In

Registrasi
  • lakukan registrasi seperti biasa pada create an account masukkan data email dan password.
  • setelah registrasi selesai lanjutkan ke halaman utama pada bagian kiri halaman terdapat menu dropbox pilih.
Menu Dropbox
  • Pilih folder public, lakukan tahan file yang akan di upload ke halaman ini atau cara manual choose files dengan memilih icon upload di bagian atas tunggu loading dan pilih choose files pilih file yang akan di upload.
Cara Drop

Cara Dengan Upload Choose Files

  •  Agar file yang kita upload dapat di gunakan nanti kita perlu alamat file di dalam web hostingnya. lakukan klik kanan pada file pilih copy public link.
Copy Public Link

Sampai di sana kita telah mengetahui bagaimana cara upload file di dropbox. Sekian dari Blog Aapaaja kali ini selesai sudah, sampai jumap pada pembahasan yang berbeda dan waktu yang berbeda pula. Terima kasih atas kunjungannya.
Read More..

Sabtu, 24 Maret 2012

Batasan Batasan Apa Saja yang Berlaku Pada Saat ngeBlog



Pada pembahasan kali ini kita akan membahas apa aja batasan yang perlu di ketahui dalam menuli di blog. Untuk itu kita perlu membahasnya. Ini dia beberapa diantaranya.

Tidak ada ruginya memiliki akun blogger, karena blogger dengan blogspotnya telah memberikan serba unlimited bagi para penggunanya. Artinya tidak ada batasan berapapun jumlah blog yang dibuat, jumlah postingan, jumlah komentar dan lain sebagainya.

Syarat utama dalam pembuatan blog adalah anda harus mempunyai email (Gmail), apabila anda belum punya cepatlah mendaftar agar anda dapat membuat blog sebanyak-banyaknya. Contohnya saya ini mempunyai blog lebih dari sepuluh, dan semuanya menggunakan akun yang sama.

Berapa sih batas maximal blog yang dibuat dalam satu akun blogger ?
Untuk menjawab Batas maximal blog dan ugarampainya dalam satu akun blogger, berikut ini saya posting keterangan yang saya ambil dari Blogger Bantuan.
Silahkan disimak baik-baik




Jumlah Blog Dalam Satu Akun

Anda dapat membuat blog sebanyak yang Anda inginkan dalam satu akun blogger.




Jumlah Postingan

Tidak ada batasan untuk jumlah postingannya, juga blogger tidak akan menghapus postingan Anda kecuali Anda hapus secara manual baik sudah di publish atau masih sebagai draft.




Ukuran Postingan

Tidak ada batasan mengenai ukuran postingan. Jadi Anda bisa membuatnya sangat panjang atau sangat berat. Namun perhatikan juga point berikutnya.




Ukuran Halaman

Untuk halaman utama blog dan halaman arsip dibatasi hingga 1 MB. Ini dapat menampung ratusan halaman teks. 




Jumlah Komentar

Satu posting dapat menampung sangat banyak komentar. Jika Anda menyembunyikan komentar yang ada, masih tetap disimpan di akun Anda dan bisa ditampilkan sewaktu-waktu kecuali Anda hapus permanen manual.




Jumlah Foto

Memiliki batas hingga 1GB. Setiap foto yang di masuk postingan Anda akan otomatis masuk ke album Picasa. 




Ukuran Gambar

Jika Anda posting menggunakan selular, maka masing-masing foto maksimal seberat 250K.




Anggota Tim

Dibatasi maksimal 100 orang untuk tiap blog.




Jumlah Label

Setiap blog maksimal memiliki 2000 label berbeda dan setiap postingan dibatasi maksimal 20 label.




Deskripsi Blog

Saat Anda set deskripsi blog di akun blogger Anda, Anda hanya bisa masukkan maksimal 500 Karakter.




About Me/Tentang Saya

Untuk informasi diri Anda, dibatasi hingga 1200 karakter.




Profil Minat dan Favorit

Di kolom isian profil blogger, selain about me Anda juga bisa isikan berbagai data seperti minat dan favourite. Masing-masing kolom dibatasi hingga 2000 karkater.

Nah sekian dulu pembahasan kita kali ini, Semoga bermanfaat.



 Sumber :
Read More..

Senin, 05 Desember 2011

Modifikasi Link Home, Posting Lama dan Posting Lebih Baru dengan Gambar

Jumpalagi Teman-teman pembaca blog AapaajA, kesempatan kali ini kita akan membahas tentang Modifikasi Link Home, Posting Lama dan Posting Lebih Baru dengan Gambar seperti yang ada di setiap blog bahwa pada bagian bawah setiap postingan ada link yang menujukan kita pada halaman posting lama, postingan lebih baru dan halaman utama yang berbentuk kalimat. Teman-teman tentu sering melihat pada kunjungan beberapa blog link untuk halaman ini berupa gambar. Nah bagai mana caranya? mari kita bahas caranya.

Sebelum kita mulai yang perlu kita lakukan adalah menyiapkan gambarnya terlebih dahulu, hal ini tergantung kreatifitas kreasi Teman-teman. silahkan di cari atau Teman-teman juga dapat mencobanya dengan gambar yang sudah saya sediakan di topik sebelumnya Koleksi Macam-macam icon untuk Blog Kita. Baiklah sekarang kita lanjutkan penerapan Modifikasinya.

1. Lakukan login ke blog kita seperti biasa
2. Lanjutkan ke Rancangan > Edit HTML > centang Expand Template Widget
3. Aktifkan fasilitas pencari atau find masukkan cari kode berikut

<data:newerPageTitle/> kode untuk posting terbaru terletak di kiri
<data:olderPageTitle/> kode untuk posting lama terletak di kanan
<data:homeMsg/> kode untuk halaman utama

Setelah ketemu ganti degan kode berikut dan berikan alamatnya pada tulisan ber warna kuning.

<img src='berikan alamat gambar sesuai keinginan dan sesuaikan dengan typenya'/>

4. yang terakhir simpan  template, Mudahkan Teman-teman :)

untuk pemberia alamat gambar sesuaikan ya Teman-teman. Akhirnya pembahasan kita kali ini selesai sudah, sampai jumap pada pembahasan yang berbeda dan waktu yang berbeda pula. Terima kasih atas kunjungannya.
Read More..

Menambah Efek Salju pada Halaman Blog

Apakabar Teman-teman pembaca Blog Aapaaja, kali ini kita akan membahas bagaimana cara menambah efek salju pada halaman blog kita. jadi halaman blog kita akan terlihat seperti ada butiran-butiran salju yang jatuh. Efek salju ini akan bergerak mengikuti arah peregerakan pointer bagaikan terhembus angin. Agar tidak penasaran terlalu lama mari kita praktekkan saja. Berikut langkah-langkahnya :

1. Langkahnya bakalan singkat, pertama lakukan login seperti biasa di blog
2. Pilih tab Rancangan > Edit HTML > buka fasilitas find
3. Sebelum dilanjutkan jangan lupa backup template dengan cari download pada bagian atas editor template
4. cari code <head> lalu salin script berikut diatasnya :

<script src='http://projectjqueryku.googlecode.com/files/Snowefek2%20oketrik.js' type='text/javascript'/>

5. Terakhir simpan template.

Sekian saja dari blog AapaajA semoga bermanfaat bagi Teman-teman, sampai ketemu lagi dipembahasan berikutnya. Akhir kata Blog AapaajA Terimakasih Atas kunjungannya.
Read More..

Koleksi Macam-Macan Icon Untuk Blog Kita

Apakabar Teman-teman Blog AapaajA posting yang satu ini sengaja di buat untuk pengguanan icon silahkan save dan dipergunakan seperlunya. Oke sekian dari blog AapaajA.



Read More..

Minggu, 04 Desember 2011

Efek Refresh Auto Pada Blog

Apa kabar Teman pembaca blog Aapaaja semoga kita senantiasa diberikan keberkahan akan ilmu yang kita dapatkan kali ini, sehinja kita semakin lama semakin haus akan ilmu pengetahuan yang akan membawakita kepada kecerdasan. Kali ini kita akan membahasa bagaimana Efek Refresh Autu Pada Blog dapak dilakukan dan bagaimana caranya. Efek Refresh Auto ini merupakan suatu cara agar suatu halaman blog yang sedang dibuka dapat melakukan refresh secara auto maka efek refresh ini mempunyai fungsi yang sama dengan yang ada di aplikasi browse kita yang membedakan hanya Autonya.
Ok Teman-teman kita lanjutkan Prakteknya ini dia langkahnya :

1. Lakukan login pada blog kita
2. Pilih tab Perancangan > Edit HTML > lakukan pencarian <head>
3. Pastekan script berikut sebelum <head> tersebut.

<meta http-equiv="refresh" content="300"/>

:) saya rasa Teman-teman sudah mengerti maksud dari scriptnya, untuk isi dari content merupakan satuan detik jadi kalau kita set 60 = 1 menit. Nah sebaiknya jika Teman-teman ingin memanfaatkannya set parameternya jangan terlalu dekat jedanya ya. Bayangkan aja jika pengunjung kita sedang membaca, tiba-tiba halaman refresh bisa saja mengganggu konsentrasi. Sekian dari Blog Aapaaja semoga bermanfaat, sampai ketemu lagi di kesempatan yang lain.
Read More..

Menggunakan Spoiler Untuk Posting Blog

Apa kabar Teman-teman blog Aapaaja, kali ini kita akan membahas tentang Spoiler yang biasa dipergunakan pada saat tertentu untuk menyembunyikan beberapa isi dari atrikel. Spoiler merupakan cara yang digunakan untuk menyembunyikan tulisan, link, gambar, video, dan bagian bagian lain yang biasa dipergunakan untuk kebutuhan suatu artikel atau bisa juga pembagasan. Kegunaan spoiler ini adalah untuk menyembunyikan isi tertentu dari pembahasan topik bisa juga di gunakan dalam forum namun suatu forum biasanya menggunakan code yang telah di sediakan, selain itu juga dapat mengurangi ruang space dan pembaca dapat meload halaman dengan lebih cepat.


Ayo kita mulai saja prakteknya agar tidak berbelit-belit. Kita akan bahas 3 macam ini dia silahkan :

1. Menggunakan Spoiler tanpa warna background.

<div id="spoiler">
<div><input style="font-size: 11px; font-weight: bold; margin: 5px; padding: 0px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display = ''; this.parentNode.parentNode.getElementsByTagName('div')['hide'].style.display = 'none'; this.innerText = ''; this.value = 'Sembunyikan'; } else { this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display = 'none'; this.parentNode.parentNode.getElementsByTagName('div')['hide'].style.display = ''; this.innerText = ''; this.value = 'Lihat'; }" name="button" type="button" value="Contoh Spoiler Tanpa Warna Background" /></div>
<div id="show" style="border: 1px solid white; display: none; margin: 5px; padding: 2px; width: 98%;">
<p style="text-align: justify;">Spoiler merupakan cara yang digunakan untuk menyembunyikan tulisan, link, gambar, video, dan bagian bagian lain yang biasa dipergunakan untuk kebutuhan suatu artikel atau bisa juga pembagasan. Kegunaan spoiler ini adalah untuk menyembunyikan isi tertentu dari pembahasan topik bisa juga di gunakan dalam forum namun suatu forum biasanya menggunakan code yang telah di sediakan, selain itu juga dapat mengurangi ruang space dan pembaca dapat meload halaman dengan lebih cepat.</p>
</div><div id="hide"></div></div></div>

Contoh :


2. Menggunakan Spoiler dengan warna background dan border.

<div id="spoiler">
<div><input style="font-size: 11px; font-weight: bold; margin: 5px; padding: 0px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display = ''; this.parentNode.parentNode.getElementsByTagName('div')['hide'].style.display = 'none'; this.innerText = ''; this.value = 'Sembunyikan'; } else { this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display = 'none'; this.parentNode.parentNode.getElementsByTagName('div')['hide'].style.display = ''; this.innerText = ''; this.value = 'Lihat'; }" name="button" type="button" value="Contoh Spoiler Dengan Border dan Warna Background" /></div>
<div id="show" style="border: 1px solid white; display: none; margin: 5px; padding: 2px; width: 98%;">
<div style="color: #000000; background: none repeat scroll 0% 0% #ebf3fb; border: 1px solid #aaccee; padding: 7px; margin: 0px;">
<p style="text-align: justify;">Spoiler merupakan cara yang digunakan untuk menyembunyikan tulisan, link, gambar, video, dan bagian bagian lain yang biasa dipergunakan untuk kebutuhan suatu artikel atau bisa juga pembagasan. Kegunaan spoiler ini adalah untuk menyembunyikan isi tertentu dari pembahasan topik bisa juga di gunakan dalam forum namun suatu forum biasanya menggunakan code yang telah di sediakan, selain itu juga dapat mengurangi ruang space dan pembaca dapat meload halaman dengan lebih cepat.</p>
</div><div id="hide"></div></div></div>


Contoh :


3. yang terakhir Mengguanakan Spoiler pada gambar.

<div id="spoiler"><div>
<input style="font-size: 11px; font-weight: bold; margin: 5px; padding: 0px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display = ''; this.parentNode.parentNode.getElementsByTagName('div')['hide'].style.display = 'none'; this.innerText = ''; this.value = 'Sembunyikan'; } else { this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display = 'none'; this.parentNode.parentNode.getElementsByTagName('div')['hide'].style.display = ''; this.innerText = ''; this.value = 'Lihat'; }" name="button" type="button" value="Contoh Dengan Gambar" /></div>
<div id="show" style="border: 1px solid white; display: none; margin: 5px; padding: 2px; width: 98%;">
<img class="aligncenter" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2jws7PcygIxIxYXgg5wJX5iqYNXaEKMFFPFxPgBmogmzCD8FmXnTTCn2braFkZVcQNkrg7rXq9yDgCG5y1wyhQjk938p_9ZcoieHy2EP78ba6uy8cckATwzcgQ6b_tOxGmrlxZtbJ9xw/s1600/SpoilerButton.jpg" alt="spoiler" width="300" height="280" />
</div><div id="hide"></div></div></div>


Contoh :

Read More..

Kamis, 01 Desember 2011

Modifikasi Sudut Tabel Pada Blog

Apakabar Teman-teman blog Aapaaja hari ini. Hari ini kita akan membahas bagai mana cari Modifikasi Sudut Tabel pada Blog setidaknya tidak terlihat biasa-biasa saja. Sebelumnya kita telah membahas bagainama Menambahkan Tabel Pada Posting Blog Kita, namun pada pembahasan tersebut kita hanya mengetahui pembuatan tabel dengan cara biasa. Kali ini kita akan membuat tabel jadi berbeda dengan Modifikasi Sudut Tabel Pada Blog kita. untuk modifikasinya sendiri kita perlumengetahui bahwa semakitin bagus maka wajarnya konten yang kita prioritaskan adalah kenyamanan sehingga untuk konsekwensinya kita harus tahu semakin bagus maka semakin berat untuk mengaksesnya kecuali teknologi kita telah setara dengan konten kita, namun kenyataannya masih banyak yang terkendala degan berbagai alasan tertentu misalnya grafis card, akses internet, bayanknya widget yang dipasang untuk mempercantik tampilan. He.. jadi membahasnya terlalu jauh, baik agar mempersingkat waktu kita langsung saja ke praktek y.


Kode yang akan kita gunakan berbeda dengan pembahasan sebelumya yaitu Menambahkan Tabel Pada Posting Blog maka kode kali ini kita menggunakan <div> dan ditutup dengan </div>. Nah ini scriptnya silahkan Teman-teman perhatikan ya...

Pertama tabel yang tanpa scroll
<div style="background: none repeat scroll 0% 0% rgb(0, 0, 70); border-radius: 10px 10px 10px 10px; border: 3px solid rgb(255, 255, 255); padding: 10px; text-align: left; width: 90%;">
Disini Teman-teman dapat memberikan isinya.. Silahkan n_n
</div>

Seterunya yang kedua pakai scroll, ini dia scriptnya
<div style="background: none repeat scroll 0% 0% rgb(0, 0, 70); border-radius: 10px 10px 10px 10px; border: 3px solid rgb(255, 255, 255); height: 200px; overflow: auto; padding: 10px; text-align: left; width: 90%; width: ancho;">
diasini Teman-teman masukkan isi dari tabelnya
</div>

Dari script diata Teman-teman dapat berkreasi dingan menukar parameternya seperti :
1. background none repeat scroll rgb(0, 0, 70) mrupakan warna kombinasi dari red green blue (merah hijau biru). Merupakan warna untuk background tabel.
2. border-radius ada 4 sudut kelengkunyan Kita bisa modifikasi sesuai dengan kienginan.kiti atas, kanan atas, kanan bawah, kiri bawah.
3. bordre untuk yang px adalah ukuran ketebalan, dan rgb untuk warnanya sama dengan tadi yang membedakan antara satu sama lain background dan border.
4. overflow merupakan parameter scroll.

Baiklah sekian dari blog AapaajA semoga bermanfaat, sampai ketemulagi kita pada topik berikutnya. Terimakasih...
Read More..

Rabu, 30 November 2011

Menambahkan Tabel Pada Posting Blog

Apa Kabar Teman-teman. Kali ini Blog Aapaaja ingin membahas bagai mana menambahkan tabel pada posting Blog yang merupakan pengembangan ide cara berposting. Mengapa kita menambahkan table pada posting blog kita? hal ini saya bahas karna pada postingan yang sebelumnya saya menginginkan adanya suatu tambahan pada beberapa posting yang membutuhkan tulisan kushus agar dapat terfokus dalam tulisan di dalamnya. Selain itu posting yang kita buat akan menjadi tidak terlalu kaku oleh fasilitas menulis pada blog yang biasa kita gunakan untuk memposting. Hal lainnya Teman-teman yang juga jadi mandiri dan terbiasa dengan yang namanya kode tabel. Mmmm.... kita lanjut ke pembahasan inti kita yaitu menambahkan tabel pada posting blog kita.



Mari kita lakukan langkah berikut :
1. Hal pertama yang kita lakukan masuk ke blog kita login seperti biasa, setelah login Teman-teman dapat melihat tab posting yang ada di bagian kiri atas pilih kemudian lihat sub tab dan pilih Entri Baru.
2. Disaat Teman-teman telah memilih Entri Baru terlihat seperti biasa di dalam entri untuk postin kita ada dua type yaitu Compose dan Edit HTML. Kedua Mode ini memiliki kelebihan dan fungsi yang berbeda. Apa bila kita akan sekedar coba menambahkan tabel besa langsung menggunakan modus Edit HTML dan apa bila teman ingin peraktekkannya sambil posting sekaligus akan membuat tabel y.... silahkan buat tulisan postingnya dulu sampai akan menggunakan tabel pada posting. Pilih Edit HTML dan lakukan dengan pemberian kode berikut :

<table border="1">
<tr>
<td>isi 1 </td>
<td>isi 2</td>
<td>isi 3</td>
</tr>
<tr>
<td>isi 1</td>
<td>isi 2</td>
<td>isi 3</td>
</tr></table>

Sekarang mari kita pahami apa saja yang maskud dari kode tersebut.
1. <table> kode untuk tabel pembuka sedangkan yang penutup di tambah dengan tanda / (gari miring)
2. <tr> kode ini untuk baris dan diakhiri dengan </tr>
3. <td> kode ini untuk colom dan diakhiri dengan </td>

Berikunya Kita lanjutkan tabel yang berisi tambahan kode, biar jelas langsung saja seperti ini

<table border="1" width="450">
 <tr bgcolor="#F2F2F2">
  <td align="center"><b>isi 1</b></td><td align="center"><i>isi 2</i></td><td align="center">isi 3</td>
  </tr>
</table>
<table border="1" width="450">
  <tr bgcolor="#F2F2F2">
  <td align="center"><b>isi 1</b></td><td align="center"><i>isi 2</i></td><td align="center">isi 3</td>
 </tr>
</table>

Disini kita dapat melihat perbedaannya ada beberapa tambahan.
1. border dengan ini kita bisa memberikan border dengan satuan angka
2. width dan height dengan ini kita bisa memberikan lebar yang kita inginkan satuan angka juga
3. align kita dapat menggunakannya sebagai pengaturan posisi letak isi tabel dengan isi right, left, center dan justify
4. untuk pemberian warna bacground kita bisa menggunakan tambahan kode bgcolor dengan satuan kode tandapagar dan angka 0 sanpai F contohnya seperti di atas.

setelah kode tersebut di terapkan pada Edit HTML kira-kira hasilnya seperti berikut :

Contoh 1
isi 1 isi 2 isi 3
isi 1 isi 2 isi 3

Contoh 2
isi 1isi 2isi 3
isi 1isi 2isi 3

Sekarang kita sudah tahu bagaimana caranya yang kadang membuat kita bingung adalah waktu kita mengisi tabelnya dengan tulisan. Hal ini penulis sendiri pernah mengalaminya yaitu pada saat kita mengisi tabel pada posting namun kembali ketujuan kita, untuk apa kita menggunakan tabel ini de posting kita? Penulis sendiri menggunakanya untuk tulisan kode maka disaat kita menggunakan kode ini sebagai isi posting maka kita gunakan type Compose yaitu tepe menulis sehingga sekalipun kita mengetikkan code maka tetap tampil sebagai tulisan. Baiklah sekian dulu Pembahasan Blog AapaajA dan sampai jumpa pada topik yang menarik berikutnya, terimakasih.
Read More..

Memasang Tombol Back to Top pada Blog dengan Efek Jquery Smooth

Apakabar Teman-teman blog Aapaaja, kali ini kita akan membahas bagaimana cara membuat tombol back to top. Pembahasan kali ini hampir sama dengan pembahasan sebelunya yaitu Tombol Back to Top pada Blog yang merupakan pemberian tombolnya dengan cara yang hampir sama yang membedakan hanya pada kodenya yang sederhana, sehingga blog kita akan menjadi ringan untuk di load. Sedangkan pembahasan kali ini yang memasang tombol Back to Top Pada Blog dengan Efek Jquery Smooth memiliki kelebihan tersendiri yaitu ketika kita mengklik tombol ini kita akam melihat pergerakan yang natural, namun Tombol Back to Top pada Blog masih dapat di jadikan pilihan sesuai selera kita.

Baik, tidak berlama-lama mari kita langsung saja kita praktekkan. Langkah yang akan kita lakukan sebagai berikut :
1. Seperti biasa Buka aplikasi kesayangan kita lalu pergi ke alamat blog dan Login seperti biasa.
2. Berikutnya pilih tab Rancangan>Edit HTML>jangan lupa box Expand Template Widget di centang.
3. Selanjutnya Teman-teman lakukan pencarian code dengan fasilitas find atau tekan tombol ctrl+f lalu cari kode </head> lalu pastekan kode berikut diatas kode </head> ini :

<script src="http://projectjqueryku.googlecode.com/files/jquery.min.js" type="text/javascript">

Kode selanjutnya ditempatkan di bawah kode barusan. Nah mengapa tidak langsung saja di gabung? karna kode tersebut merupakan kode jQuery JavaScript Library v1.3.2 jadi apabila Teman-teman telah memasang jQuery ini tidak perlu lagi di pasang. Ok kita lanjutkan kode selanjutnya ini dia:

<!-- Back To Top -->
<script src='http://projectjqueryku.googlecode.com/files/back-to-top.js' type='text/javascript'/>
<script type='text/javascript'>
jQuery.fn.topLink = function(settings) {
 settings = jQuery.extend({
  min: 1,
  fadeSpeed: 200
 }, settings);
 return this.each(function() {
  var el = $(this);
  el.hide();
  $(window).scroll(function() {
   if($(window).scrollTop() &gt;= settings.min)
   {
    el.fadeIn(settings.fadeSpeed);
   }
   else
   {
    el.fadeOut(settings.fadeSpeed);
   }
  });
 });
};

$(document).ready(function() {
 $(&#39;#top-link&#39;).topLink({
  min: 300,
  fadeSpeed: 500
 });
 $(&#39;#top-link&#39;).click(function(e) {
  e.preventDefault();
  $.scrollTo(0,300);
 });
});
</script>
<!-- End Back To Top -->


Langkah selanjutnya teman teman perlu menandai dimana letak tujuan akhir pergerakan, caranya Teman-teman lakukan pencarian kembali. Cari <body mengapa bukan <body> karna kadang dalam pemcarian kita, kode tersebut memiliki kode tambahan di dalamnya sebelum tanda ">" tanpa tanda kutip. Baiklah kita lanjutkan untuk kode tersebut Teman-teman lakukan pemanbahan kode id='top' sebelum tanda ">" tanpa tanda kutip. apabila tidak terdapat tambahan maka bentuknya kira-kira seperti ini.

<body id='top'>


Kita lanjutkan yang berikutnya yaitu kode CSS lakukan pencarian <b:skin> lakukan paste kode CSS berikut ini diatasnya.

#top-link {display:none;font-weight:bold;font-family:tahoma;font-size:10px;width:70px;background:#000;color:#fff;text-shadow:1px 1px 1px #666;font-size:11px;position:fixed;right:-20px;bottom:150px;padding:5px;-moz-transform: rotate(90deg);-webkit-transform: rotate(90deg);-webkit-border-radius: 4px;-moz-border-radius: 4px; border-radius: 4px;}

Sekarang kita buat kode untuk tombolnya  cari </body> pastekan code berikut :

<a class="no-click no-print" href="#top" id="top-link" rel="nofollow" title="Back to Top Page">Back To Top</a>

Langkah Menambahkan tombol Back to Top kita telah selesai, namun ada yang bisa teman teman tukar Back to Top sesuai keinginan Teman-teman. Sekian dari Blog Aapaaja semoga bermanfaat. Akhir kata saya ucapkan terimakasih atas kunjungan Teman-teman.
Read More..

Minggu, 27 November 2011

Membuat Like Box Facebook pada Blog

Pada topik sebelumnya kita telah membahas bagaimana cara membuat halaman facebook kita, Topik kali ini berhubungan degan topik yang sebelumnya yaitu Cara Membuat Halaman Facebook. Like Box Facebook merupakan fasilitas yang diberikan facebook kepada penggunanya yang telah memiliki halaman fan. Like Box Facebook ini biasanya banyakkita temukan pada blog dan web. Salah satu kegunaannya agar pengunjung tahu seberapa populernya suatu situs yang di kunjunginya. Setiap pengunjung yang memberi dukungannya tentu sudah memiliki account pada facebook, karna setiap kita akan memberikan dukungan kita pada Halaman ini kita harus login terlebih dahulu melalui facebook kita. Nah sekian penjelasan singkatnya, agar menghemat waktu mari kita langsung saja ke inti dari topik kita.


Hal pertama yang prlu kita lakukan mecari tahu apa alamat fan page atau halaman fb kita. untuk mengetahuinya Teman-teman dapat meliahat pada address halaman fb kita. lakukan copy addressnya lalu plih mulai yang terdapat pada bagian kiri di bawah gambar profil. setelah dipilih akan tampil pilihan untuk promosikan halaman ini di situs web anda lalu pilih tombol tambahkan kotak suka. pastekan alamat tadi ke box yang telah tersedia dalam hal ini Facebook Page URL dan isi parameternya sesuai keinginan. Pilih Get Code.


Ada dua code yang akan kita dapatkan untuk HTML5 kedua kode tersebut nantinya akan kita tempatkan pada halaman blog kita. Kita lanjutkan login ke blog seperti biasa, pilih tab Rancangan lalu pada sub tab pilih Edit HTML. Sampai di sini kita butuh fasilitas find browse kita umunnya tombol ctrl+f. Lakukan centang pada Expand Template Widget. Cari <body> pastekan code pertama setelah code tersebut lalu simpan template, jangan lupa di backup terlebih dahulu. Code kedua kita tempatkan pada widget blog yang dapat kita tambah dengan cara pilih tab Elemen Laman kemudian Pilih dimana kita akan menambahkan gatget. cari gatge dengan nama HTML/JavaScript pilih tombol tambah. Masukkan code kedua yang kita dapatkan di facebook tadi kedalam gadget yang barusaja ditambahkan dan beri judunya lalu simpan.

Baik, selesai sudah Like Box kita. Sekian dari blog Aapaaja semoga bermanfaat.
Read More..

Sabtu, 26 November 2011

Tombol Back to Top pada Blog

Apakabar Sahabat blog Aapaaja :) kali ini kita akan membuat suatu tombol tambahan pada halaman blog kita. Nah apa itu tombol back to top dan bagaimana cara kerjanya. tombol back to top adalah tombol yang biasa di gunakan oleh para bloger untuk memberikan kemudahan bagi pembacanya. mengapa begitu? karna setiap kita membaca sampai kebawah halaman artikel seringkali kita akan kembali ke halaman teratas pada blog tersebut. maka ini dia fungsi nya, yaitu membawa para pembaca kembali ke atas halaman hanya dengan menekan tombol back to top ini.

Sekian penjelasan untuk tombol Back to Top mari kita langsung saja prakteknya. Yuk mari...

Tahap pertama tentu saja kita login ke account blog kita. pilih tab Rancangan > berikutnya Edit HTML
Teman-teman lakukan pencariaan untuk kode berikut ]]></b:skin> untuk mempercepat pencarian kita gunakan fasilitas find umumnya dapa mengguankan tombol ctrl + f masukkan kode tersebut. Setelah ditemukan masukkan script ini sebelum kode tersebut :


.gototop {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjK49_qUDJKbpnvM7NJOvcMC-wfGLWbjQ-Lfwb1Me4phbse0yRyh1mQ2BuUazZjmQpuYlrvVyqLSfVeT78gz9HiKGA5koX1K9aADl6FB4ezSJyRAxUdJMJ738QP5UxKWLJ-uE-kHEkpqwY/s400/arrowtopdt6.gif)no-repeat;
display:block;
_display:none;
position:fixed;
z-index:9999;
text-indent:-9999px;
width:17px;
height:17px;
overflow:hidden;
outline:none;
right:8px;
bottom:35px
}
.gotobottom {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNawjiFNmPtkVfFQtLrOLRe9mjLvhl_MVTtSmTy6gNTj92daF1k8kW2O1eiIdyBHL8-VaWUv3Qor-lZpWwTg5Yl8AX1eQvjfBJ4z7pZm5JM0HraYNN9hqo18hZKrZj7N1VbbY5IUe49_c/s400/arrowdownqe1.gif)no-repeat;
width:17px;
height:17px;
display:block;
_display:none;
position:fixed;
z-index:9999;
text-indent:-9999px;
overflow:hidden;
outline:none;
right:8px;
bottom:15px
}


Teman-teman dapat mengguankan gambar sesuai dengan selera masing2. caranya upload gambarnya di file hosting ambil alamat letaknya, lalu ganti alamat pada kode di atas yang berwarna biru dengan alamat dimana Teman-teman upload file tadi. diatas ada dua alamat yang pertama untuk tombol top / atas dan yang ke dua untuk tombol botton / bawah.












Selanjutnya kita cari kode </body> letakkan kode berikut diatasnya :


<a class='gototop' href='javascript:scroll(0,0)' title='Go to Top'>Top</a>
<a class='gotobottom' href='#footer' title='Go to Bottom'>Bottom</a>

Terakhir Simpan Template. OK Teman-teman sekian dari Saya Blog Aapaaja semoga pembahasan kali ini dapat menambah ilmu kita dan dapat di ambil manfaatnya.
Read More..
Top Bottom Back To Top