Blogger Widgets Blogger Widgets

1

sabica
salamat datang di blog percobaan saya ini, terima kasih atas kujungan anda!
  • sabica

    Replace these

  • SLIDER-2-TITLE-HERE

    Replace these

  • SLIDER-3-TITLE-HERE

    Replace these every slider sentences with your featured post descriptions.Go to Blogger edit html and find these sentences.Now replace these with your own descriptions.This theme is Bloggerized by Lasantha - Premiumbloggertemplates.com [...]

  • SLIDER-4-TITLE-HERE

    Replace these every slider sentences with your featured post descriptions.Go to Blogger edit html and find these sentences.Now replace these with your own descriptions.This theme is Bloggerized by Lasantha - Premiumbloggertemplates.com [...]

  • SLIDER-4-TITLE-HERE

    Replace these every slider sentences with your featured post descriptions.Go to Blogger edit html and find these sentences.Now replace these with your own descriptions.This theme is Bloggerized by Lasantha - Premiumbloggertemplates.com [...]

  • SLIDER-4-TITLE-HERE

    Replace these every slider sentences with your featured post descriptions.Go to Blogger edit html and find these sentences.Now replace these with your own descriptions.This theme is Bloggerized by Lasantha - Premiumbloggertemplates.com [...]

Selasa, 31 Mei 2011

Tips trick blog Membuat Read More Otomatis



Tips trick blog Membuat Read More Otomatis


Mungkin sudah banyak yang menulis artikel tentang Tips Trick blog Membuat Read More Otomatis, Akan tetapi tidak ada salahnya kalau kita bahas bersama lagi, mungkin saja masih banyak yang belum tahu tentang Tips Trick blog Membuat Read More Otomatis yang artinya Anda bisa menentukan sediri panjang artikel yang akan Anda tampilkan. dan sangat praktis untuk mempercantik blog atau wapsite anda dan ada akan mendapatkanya dengan gratis tis tis tis......!!!

Dari pada panjang lebar ngomonya kita ungkap saja rahasia blog para blogger sejati ini.

Baiklah untuk melakukan hal ini, tinggal mengikuti langgkah2 berikut ini.
1. Login dulu ke Blogger.com
2. Kemudian Tata Letak (Lay Out)
3. Berikutnya pilih Edit HTML
Note: Jangan lupa untuk mencentang Expand Widget
4. Tambahkan kode dibawah ini setelah kode </head>


<script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://sites.google.com/site/rasiqzonetwork/javascript/readmore-otomatis.js' type='text/javascript'/>



5. Kemudian ganti kode <data:post.body/> atau <p><data:post.body/></p>
dengan kode ini:




<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<span class='rmlink' style='float:right;padding-top:20px;'>
<a expr:href='data:post.url'>&#187;&#187;&#160;&#160;READMORE...</a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>


6.Gantilah kode yang berwarna merah sesuai selera anda.. Summary noimg 430 = tinggi artikel terpenggal tanpa image, Summar img 430 = tinggi artikel terpenggal dengan image, Readmore bisa Anda ganti dengan Baca Selengkapnya, Full read dll...Tips Trick blog Semoga bermanfaat dan membantu kegiatan blogging anda.. :D

Cara Mudah Membuat Pengikut/Follower Blog


Cara Mudah Membuat Pengikut/Follower Blog Melayang

Sekarang kita menggungkap rahasia blog para blogger sejati yang satu ini,
Cara Mudah Membuat Pengikut/Follower Blog Melayang. Tips Trick blog yang satu ini tujuannya yaitu tidak lain dan tidak bukan selain untuk mengoptimasi fungsi widget followers anda. Dengan letaknya widget Followers di bagian pojok blog anda atau dalam keadaan melayang mirip seperti iklan melayang - maka setiap kali halaman mana saja yang ada di blog anda diklik oleh pengunjung, maka widget followers ini akan selalu berada di pojok dan juga walau halaman yang ada di blog anda di-scroll atau digulung, widget followers anda akan terus berada di tempat - tepatnya di bagian pojok blog. Dengan begitu - karena widget ini selalu tampil di pojok dan lebih sering dilihat, maka semakin besar pula peluang pengunjung blog anda untuk ikut blog anda (ya semakin besar juga kesempatan anda untuk mendapatkan jumlah followers yang banyak dengan cepat, hehe).

Cukup gampang sekali Cara Mudah Membuat Pengikut/Follower Blog Melayang,

Langkah1
1. Silahkan surfing ke akun Google Friend Connect milik anda (usahakan anda dalam keadaan online/login akun Google atau Blogger anda)

2. Selanjutnya anda akan dibawa ke halaman utama akun Google friend connect milik anda. Perhatikanlah nama-nama blog anda di bagian kiri (untuk poin yang ini khusus bagi anda yang memiliki blog lebih dari satu dalam satu akun Blogger, bagi anda yang hanya memiki satu blog - silahkan langsung ke poin "tiga")(3) => Pilihlah blog mana yang hendak anda pasang widget Followers-nya.

3. Pilih Gadget yang bernama "Tambahkan Gadget Anggota"


4. Maka anda akan dibawa ke halaman pengambilan kode script "Widget Followers". Di halaman ini anda bisa mengatur berapa lebar widget followers anda nantinya, lalu berapa jumlah sederetan wajah followers anda, juga bisa mengatur warna tampilan widget followers anda (background, garis tepi, dll). Sebagai catatan: Usahakan lebar widget anda benar-benar cocok dengan bagian pojok blog anda, ini bertujuan agar tampilan blog anda terlihat lebih bagus.

5. Seusai pengaturan dan anda merasa ukuran widget yang telah anda setting sudah benar-benar cocok dengan ukuran pojok template blog anda, maka segeralah untuk mengambil kode scriptnya dengan cara mengklik tombol "Buat Kode"

6. Ambillah kode tersebut, lalu paste-kan ke "notepad" atau di mana pun untuk digunakan di (langkah 2)


Langkah 2
1. Login dulu ke akun Blogger anda
2. Klik pilihan Tata Letak => Edit HTML
3. Carilah kode tag ]]></b:skin> dan kalau sudah ketemu, letakkan kode berikut tepat di atas kode tag ]]></b:skin>

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

4. Selanjutnya, carilah kode tag </body> dan letakkan kode berikut tepat di atasnya
<div id="followers-pojok">

"Peringatan:" letakkan kode tag diatas tepat diatas kode
</body> jangan salah

5.Selanjutnya,Letakkan kode Google friend connect milik anda dibawahnya, jangan lupa letakkan kode tag </div> dibawah kode Google friend connect milik anda,


CONTOH

<div id="followers-pojok">

<!-- Include the Google Friend Connect javascript library. -->
<script type="text/javascript" src="http://www.google.com/friendconnect/script/friendconnect.js"></script>
<!-- Define the div tag where the gadget will be inserted. -->
<div id="div-3373505607229667276" style="width:276px;border:1px solid #cccccc;"></div>
<!-- Render the gadget into a div. -->
<script type="text/javascript">
var skin = {};
skin['BORDER_COLOR'] = '#cccccc';
skin['ENDCAP_BG_COLOR'] = '#e0ecff';
skin['ENDCAP_TEXT_COLOR'] = '#333333';
skin['ENDCAP_LINK_COLOR'] = '#0000cc';
skin['ALTERNATE_BG_COLOR'] = '#ffffff';
skin['CONTENT_BG_COLOR'] = '#ffffff';
skin['CONTENT_LINK_COLOR'] = '#0000cc';
skin['CONTENT_TEXT_COLOR'] = '#333333';
skin['CONTENT_SECONDARY_LINK_COLOR'] = '#7777cc';
skin['CONTENT_SECONDARY_TEXT_COLOR'] = '#666666';
skin['CONTENT_HEADLINE_COLOR'] = '#333333';
skin['NUMBER_ROWS'] = '4';
google.friendconnect.container.setParentUrl('/' /* location of rpc_relay.html and canvas.html */);
google.friendconnect.container.renderMembersGadget(
{ id: 'div-3373505607229667276',
site: '11591567978510271076' },
skin);
</script>

</div>


5. Klik simpan template. SELESAI....Sekarang Widget Followers anda ada di pojok^


GUNAKAN SATU TRIK UNTUK BERBAGAI MACAM TAMPILAN DAN KREASI, SATU TRIK TAK BERARTI HANYA SATU TAMPILAN
dan ini menjadi salah satu rahasia blog, dan para blogger sejati sangat suka dengan scrips atau gatget ini akan meningkatkan pagrank blog kita gto.....!!

Jika ada masalah, silahkan untuk meninggalkan pertanyaan anda di kotak komentar.
Tips Trick blog
Semoga bermanfaat_







Cara Mencopy Gambar di Layar Monitor
Beberapa teman pembaca blog ini sering melihat bahwa gambar yang di suguhkan berupa gambar hasil dari mengcopy dari layar monitor, dan ada diantaranya yang masih belum mengetahui bagaimana cara mengcopy gamabar pada layar monitor, misal gambar hasil copian seperti ini :


copy halaman monitor


Untuk mengcopy gambar yang ada di layar monitor anda sangatlah mudah, akan tetapi anda memerlukan software pengolah gambar agar gambar hasil dari pengcopian bisa di atur tinggi dan lebarnya agar bisa pas dengan halaman post anda. Jenis software pengolah gambar sangatlah banyak, namun agar menemui keseragaman kang rohman mencontohkan dengan memakai software photoshop. Begininih caranya :

  1. Buka software photoshop nya.
  2. Klik menu file kemudian klik new, untuk membuat halaman baru.
  3. Buka halaman yang ingin anda copy, misal buka halaman blog kang rohman ini.
  4. Apabila halaman yang akan di copy sudah terlihat di layar monitor, tekan tombol Ctrl berbarengan dengan tombol Print Screen ( Ctrl + Print Screen ) pada keyboard anda.
  5. Buka kembali halaman photoshop nya.
  6. Tekan tombol Ctrl berbarengan dengan tombol V ( Ctrl + V ) pada keybord anda. Sekarang gambar yang ada di monitor anda sudah ada di photoshop namun ukurannya masih sangat besar (seukuran layar monitor anda).
  7. Masih pada halaman photoshop. Untuk mengatur besarnya gambar tadi, silahkan klik menu Image yang ada di bagian paling atas. Setelah keluar opsi, silahkan pilih Image Size… silahkan tentukan besarnya gambar yang ingin di tampilkan di blog anda.
  8. Untuk menyimpan gambar tadi, klik menu File >> Save for Web… >> save.
  9. Selesai, tinggal di upload saja ke blogger atau yang lainnya.

Sebenarnya tidak harus pada software editor gambar, pada microsoftword pun bisa. Pada intinya untuk mengcopy gambar dari layar monitor adalah Ctrl + Print Screen, dan untuk mempaste nya cukup dengan Ctrl + V.

Semoga bermanfaat!
Membuat Readmore (3)
Melihat dari banyaknya komentar yang di ajukan pada artikel tentang
cara memotong artikel atau lebih di kenal dengan Read more...,
maka sayapun tertarik untuk membahasnya kembali. Bagi sobat yang belum pernah
membacanya, silahkan baca di sini, karena jika sobat belum membacanya
maka ketika membaca artikel ini terasa tidak ada kaitannya.




Memang ada sebagian orang merasa puas karena telah menemukan artikel tentang
cara membuat menu Read more... yang saya tulis karena setelah di praktekan hasilnya
sangat memuaskan alias berhasil mulus, tapi ada juga yang merasa sedikit jengkel karena
menurut perasaan mereka telah mengikuti seluruh langkah-langkah yang saya tulis tapi
hasilnya nihil alias tidak berhasil. Dan ada juga sebagian yang merasa jengkel karena
telah mengikuti apa yang saya tulis, ini di akibatkan katanya setelah mengikuti apa-apa yang saya
saya tulis seluruh postingannya menjadi hilang entah kemana.



Fenomena yang cukup menarik, satu sumber tulisan akan tetapi hasilnya bisa bervariasi.
Tapi jangan terburu berkecil hati, saya pun di dalam belajar nge-blog tidak sekonyong-konyong
berhasil dan tidak sekonyong-konyong menjadi pintar, semua ada prosesnya. Dan satu lagi kabar
gembira bagi sobat yang belum berhasil membuat menu Read more... dulu sayapun pernah
mengalaminya dan sayapun pernah juga mengalami kehilangan seluruh postingan saya setelah
membuat menu Read more..., akan tetapi justru karena kegagalan-kegagalan tersebutlah
yang membuat saya lebih bersemangat untuk terus belajar, saya mempunyai prinsip yaitu apabila
orang lain bisa kenapa saya tidak bisa, dan itulah yang menjadi cambuk untuk terus belajar dan belajar,
dan sampai detik inipun saya masih tetap belajar.



Kembali kepada masalah Read more.., walaupun masih banyak yang belum berhasil alias gagal
ketika membuat menu Read more.. pada postingan, saya masih tetap yakin apabila sobat
mengikuti secara benar maka hasilnya akan sukses, ini pernah terbukti ada seorang sobat ketika
Chatting melalui Yahoo ! Messenger bersikeras tidak berhasil walaupun telah mengikuti apa yang
saya tulis. Weks... saya juga bingung atuh kalau sudah mengikuti sesuai yang di tulis tapi tetap
tidak berhasil. Akhirnya jalan terakhir saya gunakan yaitu sobat tersebut saya suruh mengganti password
untuk login ke blogger lalu kemudian password baru tersebut di berikan kepada saya dengan perjanjian
bahwa sobat saya harus percaya bahwa saya tidak akan mengacak-acak isi blog nya. Setelah saya login
ke blog teman saya tersebut ternyata benar saja bahwa beliau ini tidak mengikuti seluruh yang saya
tulis, kemudian saya tambahkan kode Read more.. nya dan berhasil dengan waktu yang relatif singkat.
Setelah itu saya beritahukan bahwa sudah berhasil dan password yang baru untuk login di minta untuk
di ubah kembali agar saya pun tidak mengetahuinya. Jadi kesimpulan sementara yaitu sobat yang belum berhasil,
kemungkinan ada kode yang telewatkan.




Baiklah... kembali ke topik awal yaitu tentang menu Read more..., agar sedikit mengerti akan saya
tuliskan kode dasar dari posting, yaitu :







<div class='post-body'>

<p><data:post.body/></p>

<div style='clear: both;'/> <!-- clear for photos floats -->


</div>








Perhatikan baik-baik kode di atas, itu merupakan kode asli dari template sobat sebelum di otak-atik.
Jika sobat mengikuti langkah-langkah yang pernah saya tulis, maka kode nya akan berubah seperti ini:







<div class='post-body'>


<b:if cond='data:blog.pageType == "item"'>


<style>.fullpost{display:inline;}</style>

<p><data:post.body/></p> <!-- satu -->

<b:else/>

<style>.fullpost{display:none;}</style>



<p><data:post.body/></p> <!-- dua -->


<a expr:href='data:post.url'>Read more.....</a>

</b:if>


<div style='clear: both;'/> <!-- clear for photos floats -->


</div>








Kode di atas sengaja di bedakan warnanya, warna biru merupakan kode asli dari template,
warna merah merupakan kode yang harus di tambahkan. Yang perlu sobat hati-hati adalah kode ini :





<p><data:post.body/></p>








Kode di atas harus di pastikan ada dua tidak boleh ada satu karena jika ada satu maka postingan
sobat bisa hilang semuanya, akan tetapi sebenarnya seluruh postingan tidak hilang, akan tetapi
tidak di perlihatkan alias di sembunyikan. Postingan di perlihatkan dan di sembunyikan karena
kode :





<style>.fullpost{display:inline;}</style>




<style>.fullpost{display:none;}</style>









{display:inline;}
artinya di tampilkan, dan

{display:none;}
artinya jangan di tampilkan alias sembunyikan dan kode inilah apabila
salah pemasangan mengakibatkan semua postingan menjadi tidak di tampilkan, jadi apabila di satukan
dari seluruh kode, maka kira-kira seperti ini :



Tampilkan postingan



Jangan tampilkan postingan



Tampilkan postingan apabila di klik link Read more...






Langkah yang tak kalah pentingnya yaitu sobat harus memasang kode Readmorenya pada tab Edit HTML
jangan pada tab Compose, serta kode Read more... harus selalu di tutup. Contoh pemasangan
kode read more... pada artikel seperti ini :



Ini adalah tulisan pada paragrap pertama yang akan muncul di halaman muka blog, paragrap - paragrap
lainnya akan muncul apabila pengunjung blog meng klik link untuk membuka keluruhan artikel.



<div class="fullpost">





Paragrap yang kedua, ketiga dan seterusnya harus di tempatkan di sini, jangan di tempatkan
sebelum kode readmore, jangan lupa untuk menutup kodenya ya..




</div>






Maka nanti yang akan muncul hanyalah paragrap atasnya saja yakni seperti ini :



Ini adalah tulisan pada paragrap pertama yang akan muncul di halaman muka blog, paragrap - paragrap
lainnya akan muncul apabila pengunjung blog meng klik link untuk membuka keluruhan artikel.


Read more...






Sudah lebih fahamkah? bagi sobat yang belum berhasil ada baiknya untuk mencobanya kembali.
Satu hal yang harus sobat ingat yaitu selalu membuat backup data template sebelum mencoba otak-atik kode
template, karena jika terjadi kesalahan semisal seluruh postingan menghilang maka jangan bingung
dan merasa panik, sobat tinggal Upload kembali backup data template yang sudah di simpan
pada komputer kita sebelum melakukan otak-atik, dan hasilnya nanti akan sedia kala seperti sebelum
sobat melakukan edit kode template. Jadi jangan pernah jera untuk mencobanya. Mau mencoba kembali?
silahkan baca langkahnya di sini !

Buat daftar isi blog


Buat daftar isi blog
Apakah sobat suka membaca buku? jawaban sobat tentunya akan beragam, ada yang akan menjawab suka dan ada juga yang akan menjawab tidak suka. Namun saya yakin sobat pernah membaca sebuah buku. Dalam sebuah buku ada satu bagian yang dinamakan daftar isi, dengan adanya daftar isi buku maka akan mempermudah pembaca buku tersebut untuk menemukan bagian-bagian isi buku yang ingin di baca. Pertanyaan yang mungkin muncul adalah apa hubungannya antara buku dengan blog? tak hanya sebuah buku yang bisa memuat daftar isi untuk mempermudah para pembacanya, didalam sebuah blog pun kita bisa melakukannya, contoh yang bisa dilihat adalah saya memuat judul-judul artikel yang pernah saya posting di bagian footer halaman ini ataupun ketika sobat membuka keluruhan artikel yang mau di baca maka di akhir artikel akan muncul sederet judul-judul artikel lainnya yang menggoda sobat untuk membacanya. Selain untuk menggoda pengunjung agar lebih berlama-lama di blog kita, cara ini pun akan sangat mempermudah para pembaca untuk menemukan artikel yang di rasa menarik untuk di baca. Akan tetapi cara tersebut saya lakukan secara manual yakni saya mencatat seluruh alamat artikel yang telah saya posting kemudian membuatkan link ke artikel tersebut.




Teknik pembuatan daftar isi di atas bisa saja kita lakukan, akan tetapi tentunya perlu waktu yang lama untuk mebuatnya dan tentunya akan menyita waktu kita. Nah... yang ingin saya terangkan saat ini adalah bagaimana cara membuat sebuah Daftar isi blog secara otomatis. Yupppsss.. dengan hanya sekali kita membuatnya maka daftar isi tidak usah di buat berulang-ulang namun terus bekerja secara otomatis,
teknik ini di perkenalkan oleh hans yang di muat melalui blognya beautiful beta. Agar tidak bingung tentang daftar isi blog yang akan saya terangkan, silahkan alihkan perhatian sobat ke bagian sebelah kanan atas blog ini, di sana terdapat link brtuliskan Lihat Daftar Isi, jika sobat meng klik link tersebut maka secara otomatis akan di perlihatkan seluruh judul artikel yang pernah saya posting lengkap dengan tanggal serta kategori dari artikel tersebut. Sunguh menarik bukan? jika sobat ingin melihatnya sobat bisa mengkliknya dan jika sobat tidak ingin melihatnya sobat tinggal mengkliknya kembali dan daftar isi pun akan di sembunyikan sehingga tidak akan menggangu pemandangan. Tertarik untuk membuatnya? silahkan ikuti langkah-langkah berikut :



Langkah pertama :



  1. Sign in di blogger
  2. Klik menu Layout
  3. Klik menu Edit HTML
  4. Klik link Download full template, silahkan save untuk backup data
  5. Copy paste kode CSS berikut di atas kode ]]></b:skin>
  6. Klik tombol SIMPAN TEMPLATE




Langkah kedua :




  1. Klik menu Elemen Halaman
  2. Klik tulisan Tambah sebuah Elemen Halaman
  3. Klik tombol TAMBAHKAN KE BLOG di bawah tulisan JavaScript/HTML
  4. Copy paste kode berikut ke dalam elemen yang muncul
  5. Klik tombol Simpan
  6. Pindahkan elemen yang baru di buat tepat di atas elemen Post
  7. Klik tombol Simpan yang berada di sebelah atas
  8. Klik tulisan Tambah sebuah Elemen Halaman kembali
  9. Klik tombol TAMBAHKAN KE BLOG di bawah tulisan JavaScript/HTML
  10. Beri judul elemen tersebut dengan yang kata yang sobat ke hendaki. Contoh : DAFTAR ISI, kemudian copy paste kode berikut ke dalam kotak elemen
  11. Ganti tulisan YOURBLOG dengan nama blog sobat
  12. Klik tombol Simpan
  13. Pindahkan elemen yang baru di buat ke tempat yang sobat sukai (sebaiknya di simpan disebelah atas)
  14. Klik tombol SIMPAN yang berada di sebelah atas
  15. Selesai





Kode yang terakhir di pasang merupakan kode asli yang di buat oleh hans dan tentunya semua hasil dari kode tersebut berbahasa inggris, baik itu judul , alert dan segala macamnya adalah berbahasa inggris, jika sobat menginginkan jadi berbahasa indonesia, saya sudah memodifikasi javascrips nya sehingga akan menjadi berbahsa indonesia seperti milik saya. Cara yang harus di lakukan sangatlah mudah, sobat tinggal mengganti kode terakhir yang di pasang dengan kode di bawah ini :








Jangan lupa untuk mengganti tulisan YOURBLOG dengan nama blog sobat.



Selamat mencoba !

Read More Versi baru

Read More Versi baru
</h1>
<div class="post-header-line-1"></div>
<div class="post-body entry-content">
Bagi para sobat yang gemar menyingkat artikel dengan fasilitas <b>Read more</b>
atau <b>Baca selengkapnya</b> seperti yang telah saya terangkan pada artikel terdahulu, Sekarang ada cara membuat menu <b>Read more</b> yang saya sebut dengan Read more versi baru. Kenapa demikian? karena  menu <b>Read more</b> kali ini sedikit berbeda dengan yang saya terangkan pada artikel yang telah lalu. 
<br><br><span class="fullpost">
Fasilitas <b>Read more</b> kali ini di buat oleh <a href="http://hackosphere.blogspot.com/" target="_blank">Ramani</a> dan <a href="http://beautifulbeta.blogspot.com/" target="_blank">Hans</a>. Kelebihannya
yaitu ketika pembaca mengklik link <b>Read more</b>, maka keseluruhan artikel
bisa terbuka tanpa harus me-loading ulang yang terkadang membuat BT pembaca yang
koneksi internetnya rada lelet ( jadi malu, padahal blog saya berat banget untuk di loading), selain itu untuk artikel yang pendek, tulisan readmore nya bisa di hapus sehingga tidak mengganggu pemandangan seperti yang di keluhkan sobat <a href="http://goresanngawur.blogspot.com/" target="_blank">yuki</a> beberapa waktu lalu yang merasa terganggu karena tulisan readmore selalu muncul walaupun pada artikel yang pendek. 
<br><br>
Tapi sayang kode-kode berikut ini hanya berlaku bagi sobat yang memakai template baru saja dan untuk yang memakai template klasik saya ucapkan <i>Kaciaaaaaan deeeeehhh</i> (padahal blog ini pun pake template klasik jadi ga bisa pake ini).
<br><br>
Untuk menyingkat tulisan agar tidak terlalu dipenuhi dengan intermezo yang 
sedikit membuat bete and ngeselin, langsung saja untuk membuat read more versi baru ini silahkan ikuti langkah-langkah berikut ini :
<br><br>
<ol>
<li>Sig in di blogger dengan id sobat</li>
<br><br>
<li>Klik menu <b>layout</b></li>
<br><br>
<li>Klik menu <b>Edit HTML</b></li>
<br><br>
<li>Klik tulisan <b>Download Template lengkap</b>, silahkan save dulu template sobat, ini untuk mencegah resiko apabila terjadi kesalahan dalam melakukan kesalahan dalam proses editing template</li>
<br><br>
<li>Klik kotak kecil di samping tulisan <b>Expand Template Widget</b>, sekali lagi jangan lupa untuk memberi tanda centang dulu yah</li>
<br><br>
<li>Tunggu beberapa saat sampai proses selesai</li>
<br><br>
<li>Copy kode berikut, lalu paste tepat di atas kode <code><span style="color: red;">&lt;/head&gt;</span></code></li>
<br><br><br>
<code>
&lt;script type='text/javascript' src='http://amen24.googlepages.com/Readmore.js' /&gt;
</code>
<br><br><br>
<li>Tambahkan kode berikut pada kode template sobat, yang berwarna hitam adalah kode asli dari kode template dan yang berwarna merah adalah kode yang harus di tambahkan :</li>
<br><br>
<code>
&lt;h3 class='post-title'&gt;<br>
&lt;b:if cond='data:post.url'&gt;<br>
&lt;a expr:href='data:post.url'&gt;&lt;data:post.title/&gt;&lt;/a&gt;<br>
&lt;b:else/&gt;<br>
&lt;data:post.title/&gt;<br>
&lt;/b:if&gt;<br>
&lt;/h3&gt;<br>
&lt;/b:if&gt;<br>
&lt;div class='post-header-line-1'/&gt;<br>

&lt;div class='post-body' <span style="color: red;">expr:id='"post-" + data:post.id'</span>&gt;<br>
<span style="color: red;">&lt;b:if cond='data:blog.pageType == "item"'&gt;</span><br>
&lt;p&gt;&lt;data:post.body/&gt;&lt;/p&gt;<br>
<span style="color: red;">&lt;b:else/&gt;<br>
&lt;style&gt;#fullpost {display:none;}&lt;/style&gt;<br>
&lt;p&gt;&lt;data:post.body/&gt;&lt;/p&gt;<br>
&lt;span id='showlink'&gt;<br>
&lt;p&gt;&lt;a expr:onclick='"javascript:showFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'&gt;[+/-] Selengkapnya...&lt;/a&gt;&lt;/p&gt;<br>
&lt;/span&gt;<br>
&lt;span id='hidelink' style='display:none'&gt;<br>
&lt;p&gt;&lt;a expr:onclick='"javascript:hideFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'&gt;[+/-] Ringkasan saja...&lt;/a&gt;&lt;/p&gt;<br>
&lt;/span&gt;<br>
&lt;script type='text/javascript'&gt;checkFull("post-" + "&lt;data:post.id/&gt;")&lt;/script&gt;<br>
&lt;/b:if&gt;</span><br>
&lt;div style='clear: both;'/&gt; &lt;!-- clear for photos floats --&gt;<br>
&lt;/div&gt;<br>
&lt;/div&gt;<br>
.... rest of template code ....
</code>
<br><br><br>
<li>Klik tombol <b>SIMPAN TEMPLATE</b></li>
</ol>
<br><br><br>
Langkah selanjutnya :
<ol>
<li>Klik menu <b>Pengaturan</b></li>
<br><br>
<li>Klik menu <b>Format</b></li>
<br><br>
<li>Copy kode berikut lalu paste pada kotak kosong yang berada di samping
tulisan <b>Template posting</b></li>
<br><br><br><br>
<code>
&lt;span id="fullpost"&gt;
<br><br><br>
&lt;/span&gt;

</code>
<br><br><br><br>
<li>Klik tombol <b>Simpan Setting</b></li>
<br><br>
<li>Selesai.</li>
</ol>
<br><br><br>
Cara posting artikel :
<br><br>
Pada saat berada pada menu posting, pilih tombol yang <b>Edit HTML</b> jangan pilih yang tombol <b>Compose</b>, maka akan secara otomatis terlihat kode tadi di atas yaitu :
<br><br><br>
<code>
&lt;span id="fullpost"&gt;
<br><br>
<br><br>
&lt;/span&gt;
</code>
<br><br><br>
Simpan artikel yang mau di tampilkan di muka (ringkasannya) di atas kode <code>&lt;span id="fullpost"&gt;</code>, dan sisa keseluruhan artikel di simpan sesudah kode <code>&lt;span id="fullpost"&gt;</code> dan sebelum 
kode  <code>&lt;/span&gt;</code>.
<br><br><br>
Untuk artikel yang pendek, sobat tinggal menghapus kode tadi dan nanti
artikel muncul tanpa ada kode <b>[+/-] Selengkapnya...</b> dan <b>[+/-] Ringkasan saja...</b>.
<br><br>
Untuk contoh nyata saya sudah membuat blog yang sudah memakai sistem ini, silahkan sobat klik tulisan <b>[+/-] Readmore...</b> untuk membuka keseluruhan artikel, dan klik tulisan <b>[+/-] Summary only...</b> Untuk melihat ringkasan artikel. Silahkan sobat klik <a href="http://jaya-example.blogspot.com/" target="_blank"><b><i>di sini !</i></b></a>.
<br><br><br>
Selamat mencoba 

Link Satu Halaman


Anda disini » Home »
,

» Anchor Link / Link Satu Halaman
Kamis, Juli 05, 2007


Anchor Link / Link Satu Halaman


Lagi-lagi saya tertarik untuk membahas tentang cara membuat link. Yo'i, karena
tercatat tiga artikel yang sudah di posting tentang bagaimana cara membuat
tautan atau link, dan yang sekarang merupakan artikel yang keempat. Akan tetapi jangan
dulu mengira bahwa posting kali ini akan sama dengan postingan terdahulu, sebab
kali ini yang akan di bahas adalah cara untuk membuat link dalam bentuk Anchor.



Apa itu Anchor Link ?




Anchor link biasa di sebut juga dengan link dalam satu halaman, berbeda dengan hyperlink
pada umumnya yang biasa di gunakan untuk menghubungkan suatu tulisan dengan tulisan lain yang berada
pada halaman yang berbeda atau blog yang berbeda, anchor link ini lebih banyak di gunakan untuk
halaman yang sama. Masih bingung? memang saya juga sama bingungnya kalau membaca sekilas tentang pengertian tadi,
agar tidak sama-sama bingung akan saya beri contoh yang nyata. Pada bagian paling bawah blog ini, ada
tulisan berupa link yang tertera :



->> Kembali lagi ke atas <<-



Nah apabila sobat meng klik link tulisan tersebut maka secara otomatis yang akan tampil pada layar monitor sobat adalah halaman yang paling
atas dari blog ini, tidak percaya? silahkan buktikan ! Kelebihan anchor link dengan link biasa adalah link ini tidak memerlukan loading
ulang untuk memanggil obyek yang telah di tandai sebagai anchor.Contohnya seperti link yang berada paling bawah blog
ini, jika sobat mengkliknya maka tidak memerlukan waktu lebih dari satu detik halaman atas dari blog ini akan di tampilkan.



Bagaimana cara membuat anchor link?



Prinsip dasarnya adalah kita menandai terlebih dahulu suatu objek, lalu pada bagian yang lain kita buat link untuk memanggilnya.
Kode dasarnya seperti ini :





<a name="NamaAnchor"> .... </a>       <-- objek anchor



<a href="#NamaAnchor"> .... </a>       <-- link pemanggil anchor




Perhatikan tanda pagar (#) di atas, untuk nama anchor tidak memakai tanda pagar, akan tetapi untuk
link pemanggil anchor harus memakai tanda pagar.




Objek dari suatu anchor bisa di tampilkan bisa juga tidak, terlihat dari kode di atas ada tanda berupa titik-titik.
Titik-titik tersebut bisa di isi tulisan bisa juga di biarkan kosong, contoh :



<a name="AtasBlog"></a>       <-- objek anchor yang tidak ingin menampilkan tulisan.



<a name="AtasBlog">Blog bagian atas</a>       <-- objek anchor yang ingin menampilkan tulisan.




Berbeda dengan objek dari anchor, link pemanggil anchor haruslah di beri tulisan untuk bisa di klik oleh pengunjung, contoh :



<a href="#AtasBlog">Kembali ke atas</a> <-- link pemanggil anchor harus di beri tulisan.




Tertarik ingin membuatnya, silahkan ikuti langkah-langkah berikut :




Untuk template klasik :



  1. Sign in di blogger
  2. Klik menu Template
  3. Klik menu Edit HTML
  4. Copy seluruh kode template sobat, lalu paste pada notepad, silahkan save dulu untuk backup data
  5. Copy kode berikut lalu paste persis di bawah kode <body>
  6. <a name="atas"></a>
  7. Copy paste kode berikut di atas kode </body>
  8. <center><a href="#atas"> Kembali lagi ke atas</a> </center>
  9. Klik tombol Pratinjau untuk melihat perubahan
  10. Jika sudah OK, klik tombol Simpan Perubahan Template
  11. Selesai.



Penambahan kode <center> </center> di maksudkan agar tulisan link berada pada posisi tengah.




Untuk template baru :




  1. Sign in di blogger
  2. Klik menu Layout
  3. Klik menu Edit HTML
  4. Klik tulisan Download Template Lengkap, silahkan save dulu template sobat untuk backup data
  5. Klik kotak kecil di samping tulisan Expand Template Widget
  6. Tunggu beberapa saat sampai proses selesai
  7. Copy kode berikut lalu paste persis di bawah kode <body>
  8. <a name="atas"></a>
  9. Copy paste kode berikut di atas kode </body>
  10. <center><a href="#atas"> Kembali lagi ke atas</a> </center>
  11. Klik tombol Pratinjau untuk melihat perubahan
  12. Jika sudah OK, klik tombol SIMPAN TEMPLATE
  13. Selesai.





Satu lagi yang menarik dari fungsi kode ini, yaitu buat para sobat yang suka menulis posting
yang sangat panjang, atau merupakan tulisan-tulisan yang berupa karya ilmiah, Kode ini bisa
membantu kita untuk membuatkan sebuah navigasi untuk mempermudah pembaca. Misalkan pada setiap
pharagrap kita sisipkan sebuah anchor link yang mana anchor link ini bisa berupa tulisan yang terlihat
ataupun hanya sebuah objek yang tidak bisa terlihat oleh pembaca. Dan tentunya pada tempat-tempat tertentu
kita membuat tulisan berupa link untuk memanggil anchor link. Sebagai contoh saya telah membuat beberapa
anchor link pada setiap pharagrap, kode anchor link yang saya sisipkan seperti ini :



<a name="satu"></a>    --> pharagrap pertama




<a name="dua"></a>    --> pharagrap kedua



<a name="tiga"></a>    --> pharagrap ketiga



Mau membuktikan? Ok, coba deh klik masing-masing link berikut :




Kembali ke pharagrap Pertama !



Kembali ke pharagrap Kedua !



Kembali ke pharagrap Ketiga !




mau lihat contoh blog yang memakai kode ini juga, silahkan klik Di sini !



Menarik bukan? Selamat mencoba

Membuat efek Marquee
Apa itu marquee ? Marquee adalah suatu program HTML untuk membuat teks bisa bergerak atau berjalan. Program marquee ini banyak diminati dan di pakai oleh para blogger di dalam blognya karena sifat program ini yang dinamis serta menarik untuk di lihat disamping untuk menghemat tempat pada halaman blog.





Marquee ini bisa di buat dengan menggunakan tag <marquee>...</marquee>.




Atribut yang sering di gunakan adalah :



BGCOLOR="warna" --> Untuk mengatur warna background (latar belakang) teks



DIRECTION="left/right/up/down" --> Mengatur arah gerakan teks




BEHAVIOR="scroll/slide/alternate" --> Untuk mengatur perilaku gerakan



Scroll --> teks bergerak berputar

Slide--> teks bergerak sekali lalu berhenti

Alternate --> teks bergerak dari kiri kekanan lalu balik lagi ( bolak-balik bo)




TITLE='pesan" --> Pesan akan muncul saat mouse berada di atas teks



SCROLLMOUNT="angka" --> mengatur kecepatan gerakan dalam pixel, semakin besar angka semajin cepat gerakannya.



SCROLLDELAY="angka" --> Untuk mengatur waktu tunda gerakan dalam mili detik



LOOP="angka|-1|infinite" --> Mengatur jumlah loop



WIDTH="lebar" --> Mengatur lebar blok teks dalam pixel atau persen





Agar lebih jelas akan saya sertakan contohnya :



Contoh marquee dari gerakan :



<MARQUEE align="center" direction="right"
height="200" scrollamount="2" width="30%">




marquee dari kanan ke kiri



</MARQUEE>



hasilnya :






marquee dari kanan ke kiri




ganti kata "left" dengan keinginan anda yaitu bisa : left, up, down .






Contoh marquee dari perilaku gerakan :



<MARQUEE align="center"
direction="left" height="200" scrollamount="3"
width="70%" behavior="alternate">




marquee menurut perilaku




</MARQUEE>







marquee menurut perilaku







Contoh marquee dengan variasi hurup dan warna latar belakang :




<div align="left">&ltFONT FACE="georgia" color="White"><B><MARQUEE BGCOLOR="RED" width="70%" scrollamount="3" behavior="alternate">




</MARQUEE></b></FONT></div>




hasilnya :




marquee dengan variasi hurup





Ada variasi lain dari marquee ini, yakni ketika mouse sedang berada di area marquee teks akan berhenti dan ketika mouse di geser kembali ketempat lain maka teks akan bergerak kembali, ini hanya di tambahkan sedikit program pada kolom marquee.




Contoh, silahkan arahkan mouse anda ke area marquee di bawah ini :



<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="50%" height="200" align="center">



silahkan tunjuk ke sini



</marquee>





hasilnya :






silahkan tunjuk ke sini







Contoh marquee yang di dalam nya terdapat link :



<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="100%" height="100" align="center">




<a href="http://rubrik-elektronik.blogspot.com" target="new">Rubrik Elektronik</a><br/>





<a href="http://electronic-rubric.blogspot.com" target="new">Electronic Rubric </a><br/>





<a href="http://kolom-iklan.blogspot.com" target="new">Kolom iklan </a><br/>




</marquee>







hasilnya :





Free Template





Kolom iklan




Kang Rohman









Mungkin itu saja beberapa contoh yang bisa di berikan, silahkan anda otak-atik sendiri agar tercipta variasi-variasi dari marquee ini.



Selamat ber eksperimen





Ingin pintar dalam bahasa HTML, silahkan download ebook nya di sini


Ingin pintar membuat website sendiri, silahkan klik di sini






Bagi yang ingin belajar PHP / HTML / MySQL dengan sangat mudah sambil langsung praktek, kang Rohman rekomendasikan anda belajar di sini   «« Ayo di klik biar situsnya keluar yahoo

Cara Mudah Mengimpor Blog Dari WordPress ke Blogger

Cara Mudah Mengimpor Blog Dari WordPress ke Blogger

Mungkin ada yang ingin memindahkan blog kita dari wordpress ke blogger. Sekarang Blogger sudah menyediakan fitur untuk memindahkan file kita dari wordpress ke blogger. Caranya gampang banget, ikuti aja ini :
  1. Login ke blog wordpress  dan menuju ke Dashboard  blog yang ingin kita transfer ke Blogger.
  2. Pilih Perkakas atau Tool.
  3. Pilih Export
  4. Download  file export WXR WordPress  dengan cara klik Download Export File.
  5. Simpan file ini ke komputer kita.
  6. Kemudian file kita konversi dengan  untuk yang menyelamatkan dokumen dengan tool seperti di bawah ini dan klik Konversi.
  7. Simpan file ini ke komputer kita. File ini akan menjadi isi posting / komentar dari WordPress di berkas ekspor Blogger.
  8. Login ke Blogger atau membuat blog baru.
  9. Setelah login, klik pada Ciptakan sebuah Blog pada dashboard, dan kemudian klik pada Impor Blog Tool
  10. Ikuti petunjuk dan upload file ekspor dari blog wordpress.
  11. Setelah menyelesaikan impor wizard, dan sekarang isi blog wordpress kita sudah pindah ke blogger.
Yang perlu diingat file yang kita pindahkan tidak lebih dari 1 MB.

hapus tanggal posting

Menghapus Tanggal Postingan

Beberapa jenis postingan tidak akan basi. Contohnya tulisan tentang tips dan tricks untuk sebuah topik. Atau artikel dengan susunan seperti wikipedia. Semakin hari, semakin dilengkapi oleh komentar dan submitter. Namun tanggal menjadi penting saat tulisan terkait dengan suatu peristiwa aktual.
Ini bisa disiasati dengan menulisnya di dalam artikel atau postingan Anda. Jika Anda masih ingin menghapus tanggal postingan,...

  • Sign in ke blogger
  • Di halaman Dashboard, klik Layout
  • Klik Edit HTML. Jangan lupa centang Expand Widgets Templates
  • Cari, lalu hapus kode <data:post.dateHeader/>
  • Klik Save Templates

hapus new and old post

Membuang newer posts dan older posts

Newer Post dan Older post adalah bawaan blogger alias default blogger. Tidak semua default pas untuk semua pengguna blogger. Dengan membuang Older Post dan Newer Post akan memfokuskan visitor blog Anda pada link yang Anda pasang, juga Iklan adsense Anda.


  • Sign in ke blogger
  • Di halaman Dashboard, klik Layout
  • Klik Edit HTML. 
  • Centang checklist di Expand widget templates
Cari kode berikut...

#blog-pager-newer-link {
Float: left;
}
#blog-pager-older-link {
Float: right;
}
#blog-pager-newer-link{
Display: center;
}

Ganti kode di atas dengan kode berikut...

#blog-pager-newer-link {
display: none;
}
#blog-pager-older-link {
display: none;
}
#blog-pager-newer-link{
display: none;
}
  • Save Templates

cara hapus tanggal postingan

Menghapus Waktu Postingan

Waktu postingan biasanya ada di bawah postingan. Penghapusan waktu postingan sebaiknya dilakukan jika konten atau artikel dirasa up to date sepanjang masa. Bisa juga karena anda memposting buanyak sekali artikel sekaligus. Dan dalam artikel² tersebut telah memuat tanggal...
  • Sign in ke blogger
  • Di halaman Dashboard, klik Layout
  • Klik Edit HTML. Jangan lupa centang Expand Widgets Templates
  • Cari lalu hapus kode berikut…
<span class='post-timestamp'>
        <b:if cond='data:top.showTimestamp'>
          <data:top.timestampLabel/>
        <b:if cond='data:post.url'>
          <a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr></a>
        </b:if>
        </b:if>
      </span>
  • Klik save Templates

cara tambah hal

Firdaus - Dunia - Surga (neraka dimana?)

Menambah Halaman Statis Pada Blogger

OPINI | 28 March 2010 | 01:30 3021 0 1 dari 1 Kompasianer menilai Bermanfaat


umlah halaman Blogspot bisa di modifikasi dengan menambah Halaman Statis. Blog dengan blogger ini bisa di set mirip seperti website dengan menambah halaman statis tersebut, yang bisa ditempatkan di bagian atas sebagai Tab, atau di sidebar sebagai tautan/link. Masuklah ke Blog anda, pilih Menu Posting, pilih Edit Laman, pilih menu Laman Baru dan mulailah meberi judul laman dan menulis isinya. Ingat Laman ini sifatnya statis, jadi isinya sebaiknya hal-hal yang bersifat tetap tidak berubah menurut waktu, seperti info blog, kontak, atau hal lain yang sifatnya tetap

Setelah memilih Laman Baru akan muncul :

Senin, 30 Mei 2011

tambah halaman

Selasa, 31 Mei 2011

Mengenal dan Menambah Halaman Elemen

Tutorial Blogger Bab 1 bag 5
Elemen Halaman selain memprcantik dan menambah berbagai asesoris di blog kita, juga merupakan fasilitas untuk memperkaya wawasan dan penampilan blog itu sendiri. seperti pemasangan label, arsip, shoubox, daftar link, photo, video dan lain-lain.
Untuk menambah halaman elemen ke dalam blog kita. pertama : klik Tab Template -> Halaman Elemen.

bisa juga membukanya lewat :
/ jika kita dalam halaman kontrol panel tekan tulisan Layout /
PanelControl01_thumb5_thumb2
/ jika kita dalam halaman blog tekan tulisan Kostumisasi di bagian atas halaman blog, yang di sebut dengan Navbar /


maka akan terlihat Halaman Elemen seperti ini.

Header : merupakan elemen untuk judul dan keterangan blog. dan kitapun bisa menambah atau menganti judul dan menambah sebuah gambar . ( lebih lanjut akan kita bahas. )
Postingan Blog : merupakan elemen postingan.
Elemen Sidebar : merupakan elemen halaman yang ada di samping kanan atau kiri postingan blog. elemen inilah yang berfungsi untuk mempercantik dan memperkaya tampilan blog kita.
Footer : merupakan elemen halaman yang berada di bagian paling bawah blog. fungsinya hampir sama dengan elemen sidebar.

ELEMEN HALAMAN SIDEBAR.

Untuk melihat, mengenal dan menambah halaman elemen, klik pada tulisan Tambahkan Sebuah Elemen Halaman yang di samping. dan akan muncul jendela baru elemen halaman untuk kita pilih dan tambahkan ke dalam blog kita.
Tampilan slide : untuk menambahkan photo-photo yang akan di tampilkan secara slide.
Polling : Untuk mengumpulkan pendapat atau polling, baik itu input kepada pengunjung tentang penilain blog kita dll.
Daftar : untuk membuat daftar ke halaman blog kita. baik itu tentang daftar cara memasak nasi goreng dll.
Daftar Link : Untuk menampilkan link-link situs favorit, juga link situs teman atau tetangga ngeblog ( yang sering di sebut dengan istilah tukeran link. artinya link blog teman ada di blog kita. begitupun alamat blog kita ada di tempat teman. )
Gambar : untuk menampilkan gambar atau photo di bagian halaman sidebar, atau di samping kolom blog kita. ( sekedar tip: masukan photo yang lebarnya kurang dari ukuran halaman sidebar.)
Teks : Untuk menampilkan pesan, kata-kata bijak dll.
Adsense : Untuk Memasang iklan dari google. setiap pengunjung menekan iklan ini. kita akan di bayar oleh pihak google.
HTML/JavaScript : Elemen ini sangat multi fungsi dan sangat berperan penuh untuk mempercantik dan memperkaya blog. karena melalui elemen ini, kita bisa menampikan shoutbox, site meter dll. ( nantinya elemen ini banyak di gunakan )
Feed : kegunaan elemen ini. Jika kita ingin berlanganan artikel atau menampilkan judul artikel yang ingin di tampilkan di dalam blog kita. ( keterangan lebih lanjut tentang Feed akan kita bahas. )
Label : untuk menampilkan label atau kategorie artikel yang kita tulis.
Newsreel : untuk menampilkan Headlines berita-berita terbaru yang di pasok dari perusahaan google.
Baris Video : untuk menampilkan baris video, baik itu video karya sendiri yang di kirim melalui YouTube atau Google video. atau karya orang lain.
Logo : merupakan logo blogger.
Profil : menampilkan informasi profile kita.
Header Halaman : merupakan elemen halaman judul dan keterangan blog kita yang secara otomatis telah di tambahkan dan bisa kita edit sesuai ke inginan kita ( lebih lanjut akan kita bahas. )

MENAMBAH ELEMEN LABEL

untuk latihan kita akan menambahkan sebuah elemen halaman label, untuk itu di bawah judul Elemen halaman Label klik tulisan Tambahkan Ke Blog.

Setelah jendela label terbuka namai kotak judul dengan Label atau kategorie.

Setelah itu klik Simpan Perubahan.
Lakukan latihan menambahkan elemen Arsip ke dalam blog. dengan cara seperti di atas.

MENAMBAH DAFTAR LINK

sedangkan untuk menambahkan Daftar Link, setelah terbuka jendela daftar link.

Judul : Isi dengan sebuah judul, misalkan Blog Teman atau Blogroll.
Menyortir : Apakah daftar link akan di tampilkan secara berurutan dari mulai A sampai Z, atau secara acak tidak bebrurutan.
Url Situs Baru : Masukan alamat situs teman kita. misalkan memasukan situs ini : http://Catalog-Tutorial.blogspot.com.
* alamat Url atau situs di awali dengan http:// atau www.
Nama Situs Baru : Masukan nama situs tersebut. misalkan Catalog-Tutorial.
Tambahkan Link : Klik tombol ini setiap kita menulis dan menambahkan daftar link.
Setelah beres klik tombol Simpan Perubahan.
Untuk mengetahui perubahannya pada blog kita klik Simpan, kemudian klik tulisan Lihat Blog. seperti gam di bawah.

elasa, 14 Juli 2009 Membuat Banner Flash secara Online

sa, 14 Juli 2009

Membuat Banner Flash secara Online

Tulisan atau tips blogger kali ini adalah tentang Membuat Banner Flash secara Online. Bagaimana cara membuat banner flash online dan memasang banner flash pada blog?. Saya ingin sedikit berbagi dengan teman-teman semua mengenai hal ini. Ada beberapa cara dalam membuat banner flash secara online, saya akan menjelaskannya satu per satu. Langkah-langkahnya cukup sederhana. Tidak diperlukan keahlian khusus untuk dapat membuatnya. Banner flash akan membuat tampilan blog lebih menawan dan juga hal ini tidak akan mempengaruhi loading blog. Dengan adanya banner flash ini loading blog kamu tidak akan menjadi lamban.

Ok langsung aja yuk masuk ke pembahasannya. Untuk membuat banner flash secara online...




Caranya adalah :

1. Kunjungi FlashVortex.

2. Lalu klik "Banner" (pada menu di atas).

3. Kemudian pilih salah satu tampilan banner dengan mengKlik tulisan "Click Here to Edit This".

4. Isi Kolom Dengan tulisan yang kamu inginkan, lalu klik "Generate Animation".

5. Kemudian Klik "Download".

Tugas kamu membuat banner flash sudah selesai. Nah sekarang tinggal bagaimana caranya memasang banner tersebut pada blog. Caranya adalah...

1. Login ke account Yahoo Geocities, klik disini. Apabila kamu belum memiliki account yahoo geocities silahkan daftar terlebih dahulu.

2. Klik "Create&Update". Tepatnya di bawah tulisan account control panel.

3. Kamu akan dibawa ke halaman baru. Langkah selanjutnya adalah klik "File Manager", lihat di dalam kotak File Management Tools.

4. Jika sudah, klik "Open File Manager". Kemudian Klik "Upload Files".

5. Masukkan file banner yang sudah kamu download tadi. Centang kedua pilihan dan klik "Upload File".

6. Apabila sudah kamu akan melihat tulisan Uploaded successfully. Langkah selanjutnya adalah Klik Create&Update > File Manager > Open File Manager. Langkah ini sama dengan langkah pada nomor 2, 3 dan 4.

7. Lihat file yang sudah kamu download tadi. Jangan diapa-apakan dulu.

8. Copy kode di bawah ini pada notePad.

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="468" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" height="60">
<param value="flashvortex.swf" name="movie"/>
<param value="best" name="quality"/>
<param value="true" name="menu"/>
<param value="always" name="allowScriptAccess"/>
<embed menu="true" pluginspage="http://www.macromedia.com/go/getflashplayer" quality="best" allowscriptaccess="always" type="application/x-shockwave-flash" height="60" src="http://www.geocities.com/arie.ajha/flashvortex.swf" width="468">
</embed></object>


Ganti Tulisan http://www.geocities.com/arie.ajha/flashvortex.swf dengan link kamu. Caranya buka lagi halaman yahoo geocities tadi dan klik view pada file yang sudah kamu download. Copy link pada browser di atas dan paste pada tulisan yang saya tebalkan, sehingga formatnya seperti kode di bawah ini.

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="468" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" height="60">
<param value="flashvortex.swf" name="movie"/>
<param value="best" name="quality"/>
<param value="true" name="menu"/>
<param value="always" name="allowScriptAccess"/>
<embed menu="true" pluginspage="http://www.macromedia.com/go/getflashplayer" quality="best" allowscriptaccess="always" type="application/x-shockwave-flash" height="60" src="http://www.geocities.com/NamaKamu/flashvortex.swf" width="468">
</embed></object>


9. Selanjutnya masuk ke account blogger kamu dan klik "customize" > "Add Page elemen". Pilih Add Java Script.

10. Masukkan kode yang sudah kamu edit lalu klik simpan. Selesai...

Kamu sudah bisa melihat hasil banner flash yang sudah kamu buat. Selamat mencoba...Salam tips blogger.

Ingin mendapat artikel seperti ini langsung ke Email anda? Silahkan masukan alamat email anda untuk berlangganan.

read more!!

Bagaimana caranya menghilangkan Tulisan "Read More" jika posting kita hanya sedikit?
Pasti pertanyaan tersebut seringkali muncul bagi beberapa orang yang sudah mencoba memakai trik Read More Versi 1 (udah baca belum? kalo belum baca baca dulu disini ), ya tho? karena aku sering mendapatkan pertanyaan seperti itu. trus gimana caranya mengatasi masalah ini?
Setelah mencoba mengotak-atik script di laboratorium, akhirnya aku menemukan formula yang cocok untuk mengatasi masalah ini. gini nih formulanya:

1. Login ke blogger, trus pilih menu "Layout --> Edit HTML"
2. Ohya, Jangan lupa di backup dulu template kamu, udah tahu to caranya?
3. Kalo udah di backup trus kasih tanda centang pada kotak "Expand Widget Template"
4. taru script berikut ini diatas kode </head>

<script type='text/javascript' src='http://www.geocities.com/kendhin_x/Readmore.js' />


5. Cari script berikut

<div class='post-body'>


kalo tidak ada coba cari yang ini

<div class='post-body entry-content'>


6. Trus ganti script tadi sehingga menjadi seperti ini

<div class='post-body' expr:id='"post-" + data:post.id'>
<b:if cond='data:blog.pageType == "item"'>


7. Nha dibawahnya kan ada script seperti ini;

<p><data:post.body/></p>


8. Taruh script berikut dibawah script diatas

<b:else/>
<style>#fullpost {display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<p><a expr:href='data:post.url'>Read More......</a></p>
</span>
<script type='text/javascript'>checkFull("post-" + "<data:post.id/>")</script>
</b:if>


9. Keseluruhan script akan menjadi seperti ini:

<div class='post-body' expr:id='"post-" + data:post.id'>
<b:if cond='data:blog.pageType == "item"'>

<p><data:post.body/></p>
<b:else/>
<style>#fullpost {display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<p><a expr:href='data:post.url'>Read More......</a></p>
</span>
<script type='text/javascript'>checkFull("post-" + "<data:post.id/>")</script>
</b:if>


10. Terus simpan pekerjaanmu.

Langkah berikutnya:

1. Pergi ke menu "Setting --> Formatting"
2. Dibagian bawah ada kota yang bertuliskan "Post Template"
3. Bagi yang belum pernah pake read more maka didalam kotak tersebut akan kosong. tapi bagi pake "Read More Versi 1" dulu tulisannya seperti ini :

<span class="fullpost">

</span>


4. Nha kalo yang sekarang ganti/isi kotak tersebut dengan kode berikut:

<span id="fullpost">

</span>

5. Terus Klik Tombol "Save".

Nha Waktu posting pilih Tabs "HTML", JIka pingin Tulisan "Read More" tidak muncul maka hapus script ini:

<span id="fullpost">

</span>
  • RSS
  • Delicious
  • Digg
  • Facebook
  • Twitter
  • Linkedin

cari

 
  • Blogroll

    Connect With Us

  • Consectetuer

    Recomended

  • terbanyak dilihat

    Instructions

  • Comments