Sabtu, 03 Mei 2014

0 koleksi foto di old traffod







0 Cara Membuat Judul Blog Bergerak

  Cara membuat marquee pada judul blog atau cara memodifikasi judul blog agar bisa bergerak dan berjala n. Beberapa waktu lalu saya sudah posting artikel tentang  dan kali ini saya akan posting artikel yang sejenis tapi beda dan penerapannya kali ini ini pada judul blog dengan judul artikel cara membuat judul blog bergerak. Judul / Title blog secara default, berada dalam kondisi statis. Namun, kita bisa memberikan efek pada judul blog kita dengan kode JavaScript, sehingga bisa bergerak dari kanan ke kiri. Langsung saja berikut ini cara memodifikasi judul blog agar bisa bergerak dan berjalan - Judul blog berjalan :




  • Login ke dashbor blog sobat.
  • Klik Tata Letak >> Tambah Gadget >> Pilih HTML / Java Script.
  • Copy dan paste code berikut di HTML / Javascript
<script language=javascript>msg = "Test Blog ...Test Blog ...";
msg = "..." + msg;pos = 0;function scrollMSG() {document.title = msg.substring(pos, msg.length) + msg.substring(0, 
pos);pos++;if (pos > msg.length) pos = 0window.setTimeout("scrollMSG()",200);}scrollMSG();</script>

 Note: Ganti 'Test Blog ...Test Blog ...' dengan teks yang diinginkan. Save/Simpan, dan lihat hasilnya.
Saya kira cukup penjelasan mengenai cara membuat judul blog bergerak kali ini. Semoga bermanfaat.

1 Cara Menampilkan Rating Bintang di Hasil Pencarian Google

, Cara membuat richsnippets, Cara membuat rich snippets - Setelah sekian lama mencari artikel tentang cara menampilan rating star di hasil percarian google, akhirnya ane dapat juga tutorialnya. Caranya sangat mudah dan berbeda dengan tutorial lain yang pernah saya coba sebelumnya yang tentuhnya nggak berhasil, entah mungkin karna masalah template atau apalah  ..ane nggak tahu..
Untuk bisa menampilkan rating bintang ini, sobat terlebih dahulu harus memiliki akun di google plus dan sudah harus terhubung dengan blog sobat dengan cara mengklaim sebagai kontributor untuk blog sobat tersebut. Masih bingung? Khusus yang belum punya akun di google plus, entar akan ane posting tutorialnya.
Sekedar tambahan, rating bintang ini nantinya akan dimunculkan di hasil pencarian untuk artikel - artikel blog sobat terutama artikel yang baru diposting sesaat setelah mengikuti dan memasang ratting bintang di tutorial kali ini.. 
Cara Menampilkan Rating Bintang di Google 1. Login ke akun blog sobat2. Klik Rancangan --> Edit HTML --> Centang kotak kecil di samping tulisan Expand Template widget 3. Letakkan kode berikut tepat diatas kode <b:skin><![CDATA[/*

<b:if cond='data:blog.url == data:blog.homepageUrl'><link href='https://plus.google.com/112092088130426761224' rel='publisher'/>
</b:if>
catatan:
ganti angka berwarna biru dengan Url google plus milik sobat.

4. Kemudian letakkan kode berikut sesudah kode <body>
<div><div itemscope='' itemtype='http://data-vocabulary.org/Review'>

dan tag penutup </div></div> sebelum tag penutup </body> 

5. Cari kode <data:post.body/> dan letakkan kode berikut tepat dibawahnya.
Description: <span itemprop="description"><data:post.title/></span>
Rating: <span itemprop='rating'>4.5</span>
Reviewer: <span itemprop='reviewer'><data:post.author/></span> -
ItemReviewed: <span itemprop='itemreviewed'><data:post.title/></span>
Tambahan:
Kode <data:post.body/> akan berjumlah 2 jika sobat telah memasang readmore, pilih kode yang ke 2.

6. Klik save dan lihat hasilnya. Cek Disini http://www.google.com/webmasters

0 Membuat Tanda Tangan di Blog

tanda tangan
Cara Memasang Tanda Tangan di Blog - Apa kabar sobat blogger! Senang di pagi yang cerah ini saya kembali menyapah sobat blogger... Hmmm. sekedar info, mungkin beberapa hari kedepan ane tak mungkin ngapdet posting serutin ini jadi kali ini saya akan kasih tutorial cara memasang tanda tangan dengan selengkap - lengkapnya.
Pada postingan sebelumnya kita telah membahas tentang Membuat menu accroding di Blog , dan kali ini setelah sekain lama tersimpan di draft akhirnya artikel ini di Poskan dengan judul Cara Bikin Tanda Tangan di Blog. Mungkin di antara sobat blogger sudah pernah melihat hiasan yang satu ini, biasanya diletakkan di bagian bawah postingan yang semakin menegaskan bahwa sobat adalah pemilik resminya. Bagi sobat yang tertarik, silahkan ikuti tutorial berikut.

Cara Memasang / Membuat Tanda Tangan di Blog
1. Kunjungi situs http://mylivesignature.com
2. Klik pada tombol bertuliskan Proceed untuk membuat tanda tanda tangan tanpa perlu registrasi.

3. Setelah itu, klik tulisan Using the signature creation wizard.

4. Silahkan masukkan nama sobat di kotak yang di sediakan dan klik Next Step
tanda tangan

5. Pilih jenis huruf yang di inginkan dan klik Next Step. 

6. Setelah itu, tentuhkan ukuran tanda tangan yang di inginkan dan klik next step.
tanda tangan

7. Kemudian sobat akan melihat tampilan seperti berikut yang bertanda bahwa tanda tangan sobat akan segera jadi. Pilih warna background dan warna tanda tangan yang di inginkan.

Tambahan :
Untuk warna background direkomendasikan menggunakan background ( latar ) transparan agar nantinya cocok dengan semua warna.

8. Atur kemiringan ( slope ) teks dan klik Next Step
tanda tangan

9. Nah dengan demikian maka tanda tangan online sobat telah berhasil dibuat.

Membuat Tanda Tangan di Blog
Tambahan :
Klik Copy Image Location untuk mengambil URL gambarnya
Klik Save Image As untuk mendownload Tanda Tangannya.

Beginilah hasilnya
Membuat Tanda Tangan di Blog

0 Cara mempercepat loading blog

Tips dan Trik Mempercepat Loading Blog -  Loading blog yang lemot memang kadang kala sering membuat kita kesal, bayangkan saja jika kita harus menunggu bermenit - menit untuk membuka 1 halaman saja.. huh pasti membosankan tu... Sekedar info, sebenarnya selain faktor perangkat, faktor utama mengapa loading blog kita itu bisa sampai lambat yaitu karna jumlah widget yang terlalu banyak. Untuk memperindah tampilan blog, biasanya kita memasang jam, kalender, dan berbagai macam animasi yang sebenarnya tidak terlalu berguna bahkan hanya akan membuat pengunjung blog bosan dengan tampilan blog yang terlalu norak plus loading blog yang lemot.
Setelah sebelumnya memposting artikel tentang Cara membuat wigget menjadi nofollow, kali ini saya akan kasih beberapa tips singkat untuk mempercepat loading blog. Simak tutorialnya berikut.

1. Yang Terutama dan Paling Utama yaitu dengan Mengurangi Jumlah Widget yang tidak terlalu perting seperti jam, animasi, kalender dan lain - lain apa lagi yang berbentuk flash. 
2. Mengkompres css template blog sobat di CSS Compresor, caranya :

  • Silahkan Menuju http://www.cssdrive.com/index.php/main/csscompressor/
  • Kemudian sobat akan menjumpai beberapa pilihan seperti gambar berikut
Kompres template blog
  • Seper pada gambar, sobat pilih Normal pada Compression Mode dan Don't strip any comment pada Comment handling
  • Masukkan kode CSS template blog sobat yaitu kode antara kode <b:skin> dan ]]></b:skin> pada kotak yang di sediakan 
  • kemudian Klik Compress - it.
3. Jika kedua cara di atas belum juga membuat template blog menjadi ringan, mungkin banyak kode CSS yang eror di template blog sobat. Silahkan cek di http://jigsaw.w3.org/css-validator/ . Caranya
  • Silahkan menuju http://jigsaw.w3.org/css-validator/
  • Kemudian Masukkan URL blog sobat di kotak yang di sediakan dan Klik Check
  • Setelah itu akan dimunculkan kode CSS yang eror atau tak berfungsi di blog sobat.
  • Silahkan tinjau ulang kode - kode yang dimunculkan di template blog sobat, atau kalau perlu dihapus saja..

Sekian tutorialnya semoga membantu...

Jumat, 02 Mei 2014

0 Cara Membuat Background Bergerak di Blog

Info unik kali ini mengenai salah satu trik membuat gambar background blog menjadi dinamis. Trik ini menggunakan JQuery sederhana yang dikhususkan untuk membuat gambar background menjadi bergerak (Scrolling Background). Script ini membuat gambar background blog bergerak secara vertikal dari arah bawah ke arah atas. Buat sobat blogger yang ingin mencobanya silakan disimak trik membuat scrolling background berikut ini.


  • Login » blogger.
  • Rancangan » Edit HTML.
  • Apabila anda belum menggunakan kode JQuery silakan anda pasang kode JQuery dibawah ini tepat di atas Kode </Head>.

    <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js?ver=1.3.2' type='text/javascript'></script>

  • Copy-Paste kode di bawah ini tepat di atas Kode </Head>.

    <script type='text/javascript'>
    //<![CDATA[
    $(function(){
    // ***
    // Scrolling background
    // ***
    // height of background image in pixels
    var backgroundheight = 4000;

    // get the current minute/hour of the day
    var now = new Date();
    var hour = now.getHours();
    var minute = now.getMinutes();

    // work out how far through the day we are as a percentage - e.g. 6pm = 75%
    var hourpercent = hour / 24 * 100;
    var minutepercent = minute / 30 / 24 * 100;
    var percentofday = Math.round(hourpercent + minutepercent);

    // calculate which pixel row to start graphic from based on how far through the day we are
    var offset = backgroundheight / 100 * percentofday;

    // graphic starts at approx 6am, so adjust offset by 1/4
    var offset = offset - (backgroundheight / 1);

    function scrollbackground() {
    // decrease the offset by 1, or if its less than 1 increase it by the background height minus 1
    offset = (offset < 1) ? offset + (backgroundheight - 1) : offset - 1;
    // apply the background position
    $('body').css("background-position", "50% " + offset + "px");
    // call self to continue animation
    setTimeout(function() {
    scrollbackground();
    }, 70
    );
    }
    // Start the animation
    scrollbackground();
    });

    //]]>
    </script>
  • Copy-Paste Kode CSS di bawah ini tepat di atas Kode </Head> untuk memasang gambar background. Anda dapat mengganti gambar background sesuai dengan yang anda inginkan dengan merubah alamat hosting gambar pada Kode CSS di bawah dengan alamat hosting gambar yang anda pilih.

    <style>
    body {
    background: black url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbSTYqWwAdmmSTCy4wQWgyS91K33O4-_k3ERgMAXrgvP-ykm7STKWsJOdV8HfNkJbzyyOzGW4qwMBowX82p9rY5NhQIz7IrOZ2zEwOzBIop-VnUtP7n48hlqvSX2faYvEMhkpT2E8CLHU1/s800/bg.gif) repeat center; background-attachment: fixed;
    }
    </style>

  • Keterangan :
    - repeat // Pengulangan gambar arah x dan y.
    • repeat-x // Pengulangan gambar hanya arah horizontal.
    • repeat-y // Pengulangan gambar hanya arah vertikal.
    - http://3.bp.blogspot.com/-tS5lZKl3Qag/TtjQUfMzi2I/AAAAAAAAAkA/QZc2FwvhW4o/s200/bg.gif // URL Link gambar.
    - center // Lokasi gambar berada di tengah layar.
    • Left // Lokasi gambar berada di kiri gambar.
    • Right // Lokasi gambar berada di kanan gambar.