Demo Blog
Tampilkan postingan dengan label Tutorial. Tampilkan semua postingan
Tampilkan postingan dengan label Tutorial. Tampilkan semua postingan

Optimasi Speed Blog

by Rie tag : ,

Sudah bukan rahasiah lagi, jika kecepatan loding blog merupakan salah satu kunci untuk mengundang dan kenyamanan bagi pengunjung. semakin cepat di akses akan semakin memudahkan pengunjung untuk terus menikmati isi blog. Namun kemarin ini, gosip-nya kecepatan loding halaman situs akan di masukan juga menjadi salah satu acuan faktor peringkat dari kurang lebih 200 peringkat faktor-faktor algoritma sistem google. Dan masih menurut gosip juga, acuan ini akan di berlakukan pada tahun 2010 nanti. jika di hitung dari hari ini, mungkin sekitar dua bulan lagi. Untuk menguji berapa speed  dari blog anda, bisa mencobanya dengan speed test blog ini.

Oleh karena itu, keputusan yang bijaksana terutama bagi teman-teman yang lebih fokus dan mengkhususkan blog-nya dalam peringkat di indek google agar mulai berbenah memperbaiki seluruh komponen blog, seperti : gambar, stylesheet, script atau flash. dan mempertimbangkan pengaya (pernak-pernik), mana yang bermangfaat dan mana yang hanya sekedar gaya saja ?. mana yang perlu di pertahankan dan apa saja yang perlu di hilangkan.

Dan saran saya untuk optimasi speed blog jangan lupa gunakan Yslow performance - addons firefox dari Yahoo atau Page speed – addons firefox dari Google. karena selain untuk menganalisa seberapa cepat waktu tunggu sebuah situs, keduanya merupakan tool yang sangat bagus untuk optimasi speed web/blog. 
2 komentar Selengkapnya »

Pasang Profil Facebook di Blogger

by Rie tag : ,


Facebook seperti yang sudah anda kenal merupakan media yang bisa menghubungkan anda dengan banyak orang diseluruh dunia selain friendster yang kita kenal sebelumnya, widget profile Facebook seperti diatas bisa anda pasang diblog anda untuk mengajak pengunjung anda mengenal lebih jauh anda, untuk pasang widgetnya silahkan ikuti langkah-langkah berikut:

1. Login ke facebook anda
2. Klik menu Profile
3. Lihat pada bagian kiri bawah klik "create a Profile Badge/ Buat LencanaProfil"
4. klik tulisan create badge
5. kemudian akan muncul halaman yang berisi:
  • Layout : silahkan pilih vertikal atau horizontal tergantung space pada blog anda
  • Image : Javascript untuk aplikasi blogspot dan image untuk semua blog
  • Items : Silahkan pilih item yang akan anda masukkan ke widget profile facebook and
  • Kemudian Save

6. Kemudian akan muncul kode scriptnya, silahkan dicpy paste ke element halaman blog anda dengan cara seperti biasa Layout-->Add Gadget-->Javascript/HTML-->Save

Sekarang anda bisa memperluas jaringan anda bersama facebook dan blog anda,

Selamat mencoba ya dan semoga berhasil!!!
3 komentar Selengkapnya »

Cara Mendaftar di eXTReMeTracking.com

by Bg dani tag : ,

Cara Mendaftar di eXTReMeTracking
eXTReMe Tracking merupakan layanan traffic tracking yang sangat luar biasa, sehingga sangat disukai oleh banyak blogger terutama bagi blogger indonesia. Layanan ini bisa diperoleh dengan gratis maupun berbayar (tentunya fasilitasnya akan lebih baik). Sayangnya, layanan ini sudah tidak menerima lagi pendaftar dari Indonesia. Mungkin karena semua pengguna Indonesia hanya suka yangg gratisan, dan jarang sekali untuk mengupgrade keanggotaan jadi berbayar. Sehingga akhirnya pihak eXTReMe Tracking memutuskan menutup pendaftaran bagi blog / web yang berasal dari Indonesia. Setiap kali anda berusaha mendaftar dengan klik pada "Get Your Free Tracker Code" maka akan langsung ditolak.



Untuk mengakali supaya Anda bisa mendaftra di eXTReMe Tracking, ikuti tips dan trik berikut ini:
  • Silahkan anda gunakan Anonymous proxy, bisa di cari di search engine google dengan kata kunci "anonymous proxy".
  • Atau bisa juga Anda menggunakan link berikut untuk mendaftar di extremetracking.com seperti, www.youhide.com, www.zend2.com.
  •  Masukkan alamat yang anda tuju, dalam hal ini extremetracking.com kedalam form, kemudian klik ‘GO!’
  • Anda kemudian akan masuk ke halaman extremetracking.com, tapi berada dalam anonymous proxy tersebut.
  • Selanjutnya silakan klik link ‘Get Your Free Tracker Code” untuk mendaftar !
  • Dan akhirnya anda bisa mendaftar di extremetracking.com
  • Pilih nama account dan password yang masih tersedia (max delapan huruf atau angka)
  • Setelah terdaftar, Anda akan mendapatkan script code yang siap anda copy paste di blog Anda.
  • Untuk memasangnya bisa anda lihat di sini.
Semoga bermamfaat dan selamat mencoba.
0 komentar Selengkapnya »

Cara Membuat dan Mendaftar Email di Gmail

by Bg dani tag : ,

Gmail sekarang sudah melakukan pelayanan email gratis tanpa undangan lagi. Seperti Yahoo yang sudah melakukan pelayanan ini sejak dulu. Hanya bedanya, kapasitas di Gmail lebih besar, mencapai 2 Gb dan terus bertambah tiap detiknya. Selain lebih stabil dan cepat, juga dalam hal pengirim file lebih besar dari akun yahoo, dan ternyata lebih cepat. Beberapa alasan kenapa anda harus mempunyai akun di Google Mail (gmail) :

Kapasitas penyimpanan data yang sangat besar  (2GB )
Karena Google menyediakan kapasitas yang sangat besar, maka anda tidak perlu lagi menghapus email-email yang ada sebelumnya. Kapasitas tersebut boleh di bilang tanpa batas untuk ukuran kapasitas sebuah email.
Akses yang Cepat
Di banding dengan pesaingnya yahoo, email di gmail lebih mudah di akses, ini sangat bermanfaat bagi anda yang koneksinya sedikit lambat.
Anti Spam yang Baik
Google mail mempunyai mesin anti spam yang terbilang sangat baik.
POP dan SMTP akses
Bagi anda yang ingin mengelola email dengan menggunakan email client semisal outlook ekspress atau Mozilla thunder bird, anda bisa setting agar email anda di teruskan ke email client tersebut.
Akses Google Reader
Dengan google reader anda bisa membaca feed situs yang anda sukai dengan mudah.
Akses Google Bookmark
Dengan google bookmark anda bisa membuat mencatat situs favorit anda secara online.
Akses Google Webmaster Tool
Bagi anda yang sudah mempunyai web atau blog dan ingin mendapat  perhatian lebih, anda bisa mengirimkan sitemap ke webmaster tool.
Akses Google Site
Anda bisa membuat sebuah halaman web dengan sangat mudah melalui Google Site
Akses Google Docs
Jika anda berniat sharing data berupa file dokumen, excel atau power point, anda bisa menggunakan layanan dari Google docs.
Dan banyak lagi fasilitas yang di sediakan oleh Google yang bisa anda nikmati dengan menggunakan akun gmail.
Bagi anda yang masih merasa bingung tentang cara membuat email di google mail (gmail), berikut adalah panduannya :
1.    Silahkan anda kunjung situs http://mail.google.com
2.    Lihat ke bagian sebelah kanan, klik tulisan Sign up ke Gmail.
3.    Ada beberapa formulir yang harus anda isi, di antaranya :
  • Nama Depan : Isi dengan nama depan anda. Contoh : Marzo
  • Nama Belakang : Isi dengan nama belakang anda. Contoh : rilla
  • Nama Login Yang Diinginkan : Isi dengan nama emal yang anda inginkan. Contoh : marzorilla
  • Klik tombol “cek ketersediaan” untuk mengetahui apakah nama email kita masih bisa di buat atau sudah ada yang memakai nama tersebut, jika tidak bisa di gunakan anda harus memasukan nama yang lainnya. Jika nama yang di masukan tersedia, maka anda bisa mengisi formulir selanjutnya.
  • Buat sandi : isi dengan kata sandi atau password yang anda inginkan, di sarankan agar kata sandi berisi perpaduan antar hurup dengan angka. Contoh : ema1lGue (ingat, kata sandi peka terhadap hurup kecil serta besar).
  • Masukkan kembali sandi : isi kembali dengan kata sandi yang tadi di tulis. Contoh : ema1lGue
  • Pertanyaan Rahasia : pilih pertanyaan yang kira-kira jawabannya akan anda ingat selalu. Contoh : Siapa nama guru pertama anda.
  • Jawaban : isi dengan jawaban yang sesuai dengan pertanyaan yang anda pilih. Contoh Pak Umar.
  • Email Sekunder : isi dengan alamat email yang lain yang sudah anda miliki. Contoh : marzorilla@yahoo.co.id
  • Lokasi : Pilih lokasi yang sesuai dengan anda. Contoh : Indonesia.
  • Verifikasi Kata : isi dengan tulisan yang muncul.
  • Klik tombol “Saya menerima. Buat akunku.”
4.    Jika tidak sesuatu yang salah, email anda sudah berhasil di buat.
Sebagai ilustrasi, silahkan klik gambar di bawah :


Selamat mencoba.
0 komentar Selengkapnya »

Cara Membuat dan Mendaftar Email di Yahoo

by Bg dani tag : ,

Yahoo! Messenger adalah salah satu fasilitas dari yahoo yang sangat populer di dunia, dengan yahoo messenger anda dapat dengan mudah melakukan interaksi dengan orang lain baik itu melalui tulisan, suara (voice), serta bisa juga langsung menggunakan webcame sehingga bisa melihat lawan bicara melalui layer monitor. Untuk menggunakan layanan ini anda harus mempunyai akun yahoo! Atau dengan kata lain harus mempunyai email di yahoo!

Mendaftar Web atau Blog ke mesin pencari Yahoo! (Yahoo! Search Engine)
Mesin pencari yahoo! (Yahoo! Search Engine) merupakan mesin pencari terbesar kedua di dunia setelah mesin pencari Google. Bagi anda yang sudah mempunyai web atau blog yang ingin mendaftarkan web atau blog nya ke mesin pencari yahoo! Maka anda perlu mempunyai akun di yahoo!.

Yahoo! Geocities akses
Dengan yahoo! Geocities anda bisa membuat halaman web dengan mudah serta dapat di jadikan sebagai host untuk gambar atau script serta data yang lainnya yang ingin di simpan di internet.

Mybloglog akses
Mybloglog.com adalah salah satu keluarga dari yahoo dalam hal membentuk komunitas di internet, untuk mendaftar ke situs tersebut anda di haruskan menggunakan akun yahoo.

Dan banyak lagi fasilitas-fasilitas dari yahoo yang bisa anda nikmati dengan persyaratan harus menggunakan akun yahoo.

Bagi anda yang memerlukan panduan untuk membuat email (akun) di yahoo, berikut adalah panduannya
  1. Silahkan klik di sini untuk daftar ke yahoo.
  2. Alihkan perhatian anda ke sebelah kanan atas monitor, di sana ada menu drop down di samping tulisan “I prefer content from”, silahkan klik menu dropdownnya lalu pilih “yahoo Indonesia”.
  3. Ada beberapa formulir yang perlu anda isi :
  • Nama Saya : isi dengan nama depan serta nama belakang anda. Contoh : Marzo rilla
  • Jenis Kelamin : isi dengan jenis kelamin anda, Pria atau wanita.
  • Tanggal Lahir : isi dengan tanggal lahir anda.
  • Saya Tinggal di : pilih negara di mana anda tinggal. Cotoh : Indonesia.
  • Kode Pos : Isi dengan kode pos anda. Contoh 28282.
  • ID Yahoo! Dan Email : isi dengan nama ID yang anda inginkan. Contoh : jhonboncel. Untuk menu dropdown saya sarankan untuk memilih yahoo.co.id agar nantinya bisa untuk akses penerusan POP dan SMTP, klik tombol “periksa” untuk mengecek ID tersebut masih tersedia untuk di pakai atau tidak. Ganti nama ID dengan yang baru apabila ID yang di masukan sudah tidak bisa di buat.
  • Sandi : isi dengan kata sandi atau password yang anda inginkan, di sarankan agar kata sandi berisi perpaduan antar hurup dengan angka. Contoh : @ma1La1ng (ingat, kata sandi peka terhadap hurup kecil serta besar).
  • Ketik ulang Sandi : isi kembali dengan kata sandi yang tadi di tulis. Contoh : @ma1La1ng
  • Email Alternatif : isi dengan alamat email yang lain yang anda punya, jika tidak punya maka di biarkan kosong saja. Ini di maksudkan apabila nanti anda lupa kata sandi dari email anda yang sedang di buat, bisa minta di kirim kata sandinya ke email alternative tersebut.
  • Pertanyaan Keamanan 1dan 2 : pilih pertanyaan yang tersedia. Misal : apa nama hewan peliharaan Anda?
  • Jawaban anda : isi dengan jawaban yang anda pasti ingat selalu. Misal : gajah.
  • Ketikan kode yang di tunjukan : isi dengan angka-angka yang muncul.
  • Anda setuju? : beri tanda centang pada kotak kecilnya (harus).
  • Klik tombol “Buat Akun Saya“.
  • Jika tidak ada yang salah dalam pengisian, email anda sudah jadi
Sebagai ilustrasi, silahkan klik gambar di bawah :



Selamat, anda sudah mempunyai akun di yahoo yang nanti bisa di gunakan untuk berbagai fasilitas yang di berikan oleh yahoo!
0 komentar Selengkapnya »

Cara Membuat Slide Album Foto Pada Blogger

by Bg dani tag : ,

Untuk mengetahui trik pembuatan slide album foto di blog,  blogspot menyediakan gadget yang berfungsi untuk membuat slide album foto pada blog kita. Namun, menurut saya gadget ini lebih sederhana jika dibandingkan dengan slideshow yang kita buat dari www.slide.com, sebab tampilan slide foto yang kita dapatkan dari situs www.slide.com tersebut bisa kita customize sesuai kehendak kita mulai dari tipe slide, ukuran, animasi, dan lain-lain. Meskipun demikian, tidak ada salahnya jika kita mencoba gadget slide album foto blogspot ini, sebab kesederhanaan biasanya indentik dengan kemudahan dalam pengaplikasiannya. Berikut langkah-langkah menambah album foto pada blogger:
  1. Login pada akun Blogspot Anda
  2. Klik link menu Tata Letak pada halaman dasbor. Pastikan Anda berada pada sub tab menu Elemen Halaman
  3. Klik link Tambah Gadget pada bagian dimana pembaca ingin memasang slide album foto tersebut
  4. Akan muncul window Tambahkan Gadget yang berisi daftar gadget yang bisa kita tambah. Silahkan cari dan pilih gadget Tampilan Slide

  5. Berikut pengaturannya:
    Judul :
    Isi dengan nama slide foto Anda.
    Sumber :
    • Album Web Picasa. Album ini merupakan album gambar yang telah Anda masukkan pada pada blogspot pembaca misalnya ketika menulis posting. Silahkan klik http://picasaweb.google.com untuk melihat album Anda.
    • Flickr. Flickr merupakan situs yang menyediakan tempat menyimpan foto dan video. Untuk mendapatkan layanan ini, silahkan daftar atau login menggunakan Yahoo ID Anda di www.flickr.com.
    • Photobucket. Ini hampir sama dengan flickr dimana kita bisa menyimpan foto dan video secara online pada situs tersebut. Untuk mendapatkan layanan ini silahkan register di www.photobucket.com
    • Lainnya. Sumber selain yang 3 diatas.
    Pilihan :
    Memilih apakah berdasarkan kata kunci atau berdasarkan album
    Buka link di jendela baru:
    Centang jika ingin foto dibuka pada jendela baru ketika diklik
  6. Sebagai contoh kita menambah slide foto menggunakan Album Web Picasa
    Judul: beri judul slide album
    Sumber : pilih "Album Web Picasa".
    Pilihan : pilih "Album"
    Nama Pengguna : masukkan ID akun Google pembaca. Misalkan akun Google pembaca adalah kampanye@gmail.com, maka isikan "kampanye"
    Album : pilih album yang terdapat pada Album Web Picasa Anda. Perlu diperhatikan bahwa album yang muncul pada list tersebut adalah album yang diperuntukkan untuk "Public". Untuk melakukan pengaturan tersebut, silahkan masuk terlebih dahulu pada http://picasaweb.google.com (masuk menggunakan akun Google Anda). Klik tab "My Photos", setelah itu klik album yang ingin Anda atur parameternya.
    Klik menu "Edit" kemudian pilih sub menu "Album Properties" sehingga akan muncul jendela "Edit album information".
    Lihat dibagian paling bawah, akan ada pilihan "Visibility for this album". Silahkan pilih "Public". Kemudian klik tombol Save changes
  7. Pratinjau album akan terlihat pada jendela tambah gadget tersebut.
  8. Klik tombol SIMPAN
Selamat mencoba.
2 komentar Selengkapnya »

id.nowGoogle.com - Indonesia Multiple Search Engine

by Bg dani tag : ,

id.nowGoogle.com merupakan sebuah mesin pencari yang sangat membantu Anda dalam pencarian yang lebih efektif karena menampilan multiple search engine dari berbagai search engine yang ada (Google, Yahoo, Bing, Ask, AllTheWeb, AOL, Lycos, Dogpile, AltaVista, dan Clusty), digabung dalam satu halaman. id.nowGoogle.com ini adalah situs hasil karya anak bangsa indonesia (Rolly Trisno, ST), yang ingin mempermudah anda dalam pencarian di internet.

Di id.nowGoogle.com ini, anda di manjakan dengan berbagai macam pilihan pencarian yang banyak Anda cari internet. Seperti Web-search, Blog, Buku, Download, Ebook, Image, Lirik, Lowongan, Musik, Social-bookmark, dan Video. Tentunya dengan adanya pilihan-pilihan ini pencarian ini, pastinya sangat akan mempermudah anda dalam mencari artikel atau mencari lirik-lirik lagu. Jadi ngga ada salahnya untuk mencobanya.
0 komentar Selengkapnya »

Membuat Animasi Gambar Bergerak gif dengan Photoshop bag.2

by Rie tag : ,

Setelah kemaren mebuat animasi pergerakan warna, kita akan mencoba mmbuat scrolled text alias text berjalan gambar gif menggunakan photoshop. Mari kita buka photoshopnya…
Buat dokumen baru, file>>new. Pilih ukuran gambar, saya mengunakan ukuran 250 x 50 pixel.
Jangan lupa tampilkan jendela animation di “windows” > “animation
Okay, selanjutnya buat layar baru, yang berisi text yang kita tampilkan. Klik “new layer” pada jendela layer:
newlayer
setelah itu klik text tool yang ada di sebelah kiri,
texttool
kemudian kettikan tulisan yang ingin kita animasikan, saya mengetikkan “antoro.net”
antoronet
Beralih ke jendela animasi. Disini kita akan membuat text tersebut berjalan dari ujung kanan ke ujung kulon… eh ujung kiri. Jadi pada frame pertama pada jendela animasi, geser tulisan tadi ke kanan dengan menggunakan arah kanan pada keyboard. Kita bisa juga menggunakan mouse, tapi kalau tidak cermat, nanti animasinya tidak berjalan mulus. Geser ke kanan sampai ujung depan tulisan tidak terlihat lagi,
sembunyi
kemudian, klik duplicate selected layar pada jendela animasi,
duplicate
klik frame kedua (yang di duplikasi tadi). Kemudian kita geser text tadi ke kiri memakai arah kiri keyboard sampai ujung belakang tulisan tidak terlihat.
Agar gerakan text berjalan dengan mulus, kita berikan frame tambahan dengan meng-klik “tween animation frames” pada frame pertama,
tweens
lalu akan muncul jendela seperti berikut:
tweenwindow
Pada tween with, pilih yang next frame.
Pada frame to add, masukkan jumlah frame yang kehendaki, masukkan angka lebih dari 5 bila ingin animasi berjalan mulus, saya menggunakan “15″, lanjutkan dengan klik OK.
Agar animasi terus berjalan, pilih yang “forever”. kemudian tekan tombol play dalam jendela animasi, kira-kira hasilnya akan seperti ini…
scroll
Whoops! Hampir lupa, untuk menyimpan gambarnya, kita gunakan “save for web & device” nya photoshop. Caranya klik file > Save for web & device atau shortcut CTRL+ALT+SHIFT+S
Pilih file gif, lalu save, muncul jendela save, masukkan nama gambar, dan save.
MEMBUAT FAVICON AGAR BERGERAK

Caranya hampir sama, cuma ukuran standard favicon adalah 16 x 16 pixel (sempat tidak sempat harus enambelas, lhoh!). Buat aja ukuran 16 x 16 pixel, lalu ikuti langkah di atas untuk menganimasikan. Kemudian yang paling penting adalah cara save gambar favicon tersebut. Favicon memiliki extensi gambar .ico (yang pada photoshop CS 3 yang saya pakai tidak ada). tapi kita bisa mengakalinya dengan mengetikkan sendiri. Caranya klik file > Save for web & device atau shortcut CTRL+ALT+SHIFT+S, pilih gambar gif, kemudian save.
Nah, setelah itu akan muncul jendela save, masukkan nama untuk gambar favicon diikuti dengan .ico contohnya “favicon.ico” lalu save.
0 komentar Selengkapnya »

Membuat Animasi Gambar Bergerak gif dengan Photoshop

by Rie tag : ,

Selain buat edit-edit foto, photoshop juga bisa kita gunakan untuk membuat gambar bergerak / animasi dalam format .gif (graphic interchange format). Dengan bermain frame per frame, kita dapat membuat animasi tulisan ataupun gambar dengan mudah sesuai selera.

Oke, dalam membuat animasi dengan photoshop, kreativitas kita sangat dibutuhkan di sini, saya hanya memberikan tutorial dasarnya saja, dan nanti teman-teman bisa mengembangkannya.

Photoshop yang saya digunakan di sini adalah photoshop CS3, photoshop CS2 juga bisa digunakan (Saya belum tahu apakah photoshop versi lama bisa)

Buka Adobe photoshop, mari kita membuat animasi…

Sudah dibuka lom? (apanya yah?) hehe ya photoshopnya!

Langkah pertama yang paling penting adalah mengeluarkan tool animasi di photoshop, caranya klik menu “window” di photoshop, lalu pilih “animation”

windows

Sampai muncul window kayak gini:

animation

Siap untuk animasi… pertam apa yah? ehm… animasi warna dulu deh…

Animasi warna

Kita akan mebuat animasi warna sederhana, yaitu perubahan warna merah, kuning dan hijau (kayak lampu lalu lintas aja.. wekekek)

Di photoshop, pilih file » new masukkan ukuran sesuai selera, kalau saya pakai 200 x 200 pixel, lalu oke

Selanjutnya, buat 3 buah lingkaran dengan layer yang berbeda. Buat sebuah lingkaran dulu, selanjutnya pada jendela layer, kita klik kanan layer lingkaran tersebut, lalu pilih “duplicate layer…”.

Atur sedemikian rupa sesuai selera. Ini lingkaran yang saya buat:

bulatan

ini tampilan dalam jendela layer:

layer

dan ini tampilan dalam jendela animation:

animationduplicate

Sekarang tinggal kita mainkan layer-layernya untuk membentuk sebuah animasi.

Wokey, buat 3 buah frame dalam jendela animation, dengan mengklik icon “duplicates selected frames” (tanda lingkaran merah pada gambar diatas!) hingga jadi seperti ini:

animationduplicate3

Yup, seperti rencana kita, kita akan mebuat lingkaran tadi menjadi animasi seperti lampu traffic light, untuk menampilkan warna merah dahulu, klik frame pertama pada jendela animation, lalu pada jendela layer, nonaktifkan icon mata (indicates layer visibility) pada layer warna kuning dan hijau, sehingga hanya layer warna merah yang terdapat icon mata, seperti gambar di bawah :

visibility

Kemudian kembali lagi ke jendela animation, klik frame kedua, aktifkan icon mata pada layer kuning. Sedangkan pada frame ketiga, aktifkan icon mata pada layer hijau. Oh iya jika ingin animasi kita nanti transparan, tinggal nonaktifkan icon mata pada layer background di semua frame animasi.

Dalam jendela animation akan terlihat seperti berikut:

frame

klik tombol play untuk memainkan animasi, kita bisa mensetting timming animasi sehingga animasi tidak bergerak terlalu cepat. Setting waktunya dengan meng-klik tanda panah segitiga di samping kanan tulisan 0 sec.

time

pilih waktu sesuai keinginan, begitu pula di frame-frame berikutnya.

Oh iya, agar animasi bergerak terus tanpa henti, maka animasi harus di setting “forever”, tetapi jika ingin bergerak satu kali, setting dengan “once”, seperti gambar di bawah:

timing

Wokey… kira-kira hasilnya seperti ini…

bangjo

Untuk menyimpan gambarnya, kita gunakan “save for web & device” nya photoshop. Caranya klik file > Save for web & device atau shortcut CTRL+ALT+SHIFT+S


Bookmark and Share
0 komentar Selengkapnya »

Membuat Buku Tamu Melayang

by Bg dani tag : ,



Pernah tidak melihat sebuah blog yang di samping kanan atas ada tulisan Buku Tamu dengan background hijau, yang kalau diklik akan keluar form isian yang menanyakan Nama, Website dan Message. Buku Tamu tersebut melayang artinya tidak terpengaruh oleh scroll mouse, walaupun mouse digulir ke bawah Buku Tamu tersebut tetap nampak. Mau tahu caranya?

  1. Sign in ke blogger dan silahkan Login dengan Account Anda

  2. Pilih Layout/Tata Letak

  3. Pilih Page Elemen/Elemen Halaman

  4. Klik Add a Gadget/Tambah Gadget

  5. Lalu pilih "HTML/JavaScript"

  6. Kemudian Copy-Paste kode di bawah ini :

    <style type="text/css">
    #gb{
    position:fixed;
    top:50px;
    z-index:+1000;
    }
    * html #gb{position:relative;}

    .gbtab{
    height:100px;
    width:30px;
    float:left;
    cursor:pointer;
    background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBf4qxpgam0Et19delMJbcAJjSo-dfHNV_OovKnRTJNpLrcUm51rkdj7raCRSUgInFjYG8HEIfq7BErlPsg685Fhr2j7QOdyykycbNREqXX1Mqluz2sCLYu5bUCm5KnC8wVEX-Mvge0JLw/') no-repeat;
    }
    .gbcontent{
    float:left;
    border:2px solid #A5BD51;
    background:#F5F5F5;
    padding:10px;
    }
    </style>

    <script type="text/javascript">
    function showHideGB(){
    var gb = document.getElementById("gb");
    var w = gb.offsetWidth;
    gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
    gb.opened = !gb.opened;
    }
    function moveGB(x0, xf){
    var gb = document.getElementById("gb");
    var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
    var dir = xf>x0 ? 1 : -1;
    var x = x0 + dx * dir;
    gb.style.right = x.toString() + "px";
    if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
    }
    </script>

    <div id="gb">

    <div class="gbtab" onclick="showHideGB()"> </div>

    <div class="gbcontent">

    <!-- Begin ShoutMix - http://www.shoutmix.com -->
    <iframe title="m4n0" src="http://www6.shoutmix.com/?id" width="160" height="400" frameborder="0" scrolling="auto">
    <a href="http://www6.shoutmix.com/?m4n0">View shoutbox</a>
    </iframe>
    <br /><a href="http://www.shoutmix.com" title="Get your own free shoutbox chat widget at ShoutMix!">ShoutMix chat widget</a><br />
    <!-- End ShoutMix -->

    <br/>
    Anda berminat buat Buku Tamu seperti ini?<br/>
    Klik di
    <a href="http://sman11pku.blogspot.com/2009/11/membuat-buku-tamu-melayang_02.html">
    sini </a>

    <div style="text-align:right">
    <a href="javascript:showHideGB()">
    [tutup]
    </a>
    </div>

    </div>

    </div>

    <script type="text/javascript">
    var gb = document.getElementById("gb");
    gb.style.right = (30-gb.offsetWidth).toString() + "px";
    </script>

    CATATAN :
  7. Ganti tulisan yang berwarna merah dengan kode yang anda peroleh dari ShoutMix

  8. Icon Buku Tamu dapat anda ganti sesuka hati dengan terlebih dahulu merancangnya di Photoshop atau di CorelDraw, setelah itu upload di hosting image seperti photobucket dsb. lalu ambil URLnya dan pasang di background.

  9. Selamat Mencoba
1 komentar Selengkapnya »

Membuat Teks Area

by Bg dani tag : ,

Sobat semua pasti tau dengan Teks Area kan,masa hari gini ngak tahu ama teks area, ituloh kotak yang didalamnya berisi kode teks atau tulisan,biasanya teks area ini digunakan untuk menyimpan kode2 HTML agar bisa dicopy oleh para pengunjung yang biasanya digunakan untuk tukeran link dengan Blogger lainnya





Untuk membuat teks area seperti diatas, silahkan copy code dibawah ini:

<textarea rows="2" wrap="off" style="width: 200px; font-size: 11px;" onclick="select()">
masukkan text atau kode html yang akan dimasukkan ke dalam text area
</textarea>

rows="2" ganti tingginya sesuai keinginan anda
width: 200px ganti lebar sesuai keinginan anda
0 komentar Selengkapnya »

Pasang Google Translator di Blog

by Bg dani tag : ,

Memasang widget translator atau "Penerjemah" pada blog banyak sekali gunanya. Translator ini berguna apabila ada pengunjung dari negara lain yang secara sengaja maupun tidak yang melihat blog kita dan tidak tahu bahasa kita maka mereka bisa menggunakan widget ini untuk menterjemahkannya kedalam bahasa yang mereka inginkan (tentunya yang sudah ada di widget ini). Widget ini sudah support untuk bahasa Indonesia. Dan kalo kamu mau, translator ini bisa juga untuk menterjemahkan tugas dari sekolah/kampus secara mudah. Dan hasilnya bisa lebih bagus daripada software transtool lho. Gimana? mau membuatnya? caranya mudah lho.
1. Login ke Blogger trus pilih menu "Layout" atau "Tata Letak"
2. Kemudian klik pada "Add Gadget" atau "tambah gadget=".
3. Lalu pilih HTML/Javascript"
4. Kemudian masukkan script berikut ini kedalamnya.


5. Kemudian simpan.

Coba sekarang lihat blogmu maka ada tampilan seperti ini :

0 komentar Selengkapnya »

Membuat Shoutbox di Blogger

by Bg dani tag : ,

Anda bisa menambahkan shoutbox pada blog anda, shoutbox ini bisa digunakan untuk meninggalkan testimonial, dan testimonial ini langsung bisa tampil di blog kita, tanpa harus melalui proses approval.

Berikut adalah cara-cara menambahkan shoutbox di wordpress dengan menggunakan ShoutMix.

1. Lakukan registrasi di Shoutmix.com

2. Biasanya untuk aktifasi ini, membutuhkan verifikasi. Sehingga anda bisa cek email yang anda daftarkan untuk memperoleh user dan passwordnya.

3. Jika anda sudah mendapat user dan password, silakan anda login.

4. Setelah anda sukses login, silakan pilih menu Display -> Style & Colors. Disini anda bisa set warna dan style shoutbox yang akan anda tampilkan.

5. Jika anda sudah selesai meng-edit style dan warnanya, silakan anda SAVE

6. Selanjutnya pilih Menu Quick Start -> Get codes, lalu pilih Placed shoutbox on webpage. Copy Script shoutbox anda.

7. Langkah selanjutnya, silakan anda masuk ke Tata Letak > Element -> Tambah Widget.

8. Dalam step ini, anda harus memilih HTML/JavaScript.

9. Jika sudah add, silakan masukkan script yang telah anda copy. Lalu Simpan.

0 komentar Selengkapnya »

Upload Gambar dan Foto Profil

by Bg dani tag : ,

Agar posting artikel pada blog lebih menarik untuk dilihat, maka sebaiknya kita menyisipkan gambar di antara poting-an kita tersebut, di samping untuk lebih memperjelas apa yang kita sampaikan. Misalkan kita sedang menerangkan sesuatu, maka dengan adanya gambar akan lebih memperjelas maksud dari topik yang sedang kita jelaskan kepada para pembaca artikel kita. Bagi anda-anda yang masih bingung bagaimana caranya untuk memasukan gambar atau istilah resminya yaitu upload gambar, maka akan saya ulas langkah-langkahnya :
  1. Login seperti biasa dengan id anda

  2. Klik Posts

  3. Klik New Post (bila sebelumnya anda telah mempunyai posting-an)

  4. Klik toolbar yang bergambar seperti ini

  5. Beri tanda tik/cek pada radio button pada pilihan Choose a layout, bila anda menginginkan posisi gambar bisa di tempatkan di mana saja, pilih pada radio button None, bila posisi gambar di sebelah kiri pilih left, bila ingin di tengah pilih Center, bila ingin di kanan pilih Right.
  6. Beri tanda tik/cek pada Image size, bila ingin gambar yang di upload hasilnya kecil pilih Small, bila ingin sedang pilih Medium, bila ingin besar pilih Large

  7. Beri tanda ceklis di samping tulisan Use this layout every time bila anda menginginkan setiap upload gambar settingnya seperti semula

  8. Tekan tombol Browse, lalu masukan gambar dari komputer anda yang ingin di upload.

  9. Klik Add another image bila gambar yang ingin di upload lebih dari satu gambar

  10. Klik tombol UPLOAD IMAGE, tunggu beberapa saat sampai proses upload selesai

  11. Klik Tombol Done untuk mengakhiri proses upload

Setelah proses upload anda selesai, untuk melihat gambar tadi, klik tombol Compose. Nah disini anda bisa melihat gambar yang anda upload tadi sekaligus dapat mengatur kembali ukuran dari gambar ini, caranya yaitu klik gambar tersebut sampai gambar anak panah mouse anda berubah menjadi gambar panah empat penjuru. Arahkan mouse pada garis samping gambar sampai gambar mouse berubah menjadi panah dua arah, tekan tombol mouse lalu tahan dan gerakan kearah kiri atau kanan untuk merubah lebar gambar, bila susah sesuai dengan yang anda inginkan lepas tombol yang anda tahan tadi. Untuk mengatur tinggi gambar, arahkan mouse pada tepi bawah atau atas gambar sampai gambar mouse berubah menjadi anak gambar panah dua arah, tekan mouse lalu tahan kemudian gerakan mouse keatas atau kebawah untuk mengatur tinggi gambar, lepaskan mouse bila ukuran gambar sudah sesuai dengan yang anda inginkan.

Nah sekarang bagaimana cara memasukan foto untuk mengisi Profile kita?, caranya sama seperti langkah-langkah di atas, cuma ada sedikit perbedaan yaitu kamu harus menghapus beberapa kode tersebut. Jika foto kamu sudah selesai di upload (langkahnya sama seperti di atas). Tekanlah menu Edit HTML untuk melihat kode HTML dari Foto anda tadi, copy / paste kode HTML tersebut kedalam program notepad (agar lebih mudah) atau bisa juga ditulis di kertas. Kemudian klik publish. Untuk memasukan foto kedalam Profile kita, silahkan ikuti langkah berikut:

  1. Setelah upload gambar, klik menu Dasboard

  2. Klik menu Edit Profile

  3. Di dalam form - form isian profile ada tulisan Photo URL, nah disini paste kode HTML yang telah anda copy tadi ke dalam notepad tapi jangan semuanya, yaitu yang di paste adalah kode setelah tulisan [src="] yaitu link yang di mulai dengan [http://] dan berakhir dengan [.jpg] atau [.jpeg]

  4. Klik Save Profile, maka foto anda yang cantik dan ganteng sudah terpampang di blognya dan bisa dilihat oleh seluruh dunia

  5. Selesai
Sebenarnya ada cara lain untuk mengisi foto Profile kita, yaitu dengan cara meng-upload (memasukkan) foto kita pada hosting lain, dan baru kemudian link URL foto yang kita dapat dari hosting tersebut di copy/paste ke profile yang ada di blogger/blogspot. Saya ambil contoh, biasanya saya menyimpan foto-foto saya di http://photobucket.com. jika anda mau silahkan daftarkan diri anda (gratis ko), apabila sudah selesai daftar dan bisa login, silahkan upload photo anda. Setelah proses upload foto selesai, maka secara otomatis foto tersebut akan di beri PHOTO URL, copy alamat link URL foto tersebut lalu paste di Profile Blogger.com pada kolom Photo URL setelah itu tinggal SAVE CHANGES dan REPUBLISH. Selesai, selamat mencoba.
0 komentar Selengkapnya »

Membuat Tampilan Gambar Animasi Link Blogger

by Bg dani tag : ,



Langkah-langkah sebagai berikut:
1. Login ke blogger trus klik "Layout -->> Edit HTML
2. Cari kode ini ]]></b:skin> kalo dah ketemu taru kode berikut ini di atasnya.

#Animasi_pojok {
position:fixed;_position:absolute;bottom:0px; left:0px;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }

3. Text yang dicetak tebal adalah posisinya, kalo pingin ganti di posisi pojok kanan bawah tinggal text "left" diganti dengan "right". Begitu juga tulisan "bottom", jika pingin di posisi atas bisa diganti dengan "top".
4. Langkah selanjutnya yaitu letekkan script berikut ini sebelum kode </body>

<div id="
Animasi_pojok">
<a href="http://sman11pku.blogspot.com">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6ZyDw9iOPSFfE-Z3djGpCwL8EQ8DWWI9xehz3ql8WLoBwxJ2pChEm79Wp_nFaPNLppWvHh2HYpMe_MyErzkUReJK5nCDAVcm6t5WpmA8SLUJE4n-S6jCdhpI-KABKJOG9Nlpw7I0G9dU/s320/SMAN+11.png" border="0" /></a>
</div>

"http://sman11pku.blogspot.com" adalah link/url ganti dengan link kamu.
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6ZyDw9iOPSFfE-Z3djGpCwL8EQ8DWWI9xehz3ql8WLoBwxJ2pChEm79Wp_nFaPNLppWvHh2HYpMe_MyErzkUReJK5nCDAVcm6t5WpmA8SLUJE4n-S6jCdhpI-KABKJOG9Nlpw7I0G9dU/s320/SMAN+11.png" adalah lokasi gambarmu, ganti dengan lokasi gambar kamu.

5. Jika kamu pingin yang ada disitu bukan gambar tetapi jam/kalender/hit counter/widget-widget yg lain, maka ganti text yang berwarna merah dengan script widget-widget tersebut.
6. Simpan hasil kerja kamu dan lihat hasilnya.
1 komentar Selengkapnya »

Membuat Read More di Blogger

by Bg dani tag : ,

Wah judul yang aneh, "membuat Read More" maksudnya apa? Begini sobat, sebenarnya saya kurang setuju dengan judul tersebut, tadinya saya ingin memberi judul "Membuat menu Selengkapnya", tapi berhubung kata "Read More" yang paling di kenal di jagad blog, ya saya pun ikut-ikutan (dasar tukang ngekor). Ya sudahlah kepanjangan ngobrolnya. Kita mulai pembahasannya. Bagi para sobat yang baru mulai membuat blog, mungkin belum mengetahui informasi ini dan mudah-mudahan dengan membaca artikel ini dapat menambah pengetahuan kita tentang yang namanya nge-blog.

Sobat mungkin melihat bahwa artikel-artikel saya terlihat hanya berupa judul-judul dengan satu atau dua buah paragrap saja, dan untuk melihat keseluruhan artikel harus meng klik link yang bertuliskan >> Selengkapnya...", ini di sebut pengkaburan atau pengkamuflasean postingan (ribet banget nyebutnya). Bagi sobat yang baru posting artikel hanya satu atau dua artikel saja mungkin menganggap tidak perlu menyingkat artikel sobat, namun jika nanti artikel sobat sudah banyak, maka mungkin saja ada terbersit ingin membuat menu ini.

Oke... kelamaan ngawurnya, mending langsung saja. Untuk membuat menu Read more kita harus menambahkan beberapa kode HTML ke dalam template blog kita. Tapi untuk postingan kali ini, saya khususkan untuk blogger yang memakai template klasik saja, untuk yang memakai template baru silahkan tunggu pada postingan yang akan datang.

Langkah-langkahnya sebagai berikut:

1. Sign in / login di blogger dengan username Anda
2. Klik menu layout
3. Klik Edit HTML
4. Beri centang Expand Template Widget
5. Sisipkan kode berikut sebelum </head> atau setelah ]]></b:skin>

<style>
<b:if cond='data:blog.pageType == "item"'>
span.fullpost {display:inline;}
<b:else/>
span.fullpost {display:none;}
</b:if>
</style>

6. Selanjutnya cari <p><data:post.body/></p> , kemudian selipkan kode berikut sesudah tag tadi:

<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'> Read More...</a>
</b:if>

7. Kemudian simpan template
8. Setelah tersimpan, klik menu Pengaturan kemudian klik Format
9. Nah, setelah masuk.. pada kotak isian paling bawah isi dengan kode:
<span class=�fullpost�>

</span>

10. Kemudian klik simpan pengaturan
11. Selesai

Selanjutnya cara penulisan posting agar artikel terpotong adalah sebagai berikut:

1. Klik menu posting
2. Klik menu Edit HTML
3. Kemudian tulislah artikel anda dengan syntax:Artikel yang ada di awal/headline <span class="fullpost"> artikel sisa sampai selesai </div>
4. kemudian klik mempublikasikan posting
5. selesai

Sekarang lihat perubahannya !!!
0 komentar Selengkapnya »

Cara Memposting Artikel

by Bg dani tag : ,

Bagi anda yang mengalami sedikit kendala tentang tata cara memposting suatu artikel kedalam blog, maka kali ini akan di bahas tentang tata cara posting di blogger.com. Di dalam menu posting ada beberapa toolbar yang bisa anda gunakan.Jika anda sudah terbiasa menggunakan microsoft Word ataupun microsoft Excel tentu barangkali tidak akan mengalami kesulitan ketika memposting suatu artikel, tapi mungkin tidak ada salahnya bila saya bahas sekilas tentang ini, barangkali ada di antara teman kita yang masih bingung.

Toolbar yang ada ketika posting :

--> Untuk merubah jenis hurup yang di gunakan

--> Untuk merubah ukuran hurup (heading)

--> Untuk Menebalkan hurup

--> Untuk memiringkan hurup

--> Untuk merubah warna hurup

--> Untuk membuat link

--> Untuk membuat artikel menjadi rata kiri

--> Untuk membuat tulisan menjadi di tengah

--> Untuk membuat artikel menjadi rata kanan

--> Untuk membuat artikel menjadi rata kiri dan rata kanan

--> Untuk membuat sub bahasan oleh angka

--> Untuk membuat sub bahasan oleh bullet

--> Untuk mengecek spelling

--> Untuk memasukan gambar(upload gambar)

--> Untuk membuat artikel dalam kode HTML

--> Untuk membuat artikel dalam mode Compose (biasa)

--> Untuk me review (melihat) artikel

Cara penggunaan toolbar di atas adalah blok (beri tanda) terlebih dahulu tulisan yang akan di edit, kemudian tekan tombol toolbar yang di inginkan.

Langkah-langkah dalam memposting suatu artikel:
  1. Sebaiknya klik terlebih dahulu “ Edit HTML”,jika langsung di mode “Compose”, sering terjadi hang pada komputer (pengalaman saya pribadi). Copy artikel yang telah anda buat sebelumnya, kemudian paste di area posting. Edit sesuai dengan kemauan anda.

  2. Klik tombol “ compose “ untuk melakukan editing (jika anda masih bingung dengan kode HTML).

  3. Klik tombol tool yang berlambang “ panorama” berwarna biru, jika anda ingin memasukan gambar ataupun photo untuk menghiasi posting-an anda.

  4. Klik tombol “ Preview “ untuk melihat hasil posting-an anda yang nantinya akan tampil di dalam blog, barangkali masih ada yang perlu di edit.

  5. Klik tombol “ publish “. Selesai. Tulisan hasil karya anda akan bisa dilihat dan di baca oleh seluruh dunia.
0 komentar Selengkapnya »

Looking for something?

Use the form below to search the site:

Still not finding what you're looking for? Drop a comment on a post or contact us so we can take care of it!

Komentar Masuk