Menampilkan Recent Komentar di Sidebar

Bagaimana caranya menampilkan recent komentar di halaman sidebar blog kita ?.. terutama  biar gampang melihatnya kalau tulisan kita ini ada yang ngasih sebuah komentar baru.

Untuk memasang Recent Comment tersebut, sebenarnya banyak sekali cara yang bisa di lakukan baik itu mengunakan Javascript atau mengunakan sebuah Feed.

Dan dalam tulisan ini, saya mengunakan dengan cara yang ke dua yaitu mengunakan sebuah feed, pertimbangannya karena sangat mudah untuk di pasang dan tidak memberatkan blog kita sewaktu ngeloding.

untuk itu yang perlu kita lakukan adalah.

1. Buka blog kita, dalam Tab Layout pilih -  Halaman elemen.

2. Klik Tulisan Tambahkan Sebuah Halaman Elemen.

3. Setelah terbuka  pilih Elemen FEED ( dan tekan tombol Tambahkan Ke Blog ).

4. Dalam Konfigurasi Feed isi kotak kosong dengan alamat url feed comment blog kita yaitu :

http://NamaBlogKamu.blogspot.com/feeds/comments/default

Kemudian klik tombol Lanjutkan

5. Setelah itu dalam windows yang terbuka atur settingan-nya.

Judul : Isi dengan nama yang kita inginkan.

Tampilkan : Menampilkan jumlah komentar yang masuk.

Tanggal Item : Tandai / cek untuk menampilkan tanggal komentar.

Sumber/Pengarang Item : Tandai untuk mengetahui siapa yang memberi komentar. 

6. Setelah beres klik Simpan Perubahan.

Menambah Latar Belakang Atau Bingkai

Secara default  recent comment yang di tampilkan oleh template bawaan blogger seperti gambar di bawah ini :

Dan kita bisa menambahkan list icon  latar belakang atau bingkai untuk mempercantik dan menonjolkan kotak komentar ini. seperti gambar.

Caranya yang mesti kita lakukan :

1. Dalam Tab layout pilih Edit Html

2. Kemudian dalam halaman/tulisan  kode Css masukan kode ini :

#sidebar #Feed1 ul li {
  background-color:#DEDEDF;
  border-bottom:1px solid #000;
  margin:0 0 0 0px;
  padding:5px;
  text-indent:0px;
}

Keterangan

#sidebar #Feed1 ul li: mendifinisikan proferti list feed. dan feednya tergantung dari jumlah yang telah kita pakai misalkan bisa #Feed1, atau #Feed2, dst.

background-color: mendifinisikan proferti warna latar belakang. bisa #DEDEDF ( abu-abu ) atau #B4D2F2 ( biru muda ) dll.

border-bottom: menambah border untuk bagian bawah saja.

Recent Komentar Dengan Javascript

Jika anda tertarik untuk memesang kotak komentar dengan bantuan javascript, anda bisa lihat di :

1. beautifulbeta.blogspot Recent Comments Widget ( Add Recent Comments  To Blog )

2. hackosphere.blogspot customizable-recent-comments-widget

 

Jika blog ini bermangfaat.Ikuti terus update informasinya. Silahkan Klik dan masukan emal anda untuk berlanganan Via Email Subscription atau klik Subscribe Via Rss Feed .
Makasih juga atas kunjungannya.

Technorati tags: Blogger Tutorial, Recent Komentar

Membuat Read More Di New Blogger

Jika kita rajin googwalking Banyak  versi script untuk membuat pemengalan artikel  atau yang lebih di kenal dengan istilah " Read More ". Salah satunya code script " read more " dari  blognya Ramani .

Bagaiamana cara menambahkan script " read more " ke dalam blog kita. ikutilah penjelasanya di bawah ini.

1. Buka Dashboard | Template | Edit HTML | kemudian tandai Expand Widget Templates.

Juga  untuk memudahkan mencari kode yang di inginkan dalam menu file - pilih Find in This Page

Setelah itu masukan kode yang akan kita cari dalam kotak pencarian  ini.

1.misalkan masukan tag </head> ini.

setelah ketemu sisipkan  kode di page ini  di atas tag </head> tersebut.

 

2.  Setelah itu cari kode di bawah ini.

<data:post.body/>

atua kode keseluruhannya seperti ini.

<div class='post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

Ganti kode di atas dengan kode di bawah ini.

<div class='post-body' expr:id='"post-" + data:post.id' >
<b:if cond='data:blog.pageType == "item"'>
<style>#fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>#fullpost{display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<a expr:href='data:post.url'>Read More......</a>
</span>
<script type='text/javascript'>
checkFull("post-" + "<data:post.id/>");
</script>
</b:if>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

Kita bisa saja merubah kata " Read More..." dengan "Baca selangkapnya...." dll.

 

3. Setelah di save tempalate /di simpan tempalate.
Kemudian buka Tab Pengaturan | Format.

 

masukan kode di bawah ke dalam  kotak sebelah kanan  tulisan Template Posting.

<span id="fullpost">
</span>

lihat gambar

 

Cara Mengunakan " Read More " Dalam Artikel.

1. Dalam Editor ( tempat menulis artikel ). - jika kita biasa menulis secara compose. tulis saja dulu artikelnya .

Setelah beres menulis, tekan tab penulisan secara  Edit Html. kemudian pindahkan  letak  kode ini :    <span id="fullpost"> di tempat yang ingin  kita pengal atau potong  artikelnya . kemudian periksa juga di akhir artikel  harus ada tag penutupnya, yakni :</span>

ilustrasi gambar.

 

Atau jika masih binggung coba menulis artikel langsung dalam Edit Html . lihat gambar.

 

Cara pemengalan artikel atau " Read More " yang lainnya anda bisa buka di blog tutorial ini.

a.special-effects-for-peekaboo-posts Ramani

b.super-peek-boo-posts beautifulbeta

c.peek-boo-posts-from-labels-from-my blogU student.

Jika blog ini bermangfaat.Ikuti terus update informasinya. Silahkan Klik dan masukan emal anda untuk berlanganan Via Email Subscription atau klik Subscribe Via Rss Feed .
Makasih juga atas kunjungannya.

Technorati tags: New Blogger Tutorial, Read More

Membuat Banner header animasi Flash bg 1

Setelah menimbang, membungkus dan membeli, ternyata eh ternyata, bikin banner baik itu untuk di simpan di bagian sidebar atau header, menurut saya lebih bagus pake animasi file flash dari pada animasi file gif.

Selain pertimbagan ukuran flash bisa lebih kecil dari file gif, banner animasi dengan flash bisa lebih pariatif, kaya akan pergerakan animasinya, pengulangan animasi dapat di kontrol dan kelebihan lainnya.

Nah untuk postingan kali ini, saya akan bagi-bagi informasi tentang membuat banner header animasi flash dengan bantuan program Swishmax. dan jangan khawatir program ini sangat instan dan mudah di gunakan, walaupun kita belum tahu sama sekali dengan program flash yang satu ini.

hasil akhir atau target yang akan kita pelajari tentang membuat banner header animasi dengan flash ini, bisa anda lihat di sini. dan sengaja saya perlihatkan pula di bawahnya ilustrasi gambar antar muka program swishmax tersebut untuk tambah memudahkan dalam mengikuti tutorialnya. ( jadi buka terus contoh banner tersebut )

baiklah mari kita mulai.

Jika anda belum mempunyai program swishmax donlot dulu program swishmax versi trial-nya di swishzone. kemudian instal sesuai prosedur.

Sedangkan tutorial ini saya mengunakan Swishmax v 5. jadi jika ada yang mengunakan swishmax terbaru tinggal menyesuaikan saja.

1. Buka program Swishmax.kemudia pada Movie Panel pilih tab Movie dan atur setingannya seperti ilustrasi gambar.

2. Kemudian dalam ruler atas drag  sebuah guide, begitu juga drag sebuah guide dari ruler samping kiri.

tambah dan atur guide-nya hingga seperti  gambar.

 

3. Dalam Outline Panel, klik tab Insert - > pilih Text.

 

4. kemudian  dalam jendela text tulisankan " Jaloee Blog " atau nama blog kamu. Sedangkan pada Panel Text atur settingannya seperti gambar .

 

5. Pilih Select Toll .

 

kemudian pada layar kerja ( layout Panel ) Drag atau geser tulisan ke samping kiri atas.lihat gambar

 

6. Kemudian dalam tab  Inser — pilih Text buat lagi beberapa tulisan. ( caranya seperti langkah ke  3 dan ke 4 ).

Tulisannya yaitu

1. PERSONAL ( jenis font : Alien Encounters. Ukuran : 30 )
2. – Photoshop ( ukuran: 12 )
3. – Blogger  ( ukuran : 12 )
4. – Grafis ( sama )
5. – Free Template ( sama )
6. – Css Html ( sama )
7. – Web Layout
8. – Banner
9. – BlogBlogging

( atau buat tema-nya sesuka kita ). dan atur posisinya seperti gambar di bawah.

 

7. Kemudian pilih Auto shape toll.

dalam Shape Panel atur warnanya.

Setelah itu buat sebuah kotak dan buat juga di atas kotak sebuah tulisan yakni " Because I love To Share ". hasilnya seperti gambar berikut.

Bersambung : Cara Menganimasikan di program Swishmax.

 

<<<Previous

|

Next>>>

Ikuti terus update informasi blog ini. Silahkan Klik dan masukan emal anda untuk berlanganan Via Email Subscription atau klik Subscribe Via Rss Feed .
Makasih juga atas kunjungannya.

Technorati tags: Animasi Flash, Tutorial New Blogger

Pasang Animasi File " Flash " Di New Blogger

Tidak kepikiran blog ini saya pasang juga animasi file " Flash ". padahal awalnya saya cuman mau membantu mas jujuk yang ingin blog na pake animasi Flash.

Namun karena ngga ada kerjaan, kemarin saya coba bikin animasi Flash sederhana, dari program tua " Swismax ". Program yang menurut saya sangat mudah digunakan dan instan. di bandinkan dengan program Flash Cs3. ( yg 99% lupa lagi cara kerjanya ).

hasilnya bisa di lihat di samping kiri blog ini. dan jika di klik akan menuju pada alamat feed yang saya miliki.

Dan untuk memasang file flash ke dalam New Blogger caranya sangat mudah. saya mendapatkan kode ini dari bloggerdummie.

1. Siapkan file flash yang sudah kita buat ( saya sarankan file-nya  jangan terlalu berat/besar )

2. buka situs www.googlepages.com. kemudian login pake accoun Gmail yang kita miliki.

3.  Setelah terbuka klik tulisan upload. kemudian tekan tombol browser dan cari file flash yang telah kita siapkan di komputer.

Dan setelah file Flash-nya tersimpan. dekatkan mouse pada  file tersebut. untuk mengetahui alamat url file flash-nya. ( untuk Fire Fox lihat di samping kiri di bawah ).

 

Atau cara yang mudah klik kanan mouse pada file flash tersebut,dalam menu yang terbuka  pilih Copy Link Location. untuk mengcopy alamat urlnya.

 

4. Kemudian buka blog kita dalam Halaman Elemen pilih elemen Html/Javascript.

Masukan kode di bawah ini dalam elemen Html/Javasript :

<object width="150" height="340"> <param value="MYFLASH.swf" name="movie"/> <embed width="150" src="URL OF MYFLASH.swf" height="340"> </embed> </object>

Ganti ukuran nilai width dan height, dengan ukuran file Flash yang kita buat.

Kemudian cari dan ganti juga tulisan ini.

URL OF MYFLASH.swf

dengan alamat url file flash-nya, yakni.

 

Tutorial dan Link Yang Berhubungan Dengan SwisMax.

1. ilmukomputer.com

2. Google Search

 

Ikuti terus update informasi tentang New Blogger di blog ini. Silahkan Klik dan masukan email anda untuk berlanganan Via Email Subscription atau klik Subscribe Via Rss Feed . Makasih juga atas kunjungannya.

 

Technorati tags: Animasi Flash, New Blogger

Membuat Banner Header Animasi flash bg 2

Sekarang kita akan meng-animasikan tulisan-tuilisan yang telah kita buat. Untuk kita berkonsentrasi di bagian Time Line saja.

 

1. Di bagian timeline ini pilih tulisan " Jaloee Blog ", kemudian pilih juga Frame 5. lihat gambar.

 

2. Tekan tab Add Effect.

pada menu yang terbuka pilih Slide – In From Right.

 

3. Dalam TimeLine Panel tekan dua kali effect ”Slide In From R“

 

 

kemudian pada jendela yang terbuka ganti nilai durasinya ke angka 30.

 

4. Masih pd tulisan Jaloee Blog. pilih Frame 35 kemudian buka tab Add Effect – Appear Into Position – 3d Spin in and grow. ( cara melakukannya seperti langkah ke 1,2 dan 3 ).

 

5. Sekarang pilih tulisan “ Personal ” . dan pilih frame 60 kemudian buka tab Add Effect – Appear Into Position – Come around from back.

 

6. Pilih tulisan “ - Photoshop ”. pada Frame 85 buka tab Add Effect – Fade – Fade In.

 

7. Kemudian pilih tulisan " - Blogger ". pada titik akhir durasi Frame "-photoshop " tambahkan Effect – Fade – Fade In. seperti terlihat pada gambar.

 

lakukan yang sama untuk tulisan " Grafis " s/d " BlogBlogging ".

Atau yang paling bagus kita mengatur animasi untuk tulisan photoshop s/d blogbloging tampil secara acak.

 

 

8. Sekarang kita pilih Auto shape ( kotak ) yaitu  kotak yang  tadi kita buat.

kemudian pilih frame setelah durasi frame tulisan BlogBlogging tambahkan Add Effect – Appear Into Position - Come in Helo-helo.

 

9. Yang terakhir pilih tulisan " BeCouse I Love To Share ". pilih frame-nya setelah frame durasi Auto shape. tambahkan Add effect– Appear Into Position - Bullet Ripple In dan masih pada tulisan yang sama tambahkan juga Add Effect – Appear Into Position – Wild Typewrite.

Bersambung : Menyimpan ke dalam file Flash.

 

<<<Previous

|

Next>>>

Ikuti terus update informasi blog ini. Silahkan Klik dan masukan emal anda untuk berlanganan Via Email Subscription atau klik Subscribe Via Rss Feed .
Makasih juga atas kunjungannya.

Technorati tags: Animasi Flash, Tutorial New Blogger

Menambah Background-Gambar pd Blog

Untuk menambah background-image ( bergambar ) pada blog.ada dua cara yang bisa kita gunakan. Cara pertama Bisa dengan satu gambar yang ukuran-nya sesuai dgn halaman blog, atau cara kedua mengunakan gambar kecil yang di repeat (di ulang-ulang) hingga menyesuaikan dengan halaman blog.

Cara yang Pertama :

1. Siapkan gambar ukuran 1024 x 768 px.( untuk di tampilkan pd monitor dengan Resolution 1024 x 768 px atau di bawahnya ) atau gambar ukuran 800 x 600 px ( untuk di tampilkan pada monitor resolution 800X600 px ).

2. Setelah itu Upload gambar atau simpan pada Image hosting seperti Photobucket, Googlepages atau image hosting yang biasa kita gunakan ( untuk yg belum tahu cara menyimpan gambar pd image hosting klik di sini )

3. Sekarang buka blog kita pada halaman Template -> buka tab Edit Html. kemudian cari kode/tag css Body {... } misalkan kodenya seperti ini.

body {
font: normal 85% / 100% "Trebuchet MS",Tahoma,Arial;
color: #000;
background: #FFFFFF;
}4. Kemudian tambahkan saja properti  ini :

background-image: url (http://alamat gambar kamu.com/image.jpg);

Dan hasil pengabungannya seperti ini.

body {
font: normal 85% / 100% "Trebuchet MS",Tahoma,Arial;
color: #000;
background: #FFFFFF;
background-image: url (http://alamat gambar kamu.com/image.jpg);
}

Cara Yang Kedua

Mengunakan nilai repeat ( di ulang-ulang ). yang terbagi ke dalam tiga penulisan :

1. Me-repeat image baik secara vertikal dan horizontal.

Contoh ilustrasi gambar ...+/-

 

ukuran 200 x 200 px

Penambahan properti-nya seperti ini.

background-image: url (http://alamat gambar kamu.com/image.jpg);
background-repeat:repeat;hasil pengunaanya seperti background blog ini, atau bisa di lihat juga di sini.

2. Me-repeat gambar secara vertikal saja.

Contoh ilustrasi gambar ...+/-

ukuran 1024 x 99 px

Penambahan properti-nya sperti ini.

background-image: url (http://alamat gambar kamu.com/image.jpg);
background-repeat:repeat-y;hasilnya bisa di lihat di sini.

3. Me-repeat gambar secara horizontal saja.

Contoh ukuran gambar ...+/-

ukuran 198 x 768 px

Penambahan properti-nya seperti ini.

background-image: url (http://alamat gambar kamu.com/image.jpg);
background-repeat:repeat-x;hasilnya bisa di lihat di sini.

Gambar yang bisa di gunakan untuk background-image ini : Jpg, Gif, Png.

 

Beberapa link penyedia background-image :

1.grsites.com
2.customize.org
3.veredgf.fredfarm.com
4.loreleiweb.com
5.designpacks.com
6.kollermedia.at
7.backgroundcity.com

 

Ikuti terus update informasi New Blogger di blog ini. Silahkan masukan email anda untuk berlanganan Via Email Subscription atau klik Subscribe Via Rss Feed .Makasih juga atas kunjungannya.

 

Technorati tags: Background Layout, New Blogger

Membuat Banner Header Animasi Flash bg 3

Pada tulisan sebelumnya, kita bisa saja langsung mensave animasi yang kita buat ke dalam file Flash. namun ada tugas terakhir agar banner yang kita buat tidak me-looping atau mengulang dari awal secara keselurahan, tapi cukup pada animasi bagian terakhir saja. dan ini di lakukan dengan membuat script sederhana.

1. pilih tulisan scene_1 di Timepanel, dan pilih juga Frame yang paling akhir .

 

2. Tekan tombol Add Script.pada menu yang terbuka pilih movie control – gotoAndPlay – gotoAndPlay ( Frame ).

menambah movie control di atas artinya kita akan mengontrol jalanya animasi. di antaranya yang bisa kita lakukan mengontrol agar animasinya melooping ( mengulang ) hanya pada frame yang kita tentukan saja.

3. Setelah terbuka jendela script-nya.

tulisankan nila atau di Frame berapakah kita akan mengulang animasinya. misalkan animasinya mengulang hanya pada animasi frame 225.

4. Langkah yang terakhir. pada Movie Panel kita pilih tab Scene kemudian di samping tulisan On Click pilih : Go to link (url). dan pada kotak kosong isi alamat (url) blog kita atau alamat (url) feed. artinya ini jika kita menekan banner ini maka akan menuju pada halaman depan blog atau feed kita.

5. Setelah beres kemudian buka menu File – Export – SWF atau Ctrl + E.

6. Huhuhui sekarang kita punya banner header animasi flash, untuk memajangnya di blog kita baca saja caranya di sini.

 

<<<Previous

|

Next>>>

Technorati tags: Animasi Flash, New Blogger Tutorial

Mendaftarkan Blog ke Search Engine Google

Di Update pada bulan oktober 2009

Sebenarnya cara yang relatif mudah untuk menarik pengunjung ke blog kita. ialah banyak-banyaklah berkunjung ke blog lain, isi shoutbox nya dan kalau perlu berkomentar, semakin akrab semakin baik. karena dengan cara demikian sebenarnya kita telah beriklan  tentang keberadaan blog kita sendiri.

Namun jika blog kita ingin menarik pengunjung dari hasil pencarian - dan ingin terindex  ke dalam  mesin pencari (Search Engine) seperti google dan yahoo.  yang  harus kita lakukan adalah mendaftarkan  blog kita ke dalam mesin pencari tersebut.

Memasukan Url or Alamat Blog Ke Google.

Daftarkan blog kita ke google melalui situs sini. Google add Url.

Url : isi dengan alamat blog anda

Commnets : masukan keterangan tentang blog anda. >> add url

 

Verifikasi dan Submit ke Webmaster Tools.

Langkah selanjut memperifikasi dan men submit sitemap blog anda ke webmaster tool.

1. buka google webmaster tools kemudian daftar mengunakan gmail account yang kita miliki.

2. klik tab Add a Site

3. Enter the URL of a site you'd like to manage. masukan alamat blog anda - tampa di awali dengan http:// atau www. misal >> rizjournal.blogspot.com.

klik Continue.

 

4. Kemudian pada halaman Verification status, ( untuk blogspot biarkan pemilihan pada Meta Tag . red ). Salin / copy semua tulisan <meta name="google-site-verification" dst.. dgn cara pilih klik kanan mouse copy.



 

5. Login / masuk pada blog anda ( blogger.com ), kemudian dalam halaman Template, pilih >> tab Edit Html. masukan dan simpan meta name verifikasi yang tadi kita copy setelah tag :  <title><data:blog.pageTitle/></title>

Setelah beres klik tombol >> Save Template / Simpan Perubahan.

6. Kembali ke halaman google webmaster tool. kemudian klik tombol Verify, untuk mengkonfirmasi pendaftaran.

7.  Jika berhasil ter Verifikasi maka anda akan masuk pada halaman Dasboard .

 

Submit a Sitemap

Setelah blog kita terverifikasi, langkah selanjut mensubmit sitemap / peta situs blog kita. Untuk blogspot sitemapnya tidak serumit blog lain.

Untuk mensubmit sebuah sitemap dalam halaman dasboard cari tulisan Sitemaps kemudian klik link tulisan Sumbit a Sitemap.

  

Setelah itu pada halaman sitemaps klik tombol Add a site, dan masukan kode ini pada kotak isian >> Submit Sitemap

atom.xml?redirect=false&start-index=1&max-results=500

 

Keyword dan Keterangan Blog

Keyword atau kata kunci merupakan bagian dari penjelasan di atas. Walaupun menurut sebagian master seo. google dan search engine lainnya sudah tidak mendata lagi informasi dengan bantuan keyword yang ada pada sebuah situs web/blog.

Dan saya pun tidak akan menjelaskan panjang lebar tentang keyword ini, karena begitu luas dn dinamisnya – yang tidak mungkin saya bisa jabarkan dalam satu artikel. Namun untuk panduan dasar bisa anda donwload E-book “ Search Engine Optimization – Starter Guide pdf “.

Sedangkan untuk menyimpan atau menambah meta keyword dan meta description, tambahkan saja kode berikut ini, di bawah kode verifikasi di atas.

<meta content='ISI DESCRIPTION ' name='description'/>
<meta content='ISI KEYWORDS ' name='keywords'/>
<meta content='ISI AUTHOR NAME' name='author'/>
<meta content='index,follow' name='robots'/> 

 

 

Technorati tags: SEO, New Blogger