Tampilkan postingan dengan label CSS. Tampilkan semua postingan
Tampilkan postingan dengan label CSS. Tampilkan semua postingan

Rabu, 12 Januari 2011

Menghilangkan LAST_UPDATED2 dan JPAGE_CURRENT_OF_TOTAL di Joomla

Selamat sore semua! Gimana kabarnya? Saya berharap semuanya sehat selalu, Amiiin. Posting kedua di bulan Januari 2011 tentang Menghilangkan LAST_UPDATED2 dan JPAGE_CURRENT_OF_TOTAL di Joomla. Akhir-akhir ini saya lagi mood di CMS, di joomla dan wordpress. Tapi masih lebih mood pakai joomla. Hari ini, saya sedang coba-coba membuat situs dengan joomla. Banyak sekali ilmu yang saya dapat dalam eksperimen ini, yaitu membuat related post di joomla dan Menghilangkan LAST_UPDATED2 dan JPAGE_CURRENT_OF_TOTAL di Joomla. Mungkin bisa lebih banyak lagi kalau terus belajar dan otak-atik joomla. OK, to de poin ja ya. Gimana sih caranya Menghilangkan LAST_UPDATED2 dan JPAGE_CURRENT_OF_TOTAL di Joomla setelah ganti bahasa ke Indonesia? (Masalah ini mucul setelah saya menggunakan bahasa Indonesia untuk situs joomla saya).

Berikut caranya :
1. Masuk ke file manager situs Anda
2. Masuk ke direktori /language/in-ID/in-ID.ini
3. Tambahkan baris berikut di dalam file in-ID.ini
JPAGE_CURRENT_OF_TOTAL=Halaman %s dari %s
LAST_UPDATED2=Terakhir diperbarui pada %s
4. Selesai, itu saja. Lihat perubahannya. Semoga bermanfaat.

Selasa, 28 Desember 2010

Membuat Contact Form di Blogger dengan 123ContactForm

Membuat Contact Form di Blogger dengan 123ContactForm. Jalan-jalan di google nemu penyedia layanan contact form gratis yang powerful, yang menurut saya bisa menjadi alternatif form google docs. Pengalaman memasang contact form ini saya alami ketiga ganti template blog ini, dimana halaman kontak produksi google form tidak tampil dengan baik di template baru ini. Tampil carut marut alias mawut. Mungkin 123contactform ini bisa menjadi solusi bagi teman-teman yang mengalami pengalaman saya ini. Untuk langkah-langkahnya tidak saya jelaskan di sini, karena sangat mudah. Tinggal daftar di 123contactform, ikuti langkah-langkah yang dituturkan di website itu, kemudian pasang scriptnya di blog Anda. Selesai, selamat mencoba!

Kamis, 25 November 2010

Memasang Iklan di Setiap Bawah Postingan Blogger

Memasang Iklan di Setiap Bawah Postingan Blogger. "Penempatan iklan merupakan salah satu kesuksesan blog advertising," kata para master. Memang sih penempatan iklan berpengaruh dalam penghasilan on blog advertising. Kadangkala penempatan iklan yang tidak sesuai mengakibatkan pengunjung tidak mau ngeklik iklan kita. Akibatnya pula, kita tidak mendapatkan recehan dari iklan yang kita pasang. Itu yang saya alami, dan sampai sekarang saya hanya bisa memasang iklan dan belum menikmati sepeserpun dari iklan yang saya pasang. Akan tetapi saya tidak menyerah, biarlah. Semoga saja ada yang mau ngeklik, hehehe. Ok, kali ini saya akan membahas tentang pemasangan Iklan di Setiap Bawah Postingan Blogger. Awal mulanya saya memasang iklan secara manual saat memposting artikel di blog ini.

Kemudian, seiring waktu berjalan saya mendapatkan cara otomatis Memasang Iklan di Setiap Bawah Postingan Blogger. Terinspirasi dari pemasangan related post blogger. Ok, berikut caranya :

1. Log ini ke akun blogger Anda (ya iyalah)
2. Masuk ke desaign - edit HTML, centangi Expand Template Widget (wajib)
3. Cari kode <data:post.body/> 
4. Letakkan kode/script iklan Anda di bawah kode tersebut
5. Simpan template, selesai.
Singkat bukan caranya? mari kita coba sama-sama. Semoga berhasil.

Menambahkan Author Box di Bawah Postingan Blogger

Author Box. Sudah tahu pastinya. Ya, author box adalah kotak yang berisikan sekilas informasi dari author/penulis yang biasanya disematkan di bawah postingan. Untuk kali ini saya akan berbagi pengalaman saya kemarin tentang Menambahkan Author Box di Bawah Postingan Blogger. Ok, go to TKP. Berikut ulasannya :

1. Masuk ke menu desaign - edit HTML dan ceklist pada (wajib), tentunya log in di blogger dulu.
2. Cari kode ]]></b:skin>
3. Copy kode berikut dan letakkan di atas kode ]]></b:skin>


.author-box {
background: #f0f0f0;
margin: 20px 0 40px 0;
padding: 10px;
overflow: auto;
color:#888;
font-family:verdana, sans-serif;
}
.author-box p {
margin: 0;
padding: 0;
}
.author-box a{
color:#666;
}
.author-box img {
background: #FFFFFF;
float: left;
margin: 0 10px 0 0;
padding: 4px;
}

4. Cari kode <div class='post-footer-line post-footer-line-1'>
5. Letakkan kode berikut di bawah kode <div class='post-footer-line post-footer-line-1'> 

<b:if cond='data:blog.pageType == &quot;item&quot;'>
    <div class='author-box'>
    <p><img alt='avatar' class='avatar avatar-70 photo' height='70' src='URL avatar/foto Anda' width='70'/><b>About Author</b><br/>
   Sekilas tentang diri Anda<br/></p>
    </div>
    </b:if>
6. Ganti kode berwarna merah sesuai data Anda.

Rabu, 24 November 2010

Membuat Tombol Read More di Template Baru Blogger

Ok, sedikit info blogging hari ini dari surfing di internet. Kali ini saya akan membahas cara bikin tombol read more berupa gambar di template baru blogger. Sekarang ini blogger menghadirkan template baru yang lumayan lah dengan editor terbaru pula yang memudahkan kita untuk membuat read more tanpa harus menggunakan script css yang rumit. Untuk membuat tombol read more seperti di blog ini sangatlah mudah. Yang kita butuhkan hanya gambar/tombol read more saja. Silahkan bikin variasi kesukaan Anda, kemudian upload gambar Anda. Ok, langsung saja berikut cara singkat bikin tombol read more di blogger.


1. Upload dulu gambar/tombol Anda,
2. Masuk ke menu Rancangan - Edit HTML, ceklist '' (wajib)
3. Temukan kode berikut ini :

<b:if cond='data:post.hasJumpLink'>
      <p class='more'><a expr:href='data:post.url + &quot;#more&quot;'>Read more...</a></p>
    </b:if>
4. Ganti tulisan Read more... dengan kode berikut :

  <img border='0' src='ganti dengan link gambar Anda'/>
5. Selesai, simpan template Anda. Lihat efeknya.

NB: hanya untuk template baru blogger.

Sabtu, 16 Oktober 2010

Instalasi Wordpress Manual di 000webhost

Sukses daftar domain gratis .co.cc dan memadukannya dengan 000webhost. Itu hal yang sangat menggembirakan bagi orang awam seperti saya. Langsung deh log in ke 000webhost. Cari-cari fasilitas autoinstaller, wuih ada. Seneng banget. Ups, ternyata autoinstaller hanya untuk member yang sudah upgrade. Bingung deh gimana nih mau install wordpress? Kemudian saya tertuju ke situs wordpress.org, disitu ada cara manual install wordpress. Baca tutorial belum selesai, langsung deh saya upload ke folder public_html melalui online file manager yang ada di cpanel. Setelah selesai upload, langsung ngetik klikblogger.co.cc (ini web eksperimen saya) ups, muncul pesan error yang rumit gitu deh. Akhirnya saya coba upload lagi, nggak bisa lagi. Sampai 3 hari belum ketemu solusinya. Kemudian saya cari solusi tersebut di google, masuk deh di forum wordpress. Katanya itu masalah FTP kita. Aduh bingung-bingung-bingung. Orang awam kaya saya ini apa mudeng. Eit, jangan salah akhirnya saya berhasil juga install wordpressnya. Lihat aja buktinya di sini. Berikut caranya:

1. Log in ke cpanel 000webhost, buat database mySQL untuk wordpress yang akan Anda install, catat nama database Anda, user name mySQL, password mySQL dan mySQLnya.


2. Catat informasi FTP Anda di menu View FTP Details


3. Upload file wordpressnya, jangan melalui online file manager. Saya sarankan upload via Filezilla, silahkan tulis di google dan download kalau belum punya, berikut caranya:
4. Jalankan program Filezilla yang sudah Anda install
5. Isikan FTP hostname, FTP username dan FTP passwordnya, jika terkoneksi akan muncul direktori situs Anda pada tab Situs remote di sebelah kanan. Lebih jelasnya lihat gambar di bawah ini.


6. Sebelum Anda upload rename wp-config-sample.php menjadi wp-config.php (untuk wordpress versi 3 ke atas, atasnya baru 3.01, hehe)
7. Edit file wp-config.php terlebih dahulu, berikut potongan script php yang harus diedit, ganti kode warna merah sesuai data mySQL Anda, Oh ya editnya bisa pakai dreamweaver.

// ** MySQL settings - You can get this info from your web host ** //
/** The name of the database for WordPress */
define('DB_NAME', 'nama database Anda');

/** MySQL database username */
define('DB_USER', 'username database Anda');

/** MySQL database password */
define('DB_PASSWORD', 'password database Anda');

/** MySQL hostname */
define('DB_HOST', 'mySQL hostname database Anda');

/** Database Charset to use in creating database tables. */
define('DB_CHARSET', 'utf8');
8. Selanjutnya tentukan mode transfer menjadi automatic/otomatis pada menu transfer pada program FileZilla 
9. Pastikan Anda berada dalam direktori htdocs yang ada dalam direkoti public_html di situs remote.
10. Selanjutnya upload wordpress Anda, seleksi seluruh isi file wordpress Anda pada tab Situs lokal di sebelah kiri, klik kanan upload. Tunggu kurang lebih 30 menit(mungkin bisa lebih cepat tergantung koneksi internet)
11. Setelah selesai upload, buka browser Anda, ketikkan alamat situs Anda.
12. Nah, jika tidak muncul pesan error, tampilannya sepreti di bawah ini:


13. Isikan judul website, password dan email admin, kemudian klik Install wordpress
14. Selesai, jika berhasil akan muncul tampilan seperti di bawah ini:

15. Instalasi telah selesai, selanjutnya silahkan log in di admin situs wordpress Anda untuk mengotak-atik konten website Anda.

Dengan demikian Anda telah berhasil mempunyai situs berCMS wordpress. Terima kasih, kalau ada kesalahan penulisan harap dicomment ya,,




Jumat, 08 Oktober 2010

Membuat Halaman Kontak di Blogger

Umur blog ini memang masih sangat muda sekali, karena saya baru nyemplung di dunia perbloggingan, hehehe. Oleh karena itu saya sering melakukan blogwalking untuk mencari inspirasi buat blog saya. Saya lihat-lihat blog itu dan mengamatinya kemudian berfikir gimana cara membuatnya biar bisa seperti blog yang saya lihat. OK, langsung saja ilmu ini saya dapat ketika blogwalking ke blognya Kang Umar Hasyim kakak kelas saya dulu, yang sudah eksis di dunia blogging. Anda bisa melihat blognya di sini.

Kemudian saya berfikir gimana cara membuatnya? Apakah menggunakan coding css yang rumit? Ternyata tidak, caranya cukup instan yang juga saya temukan di blog Kang Umar Hasyim. Berikut caranya :

1. Silahkan log in ke akun google Anda
2. Kemudian klik di sini untuk menuju halaman Google Docs, berikut screen shootnya:


3. Klik menu create new-->form, Anda akan tertuju ke halaman edit form :


4. Ketikkan judul form Anda di kotak untitled form, misal Contact Us
5. Ketikkan deskripsi judul form Anda
6. Selanjutnya tulis perntanyaan Anda di kotak Question Title
7. Tentukan jenis jawaban dari pertanyaan Anda di kotak Question Type, di situ Anda bisa memilih:
  • Text : untuk jawaban berupa teks singkat
  • Paragraph Text : untuk jawaban berupa teks paragraf
  • Multiple Choice : untuk jawaban berupa pilihan
  • Checkboxes : untuk jawaban berupa cheklist
  • Choose from a list : untuk jawaban berupa pilihan bernomor
  • Dan ada Scale dan Grid yang belum saya coba.
8. Centangi "Make this a required question" bila ingin menjadikan pertanyaan Anda wajib untuk dijawab.
9. Setelah selesai klik save
10. Untuk mendapatkan embed kode, klik menu more actions-->embed
11. Copy dan paste embed tersebut ke dalam halaman blogger atau postingan Anda.
12. Selesai, semoga membantu.

Sabtu, 02 Oktober 2010

Membuat Daftar Isi di Blogger

Ada sebuah widget yang dirancang khusus untuk membuat daftar isi di blogger. Seperti milik saya ini. Sebagai contoh Anda bisa melihat di menu daftar isi saya. Widget ini bukan buatan saya, tapi buatan Mas Abu Farhan  yang merupakan seorang Master Blogger. OK, langsung saja berikut langkah-langkah untuk menambahkan halaman daftar isi ke dalam blogger Anda


  • Copy kode html di bawah ini, yang saya dapat di sini :
<link rel="stylesheet" href="http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.css" type="text/css" media="screen"/>
<script style="text/javascript" src="http://scriptabufarhan.googlecode.com/svn/trunk/daftarisiv2.js"></script>
<script src="http://alamatmu.blogspot.com/feeds/posts/summary?max-results=9999&alt=json-in-script&callback=loadtoc">
</script>
  • Replace kode berwarna merah dengan alamat blog Anda.
  • Kemudian klik menu posting ---> edit laman ---> laman baru, lalu paste kode tersebut, tentunya dalam mode HTML ---> tayangkan laman.
  • Selesai, Anda bisa meletakkan widget ini di samping blog Anda, sebagai tab atau hanya linknya saja yang kemudian Anda letakkan pada menu Anda. Penempatan bisasesuai selera Anda.
    Untuk model daftar isi yang lain Anda bisa membaca tutorial ini.