™[]Klik Judul Postingan Untuk Melihat Isi Selengkapnya!![]™

Senin, 13 Agustus 2012

0 Cara Membuat Salam Pembuka Blog

Diposting oleh Unknown di 02.44

Caranya:

1) Sign in akun blogger

2) Dashboard > Design > Edit HTML > klik kotak "Expand Widget Templates"

3) Dengan menggunakan ctrl + F (tekan serentak pada keyboard), cari kod

]]></b:skin>


4) Kemudian, copy dan paste kod di bawah  di atas kode ]]></b:skin>



</style></head>







<script language="javascript" type="text/javascript">







/* toggle() checks to see if the images has already been faded







or not and sends the appropriate variables to opacity(); */







function toggle(el,milli) {







// Get the opacity style parameter from the image







var currOpacity = document.getElementById(el).style.opacity;







if(currOpacity != 0) { // if not faded







fade(el, milli, 100, 0);







} else { // else the images is already faded







fade(el, milli, 0, 100);







}







}







/* changeOpacity() uses three different opacity settings to







achieve a cross-browser opacity changing function. This







function can also be used to directly change the opacity







of an element. */







function changeOpacity(el,opacity) {







var image = document.getElementById(el);







// For Mozilla







image.style.MozOpacity = (opacity / 100);







// For IE







image.style.filter = "alpha(opacity=" + opacity + ")";







// For others







image.style.opacity = (opacity / 100);







}







/* fade() will fade the image in or out based on the starting







and ending opacity settings. The speed of the fade is







determined by the variable milli (total time of the fade







in milliseconds)*/







function fade(el,milli,start,end) {







var fadeTime = Math.round(milli/100);







var i = 0; // Fade Timer







// Fade in







if(start < end) {







for(j = start; j <= end; j++) {







// define the expression to be called in setTimeout()







var expr = "changeOpacity('" + el + "'," + j + ")";







var timeout = i * fadeTime;







// setTimeout will call 'expr' after 'timeout' milliseconds







setTimeout(expr,timeout);







i++;







}







}







// Fade out







else if(start > end) {







for(j = start; j >= end; j--) {







var expr = "changeOpacity('" + el + "'," + j + ")";







var timeout = i * fadeTime;







setTimeout(expr,timeout);







i++;







}







}







}







</script>







<div class="input" onClick="javascript:toggle('wise', 3000); this.style.display='none';







document.getElementById('june').style.display=''">







<center><img src="Url agan"







style="opacity:0.4;filter:alpha(opacity=40)"







onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"







onmouseout="this.style.opacity=0.7;this.filters.alpha.opacity=40"/></center>







</div>







<div id="wise" style="filter : alpha(opacity=0); -moz-opacity : 0; opacity : 0;">







<div id="june" style="display : none;">







<body>
NB: Pada Url agan, kalian pasang URL gambar kalian masing"
atau gunakan gambar yg sudah saya siapkan buat kalian
tinggal COPY link nya di bawah ini
http://img811.imageshack.us/img811/2034/74209346.png




http://img830.imageshack.us/img830/7516/64141948.png


http://img190.imageshack.us/img190/2280/87105761.png




http://img42.imageshack.us/img42/2760/13929553.gif





http://img831.imageshack.us/img831/7031/46029943.gif






http://img821.imageshack.us/img821/1397/61645383.png


http://img827.imageshack.us/img827/2415/47060660.gif


5) klik SAVE

Tetaplah beriimajinasi

Jumat, 10 Agustus 2012

0 Cara Buat Read More Otomatis DI Blog

Diposting oleh Unknown di 21.34

Sharing Successful!

Share again!You've successfully shared using Po.st!
Welcome to po.st!
Powered by Po.stPrivacy policy
read more,baca selengkapnya,cara buat read more,cara buat baca selengkapnya,auto read more, read more otomatis, cara buat read more otomatis

Expandable post atau yang umum di kenal dengan istilah "Read More" adalah sebuah fitur yang membuat postingan sobat blogger terpenggal di halaman index Beranda atau Home Page. Di setiap akhir preview, terdapat sebuah link yang menuju ke halaman posting, yang biasanya menempel pada kata "Read More" atau "Baca Selengkapnya".

Perbedaan antara Read More konvensional dengan Read More Otomatis dengan thumbnail adalah :


Read More Konvensional :
  1. Menggunakan HTML
  2. Harus memasukkan kode di dalam postingan
  3. Panjang potongan atau penggelan dapat disesuaikan.
  4. Fungsi Read More hanya akan terlihat kalau kode sudah ditambahkan di dalam postingan.
  5. Tanpa Thumbnail. Untuk menampilkan thumbnail atau gambar, maka gambar harus diletakkan dibagian paling atas postingan.

Read More Otomatis dengan thumbnail :
  1. Menggunakan Javascript.
  2. Tidak perlu memasukkan kode di dalam postingan.
  3. Panjang potongan dapat di ubah, tetapi akan berpengaruh di semua postingan.
  4. Read More diterapkan untuk semua posting, tanpa terkecuali.
  5. Secara otomatis menampilkan thumbnail atau gamabar yang ada di dalam postingan tersebut.

Itu adalah sekilas gambaran tentang perbedaan antara Read More Konvensional dengan Read More Otomatis dengan thumbnail. Untuk membuat Read More otomatis atau untuk membuat fitur baca selengkapnya, silahkan ikuti langkah di bawah ini!

Cara Buat Auto Read More :
  • Login dulu di akun blogger sobat
  • Dari Design, klik Edit HTML dan tandai Expand Widget Template
  • Back Up terlebih dahulu template sobat.
  • Cari kode </head>
  • Tambahkan kode berikut Setelah atau di bawah kode </head>
<!-- Auto read more script Start -->
<script type='text/javascript'>
var thumbnail_mode = "yes"; //yes -with thumbnail, no -no thumbnail
summary_noimg = 430; //summary length when no image
summary_img = 340; //summary length when with image
img_thumb_height = 200;
img_thumb_width = 200;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx =  s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}
function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
        if(thumbnail_mode == "yes") {
if(img.length>=1) { imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}
}
var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>
<!-- Auto read more script End -->
  • Setelah itu, cari kode <data:post.body/>
  • Ganti kode <data:post.body/> dengan kode berikut :
<!-- Auto read more Start -->
<!-- http:lenterablogger.blogspot.com -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<data:post.body/>
<b:else/>
<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>
<a class='more' expr:href='data:post.url'>Read more ...</a>
</b:if>
</b:if>
<!-- Auto read more End -->
  • Klik Preview, kalau sudah berhasil klik Save

0 Membuat Pesan Atas Kolom Komentar

Diposting oleh Unknown di 21.31
Pesan komentar, tulisan komentar, komentar,komentar blogger,blogger comment,comment,comment collumn,kolom komentar,komentar blog,komentar blogspot

Cara membuat pesan di atas kolom komentar adalah Tips Trik Blogspot yang akan saya share kali ini. Sebelum kita ke praktiknya, baca terlebih dahulu ulasan singkat di bawah ini.
Bagi beberapa orang (Pemilik blog), menulis pesan di atas kolom komentar sangat penting karena dengan adanya pesan, apalagi kalau pesan tersebut menggunakan pilihan kata yang tepat akan memberikan motivasi bagi pengunjung blog kita untuk memberikan tanggapan terhadap postingan blog kita yang telah mereka baca. 
Itu adalah alasan singkat sehingga saya membuat sebuah pesan di atas di atas kolom komentar saya. Apakah sobat blogger tertarik untuk membuat pesan singkat di atas kolom komentar? Kalau tertarik, ikuti langkah di bawah ini:

Pesan komentar, tulisan komentar, komentar,komentar blogger,blogger comment,comment,comment collumn,kolom komentar,komentar blog,komentar blogspot

Cara Membuat Pesan di Atas Kolom Komentar Blog :
  • Login di blogger.com
  • Pada Menu Drop Down klik Settings
  • Klik Posts and comments
  • Tarik scrolling bar ke bawah sampai melihat Comment Form Message
  • Di dalam Comment Form Message, letakkan Pesan sobat blogger.
Pesan komentar, tulisan komentar, komentar,komentar blogger,blogger comment,comment,comment collumn,kolom komentar,komentar blog,komentar blogspot
  • Kalau sobat blogger sudah menulis pesan, Lihat ke atas dan klik Save settings.
  • Buka salah satu postingan sobat blogger untuk melihat hasilnya.

Untuk memodifikasi pesan tersebut sobat blogger bisa menggunakan kode ini:

Untuk membuat tulisan Bold, gunakan kode ini
<b> Teks sobat disini </b>
Contoh : <b>Lentera Blogger</b>
Hasilnya seperti ini : Lentera Blogger

Untuk membuat tulisan Miring, gunakan kode ini
<i> Teks sobat disini </i>
Contoh : <i>Lentera Blogger</i>
Hasilnya seperti ini : Lentera Blogger


Saya yakin, sobat blogger pasti lebih faham dengan semua itu. Terima kasih atas kunjungannya.

0 Cara Buat Burung Twitter Terbang

Diposting oleh Unknown di 21.29
Twitter,twitter,floating twitter Bird,twitter bird,burung twitter,tweet,flying twitter bird,bird

Twitter merupakan jejaring sosial milik Twitter Inc. Menurut data dari Alexa Top Sites tertanggal 5 Mei 2012, Twitter menempati pringkat ke delapan sebagai situs web yang paling banyak dikunjungi setelah Google, Facebook, YouTube, Yahoo!, Baidu.com, Wikipedia dan Windows Live. Twitter adalah social network yang sangat bagus untuk dijadikan media untuk mempromosikan produk yang kita miliki, baik produk yang berupa barang atau situs web/blog, karena pengguna Twitter sampai saat ini lebih dari 200 juta pengguna.
Salah satu cara yang bisa kita gunakan untuk mempromosikan blog kita atau untuk memperkenalkan blog kita di jejaring sosial twitter adalah dengan cara memasang Twitter flying bird atau Burung Twitter Terbang di blog. Dengan memasang Twitter flying bird di blog, akan memungkinkan pengunjung blog kita untuk melakukan Tweet terhadap blog kita atau menjadi follower kita di Twitter.

Cara Memasang Burung Twitter Terbang :
  • Sign In di blogger.com
  • Dari menu Drop Down, Klik Layout
  • Kemudian klik Add a gadget dan pilih HTML/JavaScript
  • Copy paste kode berikut pada kolom yang tersedia :
<!-- floating twitter Bird -->
<script type="text/javascript" src="http://bloggerpeer.googlecode.com/files/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgC8-f-gXwbh303UEcA4eCsLD5JdHASI1jdqohioxG3-RCXA3-Tn51POQanSThzaCmpeulqQ5sekioV47luDIuk2N0Yq9t5yTY429zjMks2sR_z3kTkBI0GjHSpTh__0uZH9mZ-V5kOwCQ/s1600/burung+twitter+terbang.png";
var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span");
var twitterAccount = "http://twitter.com/LenteraBlogger";
var tweetThisText = "Twitter - UserID http://bloggerpeer.blogspot.com/";
tripleflapInit();
</script>
  • Terakhir, klik Save/Simpan

Untuk Tambahan :
Ganti http://twitter.com/LenteraBlogger Twitter sobat dengan URL akun Twitter sobat
Kalau warna burung twitter tersebut tidak sesuai dengan background blog sobat, silahkan ganti URL berikut
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgC8-f-gXwbh303UEcA4eCsLD5JdHASI1jdqohioxG3-RCXA3-Tn51POQanSThzaCmpeulqQ5sekioV47luDIuk2N0Yq9t5yTY429zjMks2sR_z3kTkBI0GjHSpTh__0uZH9mZ-V5kOwCQ/s1600/burung+twitter+terbang.png
dengan URL yang sudah kami sediakan di bawah ini :

Burung Twitter Terbang Warna Kuning
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCbz0UhAAoKFUQ5Gf-LYSnQbwbnn3Jo3rCO25K0-a4nsbVIhC7pxJdeWgQVDiFMmLMedZmhyphenhyphen2JnxmGcily2TFJ5GMtS1jyqn4bhcTleBvc5oAwcHLZzoemOU695FNvOFi9CKN2pOkLVuQ/s1600/yellow+bird.png

Burung Twitter Terbang Warna Hitam
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiY_MQFdCCSr5EeRo-tfDFpH9hq1Y7KNFNiZjAsTXXQWFDxTHjFQK9-i7spCUkBjbud1-P-uffF4qQvs0dWqClbimXBn-iDd2rQ1uFAZy8adPqb-trbRJGmBTHrOIgismtIdSdxpX60D7U/s1600/black+bird.png

Burung Twitter Terbang Warna Biru
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUX_bRrFS4NBW-k_RlabpyJNapekhUSlu1ORskeksM7ALfJgHN9piIOj1KM8lO9CyL_kTo5EaD7Rd6Gq5xXiBifSUuSSnss2Tq0HI3T8jpPQgFHXUo_ZpjkE6316M1t-I5s-VKGE6eya0/s1600/Blue+bird.png

Burung Twitter Terbang Warna Coklat
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrN8kwZFKVWgBbIytyPed8agMNrxrIjIjG3P8ip5OYgWgcvfeF5A291UdyvkvJboAt9aJXeHaSw4BNJVzCDHd2NWF8p9eXzB3jpeEYpFPfDnhMTuL9H2cYwFTKfIxj2KO5il6mTSc8iqM/s1600/brown+bird.png

Burung Twitter Terbang Warna Hijau
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiONob730sC6DgGzyQti7jZyJBWileWeyLBqUdYdYtuXz6uvrUpIJYBd7RGtciFnqmQtxt4A1EaXkX0hzpYiRH2mQT_htTxtK2ve24ZfKutYskQeAnyQ9aX750c5GVUHLSAZrTyugstpBM/s1600/Green+bird.png

Burung Twitter Terbang Warna Ungu
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhN7EYieq9nWXYyYUI4RartdbzChzNKnrsGRsUJRpbT281_606DK0BVCQj7AZ6-gyPHpRNJwDwgrLFsbQIsnoIZL-tD41UPINsjoPJg6QuarsHd0sv9In-pZNzju7mAUucwjypw6cx83OA/s1600/purple+bird.png

Burung Twitter Terbang Warna Putih
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjO9oMf_66Vh7ZUqunn9D7AwRjZNvNMdqfHyrKUnlp9Zd6H1-kxDT4qe4AIiedfdbaQ_L6Y-KFfT4J_f945ScogyB4iHaCiBRAq4H29iHCDvxT9uZMqHQA9ziB0L-bKNnz9GnxT7BJGsdQ/s1600/white+bird.png

Burung Twitter Terbang Warna Merah
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiypoN-jlKcBySHubnjpwOUhD6VWRyUrY27c1VA0zEXjSOFjlSHftUrrliO_Z7Jir2plhmE-4OuFYx5rgyukA_bmDm0oJcdCGuu-LbvxTKEweSPGBL4w9FXDu9PwwV4Zmfd7XZz4Nt9dr0/s1600/red+bird.png

0 Cara Buat Salam Pembuka Pada Blog

Diposting oleh Unknown di 21.27
Apakah sobat blogger pernah berkunjung ke suatu blog, kemudian di blog tersebut muncul pesan konfirmasi seperti ini : Nama anda siapa, Salam kenal ya dan Selamat browsing di blog saya...? Pesan konfirmasi seperti ini, terkadang menambah keunikan dari blog yang memasang pesan konfirmasi ini. Tapi tidak jarang juga, pesan konfirmasi seperti ini membuat pengunjung blog kita merasa tidak nyaman.

Pesan Konfirmasi,salam pembuka,Cara membuat Salam Pembuka,Cara membuat Pesan Konfirmasi

Pesan Konfirmasi,salam pembuka,Cara membuat Salam Pembuka,Cara membuat Pesan Konfirmasi

Pesan Konfirmasi,salam pembuka,Cara membuat Salam Pembuka,Cara membuat Pesan Konfirmasi

Fitur blog yang berupa Pesan konfirmasi sering juga di sebut dengan Fitur Salam Pembuka. Memasang Pesan Konfirmasi atau memasang salam pembuka di blog tidaklah sulit. Apakah kit harus Edit Template blog kita? Tidak juga, kita hanya menambahkan sedikit kode di kolom Widget. Berikut panduan singkat tentang Cara Buat pesan Konfirmasi di Blog.

Cara buat Salam Pembuka di Blog :
<script type='text/javascript'>
var name = prompt("Welcome!! Nama anda siapa", "Nama Anda ");
alert("Salam kenal ya "+name)
alert("Selamat browsing di blog saya, senang berkenan!")
</script>
  • Klik Save/Simpan.

Tambahan :
Untuk tulisan yang bercetak tebal dan berwarna merah tersebut, sobat blogger bisa rubah sesuai dengan keinginan blog sobat. But you must remember, make polite message! Don't make inpolite message! (Bingung apa artinya kalimat itu?). Mamfaatkan saja Google Terjemahan milik Google.

0 Cara Membuat Efek Link Pelangi Pada Blog

Diposting oleh Unknown di 21.22
  • Kunjungi blogger.com
  • Di Menu Drop Down klik Layout ---> Add a gadget ---> HTML/JavaScript
  • Lalu Copy Paste kode berikut pada kolom yang tersedia :
<script src="http://tutorialblogspot.googlecode.com/files/LinkPelangi.js" type="text/javascript"></script>
  • Klik Simpan.

Tambahan :
Saat sobat blogger memasukkan kode tersebut, jangan kasih Title atau Judul pada kolom pertama, biarkan kosong.  .

0 Membuat Templates Mudah Dengan Templates Designer

Diposting oleh Unknown di 07.23
Salah satu fitur terbaru blogger adalah Templates Designer. Dengan fitur ini memungkinkan kita dalam membuat/memodifikasi templates. Dengan fitur ini anda bisa mengatur tata letak/layout blog anda dengan mudah, mengganti design blog anda, dll. Oke tidak usah panjang lebar, mari kita bahas fitur terbaru ini satu per satu :



1. Silahkan Log in ke blog anda > Design > Templates Designer
2. Jika Sudah, mari kita bahas satu per satu fitur dan fungsinya




Templates : Di sini anda bisa memilih templates sesuai keinginan anda. Ada 6 templates tersedia dan di setiap templates masih terbagi beberapa model lagi. Untuk contoh saya akan menggunakan templatesPicture Windows


Background : Setelah anda memilih templates, anda dapat memilih background sesuai keinginan. Klik Background Image untuk memilih background. Ada 19 tema background, dan di setiap tema terdapat banyak background yang bisa anda pilih.

Ini adalah tampilan yang akan muncul saat anda mengklik Background Image
Layout : Layout terbagi menjadi 3, dan yang ini adalah body layout. Body Layout ini berfungsi untuk mengatur tata letak blog anda di bagian sidebar dan posting. Dengan ini anda dapat mengatur model sidebar dengan mudah.
Layout bagian ini adalah footer layout. Di sini anda dapat mengatur jumlah dan model footer dengan mudah. Misalnya anda ingin membuat footer anda 1 kolom, 2 kolom, atau 3 kolom sekalipun.
Layout ke tiga adalah adjust width. Di sini anda dengan mudah dapat mengatur lebar blog anda secara keseluruhan dan lebar sidebar juga.
Advanced : Di sini anda dapat mengatur segalanya seperti model text, warna text, penambahan CSS, dan lain-lain. Daftar Advanced berbeda-beda sesuai templates yang anda pilih tadi. Karena saya memilih model Picture Windows saya akan membahas Advanced ini saja.




  1. Page Text : Berfungsi untuk mengatur jenis font, warna text, ukuran, dan juga model seperti bold / italic
  2. Backgrounds : Berfungsi untuk mengatur warna background di bagianouter, header, dan post.
  3. Links : Berfungsi untuk mengatur warna link. Link Color adalah warna link sebelum di klik, Visited Color warna link setelah/sudah pernah di klik, Hover Color warna link saat di sentuh mouse.
  4. Blog Title : Untuk mengatur jenis, ukuran, model, dan warna font judul blog (header)
  5. Tabs Text : Beberapa dari anda mengukin belum tau tabs text. Tabs Text adalah gadget yang terletak di antara header dan isi blog. Ini berfungsi untuk mengatur jenis, ukuran, model, dan warna font pada tabs.
  6. Tabs Background : Untuk mengatur background tabs. Background Color untuk background gadget. Selected Color ini berfungsi untuk mengatur warna background tabs yang sedang di pilih. Maksudnya yang di pilih adalah jika anda menggunakan Pages blogger dan di letakan di bagian tabs.
  7. Post : Title Font untuk mengatur font judul post. Footer Text untuk mengatur warna pada bagian footer post/bawah post. Border Color untuk mengatur warna garis tepi post.
  8. Gadgets : Title Font untuk mengatur jenis font pada judul sidebar/gadget. Title Color untuk mengatur warna judul sidebar/gadget
  9. Footer : Text Color untuk mengatur warna text di bagian footer. Gadget Title Color untuk mengatur warna pada judul gadget di bagian footer
  10. Footer Link : sama dengan link, hanya yang ini untuk mengatur link bagian footer saja.
  11. Add CSS : Ini berguna jika anda ingin menambah, menghapus, dan memodifikasi CSS pada templates anda
3. Jika Sudah selesai dengan modifikasi templatesnya, Silahkan kilik APPLY TO BLOG untuk savenya
Langganan: Postingan (Atom)
 
-=™Ryan"BLog™=- All Right Reserved | Copyright © 2011 by Drs-Ryan Alfryansah | Designer Template by Ryan Blog™ & SMRS Community