Tampilkan postingan dengan label Tips Blogger. Tampilkan semua postingan
Tampilkan postingan dengan label Tips Blogger. Tampilkan semua postingan

Rabu, 13 November 2013

Tips blog Cara Membuat SMS Gateway untuk Pemula Dengan Gammu dan PHP

Tips blog Cara Membuat SMS Gateway untuk Pemula Dengan Gammu dan PHP



Sebelumnya saya sudah membuat aplikasi SMS Gateway dengan gammu yaitu Aplikasi Reservasi Klinik Rumah Sakit. Sekarang saya akan menjelaskan bagaimana cara membuat SMS Gateway sendiri dengan Gammu dan PHP.
Membuat SMS Gateway untuk Pemula Dengan Gammu dan PHP 
 
Yang perlu dipersiapkan adalah :
1. Local WebServer seperti XAMPP , AppServ , WAMP
1. Aplikasi Gammu, saya memakai OS Windows karena kebanyakan orang pakai Sistem Operasi ini
2. Modem Plug n Play (Modem GSM,Modem CDMA)
3. Sebuah kartu GSM/CDMA yang sudah terisi pulsa ( kalau tidak ada pulsa mau ngapain? :D )
4. Sedikit mengetahui pemrograman PHP
Hanya itu? ya benar, hanya itu saja yang diperlukan.

Berikut modul step by step nya :
pertama ini, saya akan menjelaskan bagaimana cara installasi Local WebServer . Saya memakai XAMPP untuk Local WebServer nya. Apa fungsi Aplikasi Tersebut ? Local WebServer berfungsi untuk menjalankan perintah PHP dan MySQL (Database)



Download Aplikasi XAMPP

(versi terbaru saat artikel ini dibuat adalah 1.81 )
Setelah di download, jalankan XAMPP Setup, Jika Parental Control masih aktif , anda bisa menonaktifkan fitur tersebut atau klik kanan Setup tersebut Run As Administrator

Klik Next

Pilih komponen yang akan diinstall, rekomendasikan pilihan saya ini, karena kita akan menginstall komponen yang seperlunya saja

Install komponen Apache,MySQL,PHP,Perl dan PhpMyAdmin dan klik Next

Pilih folder installasi , rekomendasikan juga di C:\xampp

Uncheck Learn More about BitNami for Xampp
Klik Next dan Next.

Setelah anda menginstall xampp , maka untuk password defaul MySQL adalah :
username : root
password : (kosong)

Tes Local WebServer bekerja apa tidak 
Buka browser (firefox/opera/chrome) lalu ketikkan http://localhost
Jika Local WebServer bekerja maka ditampilkan halaman ini




Install Service Xampp agar berjalan pada startup Windows. Fungsinya agar tidak susah payah menjalankan xampp.

Klik Start Windows (bawah kiri Windows ) cari dan klik submenu Xampp 1.8.1 pilih XAMPP Control Panel



1. Klik Stop Action Apache dan MySQL
2. Check Module Service Apache dan MySQL
3. Klik Start Actions Apache dan MySQL kembali
Keterangan : Jika anda memiliki installasi Local WebServer lainnya yang terinstall pada Port 80, maka disable terlebih dahulu atau uninstall sekalian 3:)

Selesai, Xampp akan berjalan otomatis saat Windows Start

Download gammu untuk Windows 32 atau 64 Bit  ( Jika Windows anda versi 64 Bit maka ada folder pada C:\program files (x86) ).


Saya mendownload versi minimal , saat artikel ini dibuat versi gammu 1.33.0

Buat sebuah folder smsku pada c:\xamp\htdocs

Buka file gammu yang didowload tadi dengan winrar atau tools compression lainnya. Klik folder bin pada file gammu zip tersebut, lalu copy gammu yang di dowload tadi ke dalam folder smsku dengan menseleksi semua filenya dan drag ke folder smsku


Ok guys, kita udah sampai setengah jalan untuk membuat aplikasi sms gateway dengan gammu dan php

Setelah 2 artikel sebelumnya, sekarang saya akan memberikan artikel konfigurasi gammu.
Ayo,modem USB dan kartu perdana GSM/CDMA tadi mana? apa sudah registrasi kartunya dan diisi pulsa? Jika sudah colokin Modem USB ke USB komputer, dan install paket drivernya
Di sini saya memakai Modem USB Advance

Cari port modem usb
Jika modem usb sudah terinstall dengan benar, maka buka Control Panel -> Device Manager





Buka kategori modem, nah di sana ada berbagai macam driver modem. Jika anda tidak tahu modem usb mana yang tertera pada kategori modem tersebut, copot lagi modem dan pasang lagi. Nah device manager otomatis refresh list driver modem nya. Tahu maksud saya kan? :D
Modem USB saya di sini Global Wireless USB Modem, klik kanan dan klik properties. Klik tab modem

Modem saya menggunakan Port COM9 dan Maximum Port Speed 921600. Jadi untuk konfigurasi jenis koneksi/speed maximum modem begini :


at = maximum speed 921600

at115200 = maximum speed 115200



Membuat file Konfigurasi
Sekarang masuk ke folder c:\xampp\htdocs\smsku
Buka notepad dan tulis :



[gammu]

# isikan port modem USB di bawah ini

port = COM9:

# isikan jenis connection di bawah ini

connection = at




simpan dengan nama gammurc (tidak pakai extension)

Buat database untuk gammu
Buka browser dan ketik (1)http://localhost/phpmyadmin
Klik (2)Database, Buat sebuah database (3) smskudb dan klik (4)Create


Buka kembali file gammu yang di download tadi, buka folder share -> doc -> gammu -> examples -> sql




Lalu import script mysql.sql dengan membuka http://localhost/phpmyadmin dan klik database smskudb, klik import . Klik browse, masuk folder smsku dan pilih mysql.sql dan klik Done



Buat konfigurasi database gammu
Buka notepad dan ketik :

[gammu]

# isikan port modem USB di bawah ini

port = COM9:

# isikan jenis connection di bawah ini

connection = at



[smsd]

service = mysql

logfile = smsdlog

debuglevel = 0

# Inisial modem

phoneid = Server1

commtimeout = 10

sendtimeout = 10

PIN = 1234

pc = localhost



# isikan user untuk akses ke MySQL (xampp default root)

user = root

# isikan password user untuk akses ke MySQL (xampp defaul null )

password =

# isikan nama database untuk Gammu

database = smskudb



Lalu simpan dengan nama smsdrc

Tes koneksi modem
Buka command prompt/cmd ketikkan seperti gambar
Jika terbaca maka ada info detail modemnya, berarti konfigurasi nya sukses :)

Install Services Gammu agar jalan otomatis saat Windows Startup
Buka command prompt/cmd dan ketikkan

Konfigurasi gammu selesai :)

Menulis kode kirim sms dengan php
Buka folder c:\xampp\htdocs\smsku. Buat sebuah file kirimsms.php lalu tulis kode berikut :





<form method="post">

<label>No HP Format +62xxxxxxx </label>

<input type="text" name="nohp">

<label>Pesan</label>

<input type="text" name="pesan">

<input type="submit" name="button" value="Kirim">

</form>

<?php

if(isset($_POST['button']))

{

    mysql_connect("localhost","root","");

    mysql_select_db("smskudb");

    $query=mysql_query("INSERT INTO outbox (DestinationNumber,

    TextDecoded) VALUES ('".$_POST['nohp']."', '".$_POST['pesan']."')");

    if($query)

    {

        echo "<script>alert('Sukses kirim sms')</script>";

    }

}

?>
Keterangan :
Membuat form kirim pesan

<form method="post">

<label>No HP Format +62xxxxxxx </label>

<input type="text" name="nohp">

<label>Pesan</label>

<input type="text" name="pesan">

<input type="submit" name="button" value="Kirim">

</form> 
Jika tombol Kirim diklik

if(isset($_POST['button']))

{
Buat koneksi database, masih ingat bukan tutorial installasi Local WebServer ? mysql_connect fungsi php untuk mengkoneksikan sebuah server database mysql_connect(nama server,user database,password database), mysql_select_db fungsi php untuk memanggil database

mysql_connect("localhost","root",""); 

mysql_select_db("smskudb"); 
Query SQL atau bisa dikatakan perintah untuk MySQL Database. Lihat kembali http://localhost/phpmyadmin lalu pilih database smskudb, maka ada tabel outbox, nah tabel outbox tersebut diperintah untuk diiskan

$query=mysql_query("INSERT INTO outbox (DestinationNumber,

    TextDecoded) VALUES ('".$_POST['nohp']."', '".$_POST['pesan']."')");
 Jika query sql telah dijalankan, maka keluarkan output peringatan, kita sedikit menggunakan kode javascript :)

if($query)

    {

        echo "<script>alert('Sukses kirim sms')</script>";

    }
Nah mudah bukan?

tahap finalnya, setelah bisa mengirimkan sms. Sekarang kita akan membuat auto reply sms nya. Contoh Format REG#Nama#Tanggal#Jenis Kelamin#Alamat


Membuat kode auto reply sms

Masuk ke folder c:\xampp\htdocs\smsku dan buat sebuah file autoreply.php , ketikkan kode sebagai berikut:


<?php



mysql_connect("localhost","root","");



mysql_select_db("smskudb");



$query = "SELECT * FROM inbox WHERE Processed = 'false'";

$hasil = mysql_query($query);

while($data= mysql_fetch_array($hasil)){

    $id = $data['ID'];

    $noPengirim = $data['SenderNumber'];

    $msg = strtoupper($data['TextDecoded']);

    $pecah = explode("#",$msg);

    $d_tgl=$pecah[1];

    $d_nama=$pecah[2];

    $d_jk=$pecah[3];

    $d_alamat=$pecah[4];

    if($pecah[0]=="REG")

    {

        if($pecah[1] !="" and $pecah[2] !="" and $pecah[3] !="")

        {

            $today = date("Ymd");

            $tgl=date("d M Y");

            $newDate = date("Y-m-d", strtotime($d_tgl));



            $isinyo="Nomor ".$noPengirim." Nama ".$d_nama." JenisKel ".$d_jk." Alamat ".$d_alamat;

            $query=mysql_query("INSERT INTO outbox (DestinationNumber,

            TextDecoded) VALUES ('".$noPengirim."', '".$isinyo."')");     



        }else{

            $query=mysql_query("INSERT INTO outbox (DestinationNumber,

            TextDecoded, CreatorID) VALUES ('".$noPengirim."', 'Gagal Registrasi. Format : REG#Tanggal#Nama#PRIA/WANITA#Alamat')");

        }

    }else{

            $query=mysql_query("INSERT INTO outbox (DestinationNumber,

            TextDecoded) VALUES ('".$noPengirim."', 'Gagal Registrasi. Format : REG#Tanggal#Nama#PRIA/WANITA#Alamat')");

    }

    $query3 = "UPDATE inbox SET Processed = 'true' WHERE ID = '$id'";

        mysql_query($query3);

}

?>
Keterangan :
Query Inbox , melakukan pencarian data inbox yang masuk dalam modem USB dan tabel inbox

$query = "SELECT * FROM inbox WHERE Processed = 'false'";

$hasil = mysql_query($query);
Looping data inbox

while($data= mysql_fetch_array($hasil)){

Membuat variabel untuk record data inbox

$id = $data['ID'];

$noPengirim = $data['SenderNumber'];

$msg = strtoupper($data['TextDecoded']);

Membagi format berdasarkan karaktek #

$pecah = explode("#",$msg);

$d_tgl=$pecah[1];

$d_nama=$pecah[2];

$d_jk=$pecah[3];

$d_alamat=$pecah[4];
Jadi $d_nama adalah isi dari format sms NAMA yang dikirimkan

Cek format SMS pertama sekali adalah REG dan Cek semua format SMS

 if($pecah[0]=="REG")

    {

        if($pecah[1] !="" and $pecah[2] !="" and $pecah[3] !="")

        {

Konversi tanggal php ke mysql

$today = date("Ymd");

$tgl=date("d M Y");

$newDate = date("Y-m-d", strtotime($d_tgl));

Setelah terkirim, maka status inbox tersebut sudah terkirim "true"

$query3 = "UPDATE inbox SET Processed = 'true' WHERE ID = '$id'";

        mysql_query($query3);


Ops, ini belum selesai. SMS Gateway tidak akan respon jika tidak ada eksekusi terlebih dahulu. Lalu bagaimana caranya ?
Buat sebuah bat script, buka notepad dan ketikkan :

C:\xampp\php\php -f C:\xampp\htdocs\smsku\autoreply.php
Simpan dengan nama daemon.bat (terserah mau apa namanya)
Jadi,jika kita klik daemon.bat, maka semua sms pada tabel inbox yang statusnya false akan ter-kirim dengan sendirinya. Tapi apakah harus jalankan daemon.bat setiap kali?
Nah, ini yang jadi pertanyaan. Banyak orang memakai trigger mysql ataupun dengan memakai konfigurasi runonreceive pada gammu. Namun ada kendalanya
Dengan Trigger :
Format SMS tidak bisa dilakukan sesuka hati
Dengan runonreceive :
Terkadang saya mencoba malah tidak jalan

Solusi saya ya bikin aplikasi untuk menjalankan daemon.bat tersebut dengan Visual Basic hahaha..
Caranya mudah kok,tapi saya tidak menjelaskan dengan detail.
Buat sebuah project Visual Basic dan Masukkan Timer dengan Interval 1000 lalu masukkan script pada Timer :

Private Sub Timer1_Timer()
Shell daemon.bat, vbHide
End Sub

Lalu compile dan buat sebuah start up dengan menitipkan shortcut pada folder :
C:\Users\NAMAUSER\AppData\Roaming\Microsoft\Windows\Start Menu\Programs\Startup




Senin, 11 November 2013

Tips blog Daftar 20 Situs Auto Ping Blog untuk Menaikan Pengunjung Blog Anda

 Tips blog Daftar 20 Situs Auto Ping Blog untuk Menaikan Pengunjung Blog Anda

Ping Blog Mempercepat Postingan Terindex Search Engine.
Sebagai blogger mungkin sudah tidak asing dengan istilah ping blog. Ping blog merupakan  tool untuk mempercepat blog kita terindex oleh search engine, biasanya kalau sudah update blog kemudian kita melakukan ping blog. Dengan demikian postingan baru akan cepat tampil di Search enggine dan menghasilkan traffic pada blog kita.

Ping blog ini bekerja otomatis menyebar ke banyak search engine, kita hanya mengisi form yang disediakan saja, biasanya kolom judul blog, home page blog dan RSS URL. Tapi tidak semuanya support dengan RSS URL, hanya di situs-situs tertentu yang menyediakan RSS URL.

langsung aja menuju  Tips blog Daftar 20 Situs Auto Ping Blog untuk Menaikan Pengunjung Blog Anda, berikut situsnya :

    -pingomatic.com  PR 7 , RA 1.131 . Ping blog ini sudah tidak asing lagi bagi blogger, support untuk ping RSS URL blog.
   - pingmyblog.com  PR 5 , RA 5.074. Untuk ping URL blog dan RSS.
   - pingoat.com  PR 5 , RA 5.748 . Support untuk ping URL blog dan RSS.
    -feedshark.brainbliss.com  PR 5 , RA 18.560 . Support juga untuk ping RSS dan podcast.
    -auto-ping.com PR 5 RA 22.930 . Untuk ping URL blog dan RSS. Ini favorit saya, caranya dengan memasang widget di blog sehingga mempermudah kita untuk ping setelah update blog hanya dengan 1 kali klik. Contohnya seperti yang terpasang diblog saya ini.
    -pingler.com  PR 4 , RA 3.325 . Untuk ping RSS harus mendaftar dahulu, smentara ping blog URL bisa langsung tanpa daftar.
    -pingates.com  PR 4 , RA 28.170 . Hanya untuk ping URL blog.
    -totalping.com  PR 3 , RA 6.153 . Sama sperti auto-ping.com diatas. Kalau ini ping blog dahulu kemudian memasang widget.
    -autopinger.com  PR 3 , RA 26.071 . Hanya untuk ping blog saja.
    -blogpingtool.com  PR 3 , RA 50.210 . Support untuk ping RSS, diharuskan memasang code yang sudah diberikan di blog/web setelah melakukan ping.




-http://blogsearch.google.com/ping ping langsung pada google
-http://www.twingly.com/ping
-http://www.blogpingsite.com

-http://www.icerocket.com/c?p=ping
-http://googleping.com




Jika terlalu sering di ping tidak akan di banned oleh google,namum menurut saya tidak lah perlu,karena tujuan ping blog adalah memberitahukan ke SE agar segera melakukan cache pada situs kita.jika tidak terjadi perubahan pada blog kita dan kita melakukan ping,hasil cache nya akan sama,jadi buat apa cape - cape ping blog.

Tips Blog Cara mengatasi pesan "Terjadi kesalahan saat mencoba menyimpan atau mempublikasikan pos Anda. Coba lagi. Abaikan peringatan"

Tips Blog Cara mengatasi pesan "Terjadi kesalahan saat mencoba menyimpan atau memublikasikan pos Anda. Coba lagi. Abaikan peringatan" 
beberapa waktu ini, ketika kita hendak mempublis postingan kita sering muncul pesan galat post yang berbunyi "An error occurred while trying to save or publish your post. Please try again". Setelah cek ulang post yang kita buat, ternyata tidak ada kesalahan, yang di mana biasanya pesan ini akan muncul jika kita salah dalam penulisan code tag apa pun, misalnya: kita menerapkan suatu fitur atau widget yang pada awalannya menggunakan
dan pada akhir kode tersebut tidak kita tutup dengan close tag
maka pesan "An error occurred while trying to save or publish your post. Please try again" akan muncul secara natural sebagai peringatan kesalahan dalam penulisan kode dalam post template kita.

Namun untuk waktu-waktu dekat ini, pesan tersebut muncul begitu saja tanpa ada sebab yang jelas. Ada apa gerangan?


Sebenarnya munculnya peringatan ini tidak begitu masalah, hanya saja benar-benar mengganggu kalau dalam waktu 30 detik peringatan ini terus muncul lebih dari satu kali...benar-benar mengganggu konsentrasi dan pemandangan ketika kita sedang membuat post baru.

Cara untuk menghilangkan pesan ini sebenarnya bisa dikatakan mudah => Klik "Ignore warning" secara berulang-ulang, maka akan hilang seketika. Lalu bagaimana jika masih muncul juga?

Ikuti tips "Mengatasi pesan An error occurred while trying to save or publish your post. Please try again" berikut ini:

1. Jika sobat yakin telah selesai menulis post dan sekarang lah waktunya untuk publish, maka kliklah tombol "save" (usahakan untuk mengklik tombol "publish" dulu, jika gagal itu baru klik tombol "save")

2. Sekarang, silahkan untuk mengklik pada bagian yang telah saya tandai dengan warna merah berikut...

Selanjutnya sobat akan dibawa ke halaman "all posts" (halaman pengeditan semua post, termasuk: published posts dan draft). Berikut adalah post sobat yang yang telah berhasil ditulis namun belum dipublis (ilustrasi: post draft ane):

3. Langkah selanjutnya, centang aja post tersebut lalu klik tombol "Publish". Selesai...

Sekarang post sobat telah berhasil di-publish. Jika masih ada masalah...silahkan untuk meninggalkan pertanyaan atau komentar. Thank Description: Cara mengatasi pesan "Terjadi kesalahan saat mencoba menyimpan atau memublikasikan pos Anda. Coba lagi. Abaikan peringatan" Rating: 4.5 Reviewer: Taufik Rizaldi - ItemReviewed: Cara mengatasi pesan "Terjadi kesalahan saat mencoba menyimpan atau memublikasikan pos Anda. Coba lagi. Abaikan peringatan"

Minggu, 29 September 2013

Cara Mudah Upload File CSS, Javascript, HTML Ke Google Drive


Google terus melakukan perubahan guna kenyamanan pengguna serta peningkatan efektifitas sistem.

Google Code merupakan tempat untuk melakukan upload file dengan berbagai jenis seperti CSS, JS (JavaScript), HTML, jQuery, dan sebagainya. Namun ketika Anda pergi ke Google Code sekarang, menu download sudah tidak ada lagi sehingga fungsi untuk upload file ke browser pun hilang. Proyek-proyek yang telah dibangun sebelumnya tetap akan masih tersimpan dan dapat digunakan.




Google Drive



Anda bisa dengan mudah mengupload kode CSS ataupun JavaScript pada web Anda. Caranya adalah dengan memanfaatkan fasilitas Google Drive.Google Drive akan mempermudah kita dengan banyaknya aplikasi yang disediakan oleh Google, mulai dari Pengolah kata, Pengolah Angka, Formulir, Presentasi, Pemutar Lagu, Video, Pembuatan Contact Form + Upload File (Integrasi dengan JOTFORM), terus Alat Konversi File, dan masih banyak lagi.



Berikut panduan, Tutorial cara mengupload file CSS, JavaScript di Google Drive Hosting :

1. Kunjungi Google Drive pada browser Anda.

2. Lalu jika Anda adalah pengguna baru silahkan login lewat email Gmail Anda dan buatlah satu buah folder sebagai tempat untuk menyimpan proyek file-file penting Anda. Caranya klik CREATE.

3. Setelah folder jadi, klik logo icon upload berwarna merah seperti gambar ini :




Upload Di Google Drive



4. Pilih File.

5. Cari dokumen Anda yang akan di upload.

6. Tunggu hingga proses unggah selesai yang ditampilkan pada bagian kanan bawah layar desktop Anda.

7. Klik SHARE.

8. Copy link yang disediakan, paste di Notepad terlebih dahulu.

9. Pada bagian Privacy, klik CHANGE. Mengubah privacy bertujuan untuk bagaimana file tersebut dapat diakses, jika private berarti khusus diri sendiri dan tidak dapat diakses oleh browser ketika meminta file css, js yang ter-upload tadi.




Google Drive Kode



10. Pilih Public, agar semua browser dan orang lain yang membuka web blog Anda dapat menggunakan file CSS atau JavaScript code yang di upload.

11. Maka akses akan berubah dari Private ke Public.

12. Click Save and save your link to share.



Sekarang, untuk mengkoneksikan antara file yang ada di Google Drive dengan blog Anda, caranya adalah seperti contoh di bawah ini :



Perhatikan, link to share file tadi, contohnya seperti di bawah ini :




https://docs.google.com/file/d/0B-EPE3cbkU9PeV9UOXI5Q1NrX0k/edit?usp=sharing



Kode berwarna biru, silahkan Anda salin dan ambil dan letakkan pada kode berikut untuk memanggil file Anda :



https://googledrive.com/host/Masukkan Kode File Disini



Maka, hasilnya akan seperti di bawah ini :



https://googledrive.com/host/0B-EPE3cbkU9PeV9UOXI5Q1NrX0k



Nah, sekarang struktur link tersebut sudah dapat digunakan untuk mengakses file kita dan coba buka URL diatas lalu lihat hasilnya, sama seperti ketika kalian menghosting File ke Your JavaScript atau Google Code kan! Struktur URL itulah yang bisa berfungsi untuk diterapkan ke Blog kita, lalu di bagian ini Anda juga bisa meletakkan ekstensi .js .css .html .php atau yang lainnya tapi harus sesuai dengan "Bahasa Pemrograman" yang Anda "host".



9.Kemudian untuk penerapannya ke Blog atau website kita tidak ada perbedaan dengan saat menghosting File ke Google Code, kurang lebih seperti di bawah ini :



Untuk File CSS penulisannya seperti ini :



<link href='https://googledrive.com/host/0B-EPE3cbkU9PeV9UOXI5Q1NrX0k' rel='stylesheet'/>



Untuk File JavaScript strukturnya seperti ini :



<script type="text/javascript" src="https://googledrive.com/host/0B-EPE3cbkU9PeV9UOXI5Q1NrX0k/"></script>



10. Silahkan Anda copy dan letakkan pada blog Anda di atas kode </head>



Tentu mudah kan. Ya, hampir sama dengan Google Code hanya berbeda sedikit dan cepat host tersebut. Itulah tadi panduan tentang memanfaatkan layanan Google Drive yang didalamnya Anda dapat meng-upload File Musik, Documen, Presentasi, Aplikasi Kecil, Data Microsoft Office Excell, Sistematika Statistik dan lainnya.

Kamis, 01 Maret 2012

Cara Membuat Teks Berjalan Di Laman Blog

Tulisan Bergerak
Atas permintaan teman akhirnya saya berbagi trik kuno ini. Dan sebelum kita membahasnya, terlebih dahulu kita wajib mengetahui apa itu "Marquee"? Marquee adalah suatu kode HTML untuk membuat teks agar bisa bergerak atau berjalan.



Seringkali kita melihat halaman blog teman yang dihiasi oleh tulisan atau kata-kata yang dapat berjalan. Mungkin sebagian besar dari Anda sudah mengetahui cara membuat tulisan berjalan tersebut. Tapi di posting kali ini, saya mencoba berbagi trik ini untuk Anda yang belum mengetahui cara membuatnya.



Cara membuatnya, yaitu:



- Pertama, login ke Blogger.



- Kemudian klik Rancangan dan Elemen Laman.



- Ketika sudah berada di Elemen Laman klik Tambah Gadget.



- Lalu pilih HTML/JavaScript.



Langkah selanjutnya, masukkan kode Marquee yang Anda inginkan seperti contoh di bawah ini:



1. Teks berjalan dari kanan ke kiri



Kodenya:







Hasilnya:



Contoh Tulisan Berjalan



2. Teks berjalan dari kiri ke kanan



Kodenya:







Hasilnya:



Contoh Tulisan Berjalan



3. Teks berjalan bolak balik



Kodenya:







Hasilnya:



Contoh Tulisan Berjalan



4. Teks berjalan dari atas ke bawah



Kodenya:







Hasilnya:



Contoh Tulisan Berjalan



5. Teks berjalan dari bawah ke atas



Kodenya:







Hasilnya:



Contoh Tulisan Berjalan



6. Teks berjalan mondar-mandir



Kodenya:







Hasilnya:



Contoh Tulisan Berjalan



7. Teks berjalan zig-zag lalu tembus



Kodenya:







Hasilnya:



Contoh Tulisan Berjalan




8. Teks berjalan zig-zag memantul



Kodenya:







Hasilnya:



Contoh Tulisan Berjalan


Langkah selanjutnya adalah mengganti tulisan.



Contoh Tulisan Berjalan
dengan tulisan atau kata-kata yang Anda inginkan.



Keterangan:



- direction="left/right/up/down" = mengatur arah gerakan teks.



- scrollamount="angka" = mengatur kecepatan gerakan dalam pixel, semakin besar angka semakin cepat gerakannya.



- behavior="scroll/slide/alternate" = untuk mengatur perilaku gerakan:

* Scroll: teks bergerak berputar.

* Slide: teks bergerak sekali lalu berhenti.

* Alternate: teks bergerak dari kiri ke kanan lalu balik lagi (bolak-balik)



Fungsi dari :



<center> ............. </center> adalah agar tulisan tersebut selalu berada di tengah.



Untuk Teks berjalan berwarna: Tambahkan kode <span style="color:#f00; font-weight: bold;"> di depan tulisan Contoh Tulisan Berjalan </span>, kode warna #f00 bisa Anda ubah dengan kode warna lainnya. Untuk kode warna selengkapnya, Anda bisa mencarinya di Google Search.



Selamat mencoba! Jangan lupa klik iklan yang ada. Thanks.

Rabu, 08 Februari 2012

Pasang Komentar Terbaru Dengan Avatar

Recent Comments with Avatar
Cara membuat Widget Komentar Terbaru Dengan Avatar:

1. Login

2. Rancangan

3. Tambah Gadget

4. Pilih Gadget HTML/Javascript

5. Salin Kode HTML di bawah ini, lalu tempel di kotak HTML.

6. Dan jangan ada yang terlewat ubah dulu http://SNIFAN.blogspot.com, dengan nama blog kalian, lalu SAVE.

7. Lihat Blog.



Kalau widgetnya tidak sesuai dengan sidebar blog kalian, ada beberapa kode yang ditandai miring di bawah ini yang bisa kalian utak-atik biar tampilan widgetnya sesuai dengan ukuran sidebar blog kalian.



Jika kalian tertarik sama widget komentar terbaru ini, silahkan dicoba. Gratis!



<style type="text/css">

ul.w2b_recent_comments{list-style:none;margin:0;padding:0;}

.w2b_recent_comments li{background:none !important;margin:0 0 6px !important;padding:0 0 6px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;}

.w2b_recent_comments li .avatarImage{padding:3px;background:#fefefe;-webkit-box-shadow:0 1px 1px #ccc;-moz-box-shadow:0 1px 1px #ccc;box-shadow:0 1px 1px #ccc;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;}

.avatarRound{-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;}

.w2b_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}

.w2b_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;}

</style>

<script type="text/javascript">

//<![CDATA[

// Recent Comments Settings

var

numComments = 20,

showAvatar = true,

avatarSize = 60,

roundAvatar = true,

characters = 40,

showMorelink = false,

moreLinktext = "More �",

defaultAvatar = "http://www.gravatar.com/avatar/?d=mm",

hideCredits = false;


//]]>

</script>

<script type="text/javascript" src="http://snifan-blogspot.googlecode.com/files/recentcomment.js"></script>

<script type="text/javascript" src="http://SNIFAN.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=20"></script>




Happy Blogging!

Kamis, 19 Januari 2012

Tips Blog Cara Mengubah Localhost Menjadi Nama Domain

Mengubah Localhost Menjadi Nama Domain - Postingan ini ada kaitannya dengan postingan sebelumnnya yaitu Tutorial Membuat Website Professional. Jadi disini saya akan menambahkan cara dari artikel sebelumnnya. Sebelum anda mengikuti cara ini sebaiknnya tentukan dulu domain apa yang akan anda pakai (Cara ini digunakan memakai xampp dan cms joomla). Coba lihat contoh web yang saya buat dibawah ini:


Nah jika anda sudah lihat domain pada address bar diatas, yaitu , domain tersebut sudah saya ganti dari localhost menjadi .sch.id. Tertarik mencobannya? Silakan ikuti Cara Mengubah Localhost Menjadi Nama Domain dibawah ini:

- Cari C:/windows/system32/drivers/etc

- Buka file host dengan notepad

- Akan ada tampilan alamat ip:

#127.0.0.1 localhost

- Di bawah alamat ip tersebut buat:

127.0.0.1 (misal: situssaya.com)

- Jika sudah dibuat, lalu save

- Masuk ke xampp anda, C:/xampp/apache/conf

- Buka file httpd.conf dengan notepad

- Cari tulisan DocumentRoot "C:/xampp/htdocs/" biasannya ada dibawah tulisan # symbolic links and aliases may be used to point to other locations.

- Jika sudah menemukan "C:/xampp/htdocs/" ganti dengan "C:/xampp/htdocs/nama file root anda"

- Restart xampp anda

- Coba masukkan nama domain anda pada address bar browser

- Selesai

Jika anda sudah berhasil mengikuti langkah diatas, agar anda bisa masuk ke administrator joomla, cara yang anda gunakan adalah tulis nama domain anda/administrator.

Kamis, 12 Januari 2012

Tips Blog Tutorial Membuat Website Professional

Tips Blog Tutorial Membuat Website Professional- Untuk membuat website professional tidaklah sesulit yang anda bayangkan, ada cara mudah untuk membuat Website Professional, salah satunnya adalah dengan cara CMS atau yang sering disebut dengan Content Management System. dengan Menggunakan Content Management System, anda tidak perlu lagi mempelajari PHP, MYSQL, CSS, HTML, dll, anda cukup mempelajari dasar-dasarnnya saja.

Bagi yang bertanya apa yang dimaksud dengan Content Managemnent Sytem, Content Management System adalah perangkat lunak yang memungkinkan seseorang untuk menambahakan, memanipulasi, isi dari suatu Web. Sebelum anda mengikuti Tutorial Membuat Website Professional ini ada baiknnya anda menyiapkan tool berikut ini:
  • CMS Joomla
  • Web Server Xampp
Untuk Menginstalasi Xampp dan CMS Joomla, silakan ikuti langkah-langkah dibawah ini:

Klik Disini
-Install xampp.

-Pada tampilan command prompt "Should I add shortcuts to the startmenu/desktop?" ketik y.

-selanjutnnya akan muncul "Should I proceed?" ketik y.

-Akan ada pertanyaan "Should I make a portable XAMPP without drive letters" ketik n.

-Press / enter. -Press to continue / enter. 

-Akan ada 7 pilihan, pilih yang no.1 "start XAMPP Control Panel. 

-Selanjutnnya tampil XAMPP Control Panel Application, abaikan saja dahulu (minimaize). 

-Pada command prompt ketik x untuk keluar atau exit. 

-Buka kembali XAMPP Control Panel Application, akan ada pilihan Apache dan MySql, start kedua pilihan tersebut hingga muncul tulisan "Running".

-Kemudian buka Mozilla Firefox anda, pada address bar ketik localhost, jika sudah diketik, tekan enter. 

-Kita akan dibawa ke alamat http://localhost/xampp/splash.php pilih bahasa yang akan digunakan (rekomendasi=English).

-Selanjutnnya anda akan berada pada alamat http://localhost/xampp/ disini anda dapat melihat menu Tools pada bagian kiri, pada menu tools tersebut pilih phpMyAdmin. 

-Sekarang anda berada pada alamat phpmyadmin (http://localhost/phpmyadmin/) ketikkan nama database anda pada form Create new database (nama database bebas) jika sudah klik Create. 

-Jika sukses akan muncul tampilan Database (nama database anda) has been created. 

-Untuk mengecek sukses atau tidaknnya membuat database, pilih gambar home (rumah) pada pojok kiri atas, selanjutnnya pilih menu Databases. Jika nama database anda sudah ada pada daftar berarti anda sukses membuat database, jika belum ada pada daftar maka anda gagal membuat database. 

-Selanjutnnya minimaize mozilla dan cari dimana anda menyimpan CMS Joomla anda, pada tutorial ini akan memakai CMS joomla.

-Copy file tersebut ke c:/xampp/htdocs sebelum dicopy, didalam folder htdocs, buat folder baru dengan nama bebas, contoh: joomla.

-Jika sudah paste file tersebut pada folder yang baru dibuat tadi, jika formatnya winrar, extrack terlebih dahulu pada folder yang baru dibuat tersebut. 

-Kembali ke Mozilla, buka tab baru, lalu pada address bar ketik localhost/joomla (joomla disini adalah nama folder yang baru dibuat tadi). 

-Akan muncul tampilan Chose language, Pre-Installation Check, License (pilih next saja semua, tombol next ada pada pojok kanan atas). 

-Pada jendela Database Configuration, masukkan Host Name: localhost, Username: root, Database Name: nama database yang anda buat tadi (biarkan yang lainnya default, dan jangan diisikan password) jika sudah klik next.

-Pada jendela FTP Configuration klik next. 

-Kemudian pada jendela Main Configuration isikan semua form sesuai keinginan anda, jika sudah klik install sample data (jika berhasil akan muncul tulisan " Sample Data Installed Successfully") selanjutnnya pilih next.

-Pada jendela Finish pilih Remove installation folder. 

-Kemudian jika anda ingin login untuk mengedit web database anda, anda harus login terlebih dahulu dengan cara klik new tab pada browser anda, pada address bar ketik localhost/joomla/administrator (joomla=nama file yang baru anda buat tadi). 

-Kemudian isikan username dan password yang anda buat tadi, jika sudah klik login.

-Selanjutnnya anda bisa mengedit isi CMS Joomla anda.

Jika anda sudah menginsntall CMS Joomla dan Xampp selanjutnnya, untuk dapat membuat web lebih professional anda dapat mengikuti tutorial mengedit CMS Joomla. Karena langkahnnya lumayan panjang, jadi silakan download video tutorialnnya dibawah ini:
    Nantinnya dalam video tutorial diatas anda akan diajarkan bagaimana cara membuat website sendiri, cara membuat website dengan joomla, mengubah web template dan masih banyak lagi Tutorial Mengenai membuat Website yang anda dapatkan secara gratis.


      Selasa, 29 November 2011

      Tips Blog Kesalahan Fatal SEO yang Harus Dihindari

      Tips Blog Kesalahan Fatal SEO yang Harus Dihindari

      6 Kesalahan Fatal SEO yang Harus Dihindari - Banyak trik SEO yang diajarkan di dunia internet, yang diajarkan oleh WEBSITE SEO. Tapi tidak sedikit juga yang melakukan kesalahan fatal saat mengimplementasikan SEO (Search Engine Optimization. Akhirnya, pekerjaan SEO mereka sia-sia bahkan tidak jarang malah melanggar aturan.

      Berikut beberapa hal yang harus dihindari saat menerapkan SEO untuk situs web atau blog:
        • KEYWORD YANG SALAH TARGET
        Ini adalah kesalahan SEO terbanyak, dan bahkan dialami oleh perusahaan-perusahaan besar, Kesalahan ini diakibatkan salah persepsi si pemilik website terhadap "kata kunci" apa yang kira-kira dicari oleh pengguna SEARCH ENGINE. Padahal pengguna SEARCH ENGINE tidak pernah melakukan pencarian dengan kata kunci tersebut. Untuk menghindari hal ini anda bisa memanfaatkan beberapa tool gratis untuk membuat acuan keyword apa yang kira-kira cocok untuk blog atau situs anda.
        • TERLALU MEMIKIRKAN META TAG
        SEO bukan melulu masalah mengoptimalkan meta tag dalam sebuah website. Bahkan, algoritma dari crawler dan robot SEARCH ENGINE terbaru sudah sama sekali tidak melihat meta tag sebagai acuan utama. Sekarang coba perkaya konten, karena itu lebih menarik bagi para robot search engine untuk melakukan indeks situs web.
        •  MENGGUNAKAN SITUS BLOG GRATISAN
        Jika anda salah satu kategori ini, mulai sekarang cobalah memulai untuk berlangganan hosting swadaya. Ini penting karena blog gratisan sangat terbatas pada fitur optimasi SEO. Dengan punya hosting dan domain sendiri, situs atau blog kamu akan lebih terpandang. Apalagi kalau anda serius mengembangkan blog serta kamu punya konten unik dan menarik. Jangan sampai pembajak konten kamu malahan punya rangking yang lebih tinggi karena dia mampu membayar hosting non gratisan.
        • SPAMMING BACKLINK
        Banyak pemilik situs yang mau situsnya dikenal dengan melakukan spam di situs lain, forum, atau sejenisnya demi mengumpulkan backlink. Hati-hati, jika terlampau banyak spam backlinks apalagi yang menggunakan FREE BACKLINKS. Jika anda banyak menaruh backlink di blog/situs lain, maka bukan tidak mungkin situs kamu akan di banned. Yang terpenting bukan jumlah backlink tapi seberapa berkualitas backlink itu kamu kumpulkan
        • PUNYA GAMBAR TAPI TANPA KETERANGAN
         Pemilik blog sering mengandalkan gambar miliknya untuk mengoptimalkan SEO. Tapi, hal ini bisa sama sekali tidak berpengaruh kalau gambar yang anda pakai tidak diberi keterangan. Jadi blog anda yang mempunyai gambar berilah keterangan pada gambar tersebut, contohnya apabila anda mempunyai GAMBAR MOTOR berilah keterangan motor xxx, motor tercepat, dll. Contoh lainnya jika memiliki GAMBAR HANTU berilah keterangan hantu pocong, hantu seksi, dll. Ingat setiap komponen keterangan yang masuk dalam kode dari sebuah situs web bisa menjadi rujukan search engine dalam membuat hasil. Apalagi situs pencari seperti Google punya fitur khusus untuk melakukan pencarian gambar.
        •  URL TANPA KEYWORD
        Seberapa sering keyword anda muncul dalam URL blog atau situs kamu? Jika jarang berarti anda masih salah dalam menerapkan SEO. Idealnya disetiap URL yang kamu publikasikan setidaknya terdapat satu keyword penting (MOST POPULAR KEYWORDS) yang kira-kira bakal mengarahkan pengguna search engine ke konten atau website. Mesin pencari besar macam Google, Yahoo, dan MSN menjadikan URL ini acuan utama mereka saat mencari konten. Jadi pintar-pintarlah anda dalam menemukan kata kunci (FIND KEYWORD).


        Selasa, 08 November 2011

        Tips Blog Pagerank dari Google

        Tips Blog Pagerank dari Google - akhirnya mendapatkan PAGERANK dari Google. Jika teman-teman ada yang belum tau apa itu pagerank. PAGERANK adalah sebuah algoritma dari Google yang berfungsi menentukan situs web mana yang lebih populer.

        Sebenarnnya saya lebih mencari visitor dengan cara SEO, tetapi yang saya dapat duluan PR 3. Lumayan PR 3 untuk blogger newbie seperti saya, apalagi saya sudah 3 hari tidak membuka blog ini.


        Tidak lupa saya ucapkan terima kasih kepada Tuhan YME, Google yang telah memberikan pagerank 3, orang yang memberikan backlink dan mau komentar untuk blog ini, dan semua orang yang telah mendukung blog ini.

        Semoga dengan adanya PR ini BLOG akan lebih baik dengan adannya konten-konten atau postingan yang diberikan spesial untuk anda semua.

        Jumat, 22 Juli 2011

        Tips blog Cara Membuat Link pada Blog

        Tips blog Cara Membuat Link pada Blog - Semoga semua teman-teman tau apa itu link. Cara membuat Link yang saya maksud ini bisa teman-teman liat contohnnya disini. Jika teman-teman sudah lihat coba perhatikan disebelah kanan tulisan download pada postingan tersebut, jika tulisan itu diklik akan muncul halaman download. Itulah yang saya maksud link.

        Cara Membuat Link Pada Blog:

        1. Kode HTML dasar untuk link: <a href="url">Anchor Text</a>
        Pada tulisan url,ganti dengan alamat web yang diinginkan, kemudian pada tulisan Anchor Text ganti dengan judul link tersebut.
        Contoh: <a href="http://kursuskomputerbogor.blogspot.com/">kursus</a>, dari contoh tersebut akan menjadi
        2. Membuat Link terbuka di jendela baru: <a href="url" target="_blank">Anchor Text</a>
        Pada Kode diatas untuk membuat Link terbuka di jendela baru, hanya menambahkan kode yaitu bisa dilihat dari kode diatas ada penambahan kode target="_blank"
        Contoh: <a href="http://kursuskomputerbogor.blogspot.com/" target="_blank">kursus</a>
        Dari kode diatas akan menjadi kursus

        Itulah 2 cara membuat link pada blog, silakan dipilih salah satu. Semoga bermanfaat.

        Rabu, 20 Juli 2011

        Tips Blog Cara Membuat Open Link New Tab pada Blog

        Tips Blog Cara Membuat Open Link New Tab pada Blog-Membuat OPEN LINK NEW TAB maksudnnya apabila kita mengklik link pada suatu blog maka kita akan membuka link yang kita klik itu ke tab baru pada browser anda. Cara membuatnnya, perhatikan cara dibawah ini!

        Cara Membuat Open Link New Tab pada Blog:

        1. Login ke BLOGGER
        2. Masuk ke menu RANCANGAN, jika sudah pilih EDIT HTML
        3. Cari kode <head>
        4. Copy kode dibawah ini


        Spoiler:


        <base target='_blank'/>




        5. Jika sudah dicopy, paste dibawah kode <head>
        6. Simpan Template
        7. Selesai, semoga bermanfaat.

        Tips Blog Cara Mengganti Icon Address Bar

        Tips Blog Cara Mengganti Icon Address Bar Anda pernah lihat gambar seperti ini  pada blog anda, atau supaya lebih jelas perhatikan gambar dibawah ini










        Ya, itulah yang dinamakan ICON ADDRESS BAR, rasannya  tidak perlu panjang lebar mengenai ICON ADDRESS BAR. Langsung saja disimak cara membuatnnya.

        Cara mengganti ICON ADDRESS BAR:

        1. Login ke BLOGGER
        2. Pilih RANCANGAN kemudian pilih EDIT HTML, masukkan script dibawah ini sebelum kode </head>


        Spoiler:


        <link href='icon' rel='SHORTCUT ICON'/>




        3. Ganti tulisan 'icon' (tanda kutip biarkan saja, ganti tulisan iconnya saja) dengan kode icon yang anda inginkan, kode itu bisa dicari di photobucket.com, imageshack.us, dll
        4. Simpan template
        5. Selesai

        Perlu diingat untuk mengganti icon bar sebaiknnya gambar dengan format gif, jpg, ico, format lainnya sih juga boleh, tapi saya rekomendasikan yang saya sebutkan tadi. Saya rekomendasikan juga kalau ukuran filennya 24x42 pixel sampai 32x32 pixel, sebenarnnya bebas memilih ukuran, tapi jika ingin filennya kecil dan proses membuka website anda cepat maka pilihlah ukuran tersebut.

        Tips Blog Cara Memasang Game pada Blog











        Tips Blog Cara Memasang Game pada Blog Mau game seperti yang di atas ada di blog kamu? Caranya mudah, langsung saja ikuti langkah dibawah ini!

        Cara Memasang Game Pada Blog:

        1. Cari game yang kamu suka di arcade.picgames.com
        2. Jika sudah copy kode yang ada di bagian bawah, paste di gadget - HTML Java script kamu, boleh juga di postingan kamu
        3. Save.

        Semoga Bermanfaat.

        Tips Blog Cara Membuat Spoiler pada Postingan Blogger

        Tips Blog Cara Membuat Spoiler pada Postingan Blogger - Teman-teman, kali ini saya akan share cara membuat spoiler. Perhatikan baik-baik, agar tidak terjadi kesalahan.








        Cara membuat SPOILER pada postingan Blogger:

        1. Login dulu ke BLOGGER
        2. Cari pilihan ENTRI BARU
        3. Jika ingin membuat spoilernnya copy kode di bawah ini:

        Spoiler:


        <div style="margin: 5px 20px 20px;">
        <div class="smallfont" style="margin-bottom: 2px;"><b>Spoiler</b>: <input value="Open" style="margin: 0px; padding: 0px; width: 55px; font-size: 11px;" onclick="if (this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display != &#39;&#39;) { this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;&#39;; this.innerText = &#39;&#39;; this.value = &#39;Close&#39;; } else { this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;none&#39;; this.innerText = &#39;&#39;; this.value = &#39;Open&#39;; }" type="button" />
        </div>
        <div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
        <div style="display: none;">


        "Tulis teks anda disini"

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






        4. Semoga berhasil

        Selasa, 19 Juli 2011

        Tips Blog Cara Membuat Dropdown Label

        Tips Blog Cara Membuat Dropdown Label Pernah melihat DROPDOWN LABEL? Jika tidak pernah disini Dexamaker akan mengajarkan cara membuta DROPDOWN LABEL. Jika teman-teman ingin membuat DROPDOWN LABEL, pastikan ELEMEN LABEL sudah terpasang pada blog.












        CARA MEMBUAT DROPDOWN LABEL:

        1. Login dulu ke BLOGGER
        2. Pilih RANCANGAN, kemudian pilih EDIT HTML
        3. Beri tanda cek pada EXPAND TEMPLATE WIDGET, kemudian cari kode ini (<data:label.count/>)
        Bisa teman-teman lihat kode yang teman-teman cari dibawah ini:

        Spoiler:


        <ul>
        <b:loop values='data:labels' var='label'>
        <li>
        <b:if cond='data:blog.url == data:label.url'>
        <data:label.name/>
        <b:else/>
        <a expr:href='data:label.url'><data:label.name/></a>
        </b:if>
        (<data:label.count/>)
        </li>
        </b:loop>
        </ul>





        4. Jika sudah ketemu ganti seluruh kode diatas dengan kode dibawah ini:

        Spoiler:

        <br />
        <select onchange='location=this.options[this.selectedIndex].value;'>
        <option>Select a label</option>
        <b:loop values='data:labels' var='label'>
        <option expr:value='data:label.url'><data:label.name/>
        (<data:label.count/>)
        </option>
        </b:loop>
        </select>






        5. Pilih SIMPAN TEMPLATE
        6. Selesai

        Tips Blog Cara Membuat Artikel Terkait

        Tips Blog Cara Membuat Artikel Terkait-Apakah kalian mengerti arti dari judul diatas Cara Membuat Artikel Terkait? Artikel terkait pada suatu Blogger digunakan untuk memunculkan judul postingan yang terkait dengan label yang anda baca. Begitulah sedikit penjelasan saya mengenai artikel terkait, sekarang akan saya jelaskan cara membuatnnya.

        1. Login ke BLOGGER
        2. Pilih RANCANGAN, kemudian pilih EDIT HTML
        3. Cari kode <data:post.body>, untuk memudahkan pencarian tekan Ctrl+F
        4. Copy kode dibawah ini kemudian paste setelah kode di atas


        Spoiler:

        <b:if cond='data:blog.pageType == &quot;item&quot;'>
        <br/>
        <br/>
        <H2>Artikel Terkait:</H2>
        <div class='rbbox'>
        <div style='margin:0; padding:10px;height:200px;overflow:auto;border:1px solid #ccc;'>
        <div id='albri'/>
        <script type='text/javascript'>
        var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
        var maxNumberOfPostsPerLabel = 4;
        var maxNumberOfLabels = 10;
        maxNumberOfPostsPerLabel = 10;
        maxNumberOfLabels = 3;
        function listEntries10(json) {
        var ul = document.createElement(&#39;ul&#39;);
        var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?
        json.feed.entry.length : maxNumberOfPostsPerLabel;
        for (var i = 0; i &lt; maxPosts; i++) {
        var entry = json.feed.entry[i];
        var alturl;
        for (var k = 0; k &lt; entry.link.length; k++) {
        if (entry.link[k].rel == &#39;alternate&#39;) {
        alturl = entry.link[k].href;
        break;
        }
        }
        var li = document.createElement(&#39;li&#39;);
        var a = document.createElement(&#39;a&#39;);
        a.href = alturl;
        if(a.href!=location.href) {
        var txt = document.createTextNode(entry.title.$t);
        a.appendChild(txt);
        li.appendChild(a);
        ul.appendChild(li);
        }
        }
        for (var l = 0; l &lt; json.feed.link.length; l++) {
        if (json.feed.link[l].rel == &#39;alternate&#39;) {
        var raw = json.feed.link[l].href;
        var label = raw.substr(homeUrl3.length+13);
        var k;
        for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);
        var txt = document.createTextNode(label);
        var h = document.createElement(&#39;b&#39;);
        h.appendChild(txt);
        var div1 = document.createElement(&#39;div&#39;);
        div1.appendChild(h);
        div1.appendChild(ul);
        document.getElementById(&#39;albri&#39;).appendChild(div1);
        }
        }
        }
        function search10(query, label) {
        var script = document.createElement(&#39;script&#39;);
        script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;
        + label +
        &#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
        script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
        document.documentElement.firstChild.appendChild(script);
        }
        var labelArray = new Array();
        var numLabel = 0;
        <b:loop values='data:posts' var='post'>
        <b:loop values='data:post.labels' var='label'>
        textLabel = &quot;<data:label.name/>&quot;;
        var test = 0;
        for (var i = 0; i &lt; labelArray.length; i++)
        if (labelArray[i] == textLabel) test = 1;
        if (test == 0) {
        labelArray.push(textLabel);
        var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?
        labelArray.length : maxNumberOfLabels;
        if (numLabel &lt; maxLabels) {
        search10(homeUrl3, textLabel);
        numLabel++;
        }
        }
        </b:loop>
        </b:loop>
        </script>
        </div>
        <script type="text/javascript">RelPost();</script>
        </div>
        </b:if>





        5. Sampai disitu langkahnya belum selesai, lanjutkan cari kode ]]>
        6. Copy kode dibawah ini kemudian paste sebelum kode di atas

        Spoiler:

        .rbbox{border: 1px solid rgb(192, 192, 192);padding: 5px;
        background-color: #f0f0f0;-moz-border-radius:5px; margin:5px;}
        .rbbox:hover{background-color: rgb(255, 255, 255);}





        7. Pilih SIMPAN TEMPLATE
        8. Selesai.

        Tips Blog Cara Menyembunyikan Navbar

        Tips Blog Cara Menyembunyikan Navbar Sekarang banyak blog yang menghilangkan NAVBAR pada blogger karena berbagai alasan, seperti agar tampilannya lebih bagus, mengganggu pengelihatan pengunjung, dll. Disini saya bukan share cara menghilangkan NAVBAR, tetapi cara menyembunyikan NAVBAR tersebut.











        Berikut carannya:

        1. Login ke BLOGGER
        2. Pilih RANCANGAN kemudian pilih EDIT HTML
        3. Cari kode body {
        4. Masukkan kode di bawah ini di atas kode kode body { tadi

        Spoiler:

        #navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
        #navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}





        6. Pilih SIMPAN TEMPLATE
        7. Selesai

        Tips Blog Cara Membuat Widget Translator

        Tips Blog Cara Membuat Widget Translator Kali ini  akan share cara memasang widget transaltor pada blogger. Tujuan membuat widget ini adalah untuk menerjemahkan bahasa pada postingan kita ke bahasa lain. Langsung saja disimak cara membuat widget translator:












        1. Login ke BLOGGER
        2. Klik RANCANGAN kemudian pilih ELEMEN LAMAN
        3. Jika sudah klik ADD GADGET
        4. Masukkan KODE dibawah ini:

        Spoiler:


        <style>
        .google_translate img {
        filter:alpha(opacity=100);
        -moz-opacity: 1.0;
        opacity: 1.0;
        border:0;
        }
        .google_translate:hover img {
        filter:alpha(opacity=30);
        -moz-opacity: 0.30;
        opacity: 0.30;
        border:0;
        }
        .google_translatextra:hover img {
        filter:alpha(opacity=0.30);
        -moz-opacity: 0.30;
        opacity: 0.30;
        border:0;
        }
        </style>
        <div>
        <a class="google_translate" href="#" target="_blank" rel="nofollow" title="English" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cen&hl=en'); return false;"><img alt="English" border="0" align="absbottom" title="English" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbVoGJAqsi7-GqHssyE4-_frnoMA-UHGsV5R82NJhYurC46EBB1nVULpzOjQjyQsuUkVGZ1Puep8f4SullTzBm5XnghX8Rbmeq_1bt3zK8mz_crMo3vqv8dUg6iHNqRkelewXPrlkg5yk/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24" /></a>
        <a class="google_translate" href="#" target="_blank" rel="nofollow" title="French" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cfr&hl=en'); return false;"><img alt="French" border="0" align="absbottom" title="French" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgk3FrEIPreNYzhb37EvM6Ojoqo77LeLoX_Ggi3Z2jo9p55gFp9h_5oAmCcmUTwTldKc4BuPtPAJh1jeW4l3FEHClNhbzJ4LyAi0RXECnTo9hP7KPn1Xxqp97A4IyN9TPXZv-AwXz8vzCY/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24" /></a>
        <a class="google_translate" href="#" target="_blank" rel="nofollow" title="German" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cde&hl=en'); return false;"><img alt="German" border="0" align="absbottom" title="German" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXm8D4bKmq9A9h4qkDw5XZ5d5nkSBpv5flvf5BXfewbqJwt5acv08mHfajj4pEa9euZOanAoMCKAOi5rYcUZPug6D2IL6ETTRnC1pT07b2wrMoCS7ONnx1JWXBeIxhpANOpuRtLHebrl6Z/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24" /></a>
        <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Spain" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Ces&hl=en'); return false;"><img alt="Spain" border="0" align="absbottom" title="Spain" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKxz0KcsP02mBRihCMp1-WOqEhK2RAj4-rnbXW80KkrINI9S6IPmL5mIk2XH9BxYfIAcV0cIyypKoNT45z3s0Vd2iZG2rSGZ16ZHkE-bHGj2yC66slJ40l-_HAND-AzSeZZ-UIkalCpnlQ/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24" /></a>
        <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Italian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cit&hl=en'); return false;"><img alt="Italian" border="0" align="absbottom" title="Italian" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjb5wYhiMA5f3pHKU8SRhEuEQYDXXrdhR3jSDA2xnnve5Wl9SwtGkrZWIG7bIAQdXHpn5VGiaDHX7PGtNwJBieS0K6k8ln04yKqUf7xDAmAjg6FamYQLlTybT-HDdyuS0T92N0fQnViyME/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24" /></a>
        <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Russian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cru&hl=en'); return false;"><img alt="Russian" border="0" align="absbottom" title="Russian" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZ15wijFwc4C0T6rp73-wawoP4azhhZoRGuv6WJd2YfT9GmTW3dMNMMaztUQCoYxqfZdziqiMCiSQQl1KbpWWhTB37ZjT3g3jYRoOQ-IrQgSkhwOaRyw5wjmyvLv93hn8kst12mC1I57w/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24" /></a>
        <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Portuguese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cpt&hl=en'); return false;"><img alt="Portuguese" border="0" align="absbottom" title="Portuguese" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_8LxGFj46U4ymYyAc7bYSGR1lHWoxbjYEQCKjBuis2gE5bQ-yxK7ebXRozMFqSwJ_hjLv7p30yQU4vaRZoQoBnSOc9boQsgLjNpn29uCG83v9dlx5qVJ-Xy_Q0_Dk5Xo8GJXXtXc4Ihw/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24" /></a>
        <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Japanese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cja&hl=en'); return false;"><img alt="Japanese" border="0" align="absbottom" title="Japanese" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8-p_tJP_izWjtAqSWFsNa5tgAS55j1Th82rqHHeVlKZELe2Jw8elL-_4Qgdl_D3ZN90obD44VovjcigUTcqu0Rq-TrRHdEXf6m3_WR3rXyvSt9yalOnrXh7Vb8qM9xfSdpq9PGAdpHnhJ/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24" /></a>
        <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Korean" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cko&hl=en'); return false;"><img alt="Korean" border="0" align="absbottom" title="Korean" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjC315m7A8HrUm4aXxhX1AMkmwiv6jNhGmOMXmow3-5plp17yHNbmgb0eRF-cOiiyYVDjrtP_hyXHXxhXnMvhby4gzyivxjdvD17P1S9zu2ZqKCjdOaUeJ0kf93ZUfP5z3XBAnc9bgJeW8/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24" /></a>
        <a class="google_translate" href="#" target="_blank" rel="nofollow" title="Chinese Simplified" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Czh-CN&hl=en'); return false;"><img alt="Chinese Simplified" border="0" align="absbottom" title="Chinese Simplified" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjE7O3gxHiT2gzl_pVB16XJUPh8pP7biI_tGsMUgUCPpjxCn53n62xGKi5Mm-OpElgTjWMZ8vJqBcHUFH5xnoDZBB8MDZyu8iUSGbyCisLqxAsihcFYU7yUvBEarHcrDbYpTWldXrNSHYA/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24" /></a>
        </div>




        5. SIMPAN

        Itu tadi cara membuat WIDGET TRANSLATOR, semoga bermanfaat.