| Enal | Trik-Trik Blogger | SEO Blogspot: 06/01/2010

Selasa, 29 Juni 2010

Cara Mengganti Background Pada Blog

Cara Mengganti Background Pada Blog
Dalam posting kali ini saya akan menunjukkan Cara Mengganti Background Pada Template Blog. Pada umumnya template yang kita download memiliki background yang sudah cukup bagus, tapi mungkin masih ada sebagian Blogger yang ingin menggantinya dengan background kreasi sendiri dengan menambahkan gambar animasi bergerak juga bisa kita lakukan.

Baiklah tanpa basa-basi lagi saya akan memberikan triknya..

Seperti biasa Log in ke Blogger anda.
Pilih Dashboard Blogger anda
Kemudian [klik] Layout - Edit HTML. Untuk berjaga-jaga sebaiknya backup dulu template anda.
Kemudian carilah kode ini body { :

Lihat contoh di bawah ini :

body {

background:#000000 url('http://i1185.photobucket.com/albums/z354/Enal_Rhay_SyahRenggan/th_EnalRhaySyahRinggan1.jpg');

margin:0;

Ket :

1. Kode yang berwarna merah (#000000) adalah kode warna (Boleh di ubah
sesuai selera anda).

2. Kode yang ini (http://i1185.photobucket.com/albums/z354/
Enal_Rhay_SyahRenggan/th_EnalRhaySyahRinggan1.jpg) adalah alamat
Url Gambar, Anda juga bisa menggantinya dengan Url gambar pilihan anda.

Setelah diganti, anda lihat dulu [klik] Pratinjau, jika berhasil [klik] Simpan Template

Selamat mencobanya....!!!!!

EnaL Rhay SyahRinggan Next..>>

Minggu, 27 Juni 2010

Membuat Tulisan Address Bar Berjalan

Membuat Tulisan Address Bar Berjalan

Hay,, Sobat Blogger....

Okey, kali ini saya akan memberikan tips-tips memodifikasi blogger. Salah satunya yaitu tentang bagamana cara membuat posting sahabat blogger agar tampak lebih menarik para pengunjung. Dalam posting kali ini saya akan membahas tentang Cara Membuat Tulisan Address Bar Berjalan.........!!

Selama ini kita hanya bisa membuat tulisan berjalan dengan merquee di area blog, seperti di postingan, sinebar, footer, header, dll. Tapi,untuk kali ini sobat bisa menerapkannya di address bar Blog sobat. Tulisan ini berjalan tanpa hentinya di address blog sobat sehingga tampak kelihatan menarik/terkesan melihatnya dan pengunjung pun tidak akan bosan.

Sobat bisa mengganti tulisan yang berjalan sesuai dengan keinginan sobat...
Untuk sobat, ini tidak terlalu sulit kita hanya menambahkan sedikit kode CSS di template kita. Dari pada penasan langsung aja ya di praktekkan.

Jika sobat Blogger tertarik, silahkan ikuti langkah-langkahnya.
Okey,, langsung ajah sahabat blogger :

Seperti biasa Log in ke Blogger anda. => Blogger.com
Pilih Tata Letak/Edit HTML.
Cari Kode </head> dan
Copy script di bawah ini kemudian pastekan tepat di atas kode </head>

Ket :

Lihat Tulisan yang berwarna biru, sobat bisa menggantinya sesuai keinginan sobat dan itulah tulisan yang akan muncul di Address bar sobat.

4. Simpan Template.

Wetzzzzzzz...Ingat, tinggalkan Commennya juga yach...

EnaL Rhay SyahRinggan Next..>>

Selasa, 15 Juni 2010

Membuat Judul Posting Berjalan

Cara Membuat Judul Posting Berjalan

Dalam posting yang kali ini saya buat yaitu membahas tentang bagamana cara membuat judul postingan bisa bergerak/berjalan....???

Okey,, dengan cara yang sederhana untuk membuat judul posting pada blog berjalan.....Hasil yang nanti akan kita dapat sama seperti membuat teks berjalan dengan kode marquee atau seperti judul blog berjalan yang menggunakan Java script.

Baiklah tanpa basa-basi lagi saya akan memberikan triknya..

Seperti biasa Log in ke Blogger anda.
Pilih Dashboard Blogger anda
Kemudian klik Layout - Edit HTML. Untuk berjaga-jaga sebaiknya backup dulu template anda.
Klik pada Expand widget templates dan carilah kode dibawah ini:

<b:includable id='post' var='post'>
<div class='post hentry uncustomized-post-template'>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>

Kemudian pasangkan kode marquee sehingga kode lengkap..
Dan hasil perubahan akan seperti dibawah ini:

<b:includable id='post' var='post'>
<div class='post hentry uncustomized-post-template'>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<marquee direction='left'><h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3> </marquee>
</b:if>

Ket :

Teks yang berwarna merah adalah kode yang harus anda tambahkan. Anda dapat merubah arah dengan mengganti kode left menjadi right.

Klik tombol Preview untuk melihat hasilnya.

Jika hasilnya memuaskan maka silahkan simpan hasil kerja anda.

Selamat Mencoba...........!!!!!!!!

EnaL Rhay SyahRinggan Next..>>

Cara Membuat Posting Title Berjalan

Cara Membuat Posting Title Berjalan

Hay,, Sahabat Blogger....

Recent Post Title ini merupakan tool yang bukan hanya menampilkan judul-judul posting kita yang baru bahkan judul-judul posting lama kita pun akan muncul, jadi posting-posting lama kita bisa dilihat lagi dech sama pengunjung Blogger.

Code Recent Post ini akan menghasilkan daftar-daftar posting yang berurutan kesamping, agar dapat menghemat ruang pada blog kita.

Jika sahabat Blogger tertarik pada Recent Post Title ini silahkan ikuti langkah-langkahnya.

Okey,, langsung ajah sahabat blogger :

Seperti biasa Log in ke Blogger anda.
Pilih Tata Letak/Layout.
Pada halaman Page Element/Elemen Laman, klik Add a Gadget.
Pilih HTML/Javascript.
Copy code di bawah ini dan paste ke dalam HTML/Javascript tersebut.

<div  style="text-shadow:4px 4px 4px #adadad; font-size: 14px; COLOR:  black;"><b>Recent Posting :</b></div> <div style="border: 3px dashed black; background: #ffffff; padding:2px; width:350px; font-size: 17px; color:red;"> <b> <script type="text/javascript"> function getYpipeTL(feed) { document.write('<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2">'); var i; for (i = 1; i < feed.count ; i++) { var href = "'" + feed.value.items[i].link + "'"; var pTitle = feed.value.items[i].title + "</a> | "; var pComment = " \(" + feed.value.items[i].commentcount + " comments\)"; var pList = "</a>" + "<a href="+ href + '">' + pTitle; document.write(pList); document.write(pComment); document.write('</a></li>'); } document.write('</marquee>'); } </script> <script src="http://pipes.yahoo.com/pipes/pipe.run? YourBlogUrl=http://nama-blog-anda.blogspot.com &Order=alphabet &_id=401e43055731c1a29f1e1d3eb5e8e13f &_callback=getYpipeTL &_render=json" type="text/javascript"></script> <span style=" float:right;"><a href="http://blogenalrhaysyahringgan.blogspot.com/2011/06/cara-membuat-posting-title-berjalan.html"> Want to take</a></span> </b></div>

Ganti angka (350) di atas sesuai ukuran yang anda inginkan.
Ganti tulisan (http://nama-blog-anda.blogspot.com) dengan alamat URL Blog anda.
Angka 2 pada (scrollamount="2") menerangkan kecepatan, bisa anda sesuaikan dengan keinginan anda.
Tekan SAVE untuk menyimpannya.
Nah....Coba anda lihat hasilnya.....

EnaL Rhay SyahRinggan Next..>>

Sabtu, 12 Juni 2010

Mengubah Blog No Follow Menjadi Do Follow

Dalam posting kali ini saya akan membahas tentang masalah bagaimana cara merubah no follow menjadi do follow...?? Bagi sobat blogger yang dah senior sich menganggap posting ini tidak populer lagi, tapi ini juga bisa berguna bagi sobat blogger pemula seperti saya ini.

Nach,,,timbul dech pertanyaan.....
"Apa sich kegunaan dari do follow itu...?? Apa untungnya buat blog kita..??" Pusing juga tuh.... pertama kali dapat pertanyaan kayak gitu...!! Tapi akhirnya saya dapat juga jawabannya dech...

Kegunaan dari Do Follow yaitu :

Google dapat mendeteksi alamat blog yang berkomentar menjadi linkback.
Bisa meningkatkan jumlah komentar, karena dengan meninggalkan komentar bisa meningkatkan jumlah backlink ke blog sahabat yang memberikan komentar pada blog kita.
Dan tentunya page rank kita akan cepat meningkat karena makin banyak backlink.

Jika sobat Blogger tertarik, silahkan ikuti langkah-langkahnya.
Okey,, langsung ajah sahabat blogger :

Seperti biasa Log in ke Blogger anda. [klik]=> Blogger.com
Pilih Tata Letak/Edit HTML.
[Klik] Download Full Template untuk mem-backup template sobat jika terjadi kesalahan.
Beri tanda centang pada Expand Template Widget.
Cari Kode di bawah ini :

<a expr:href='data:backlink.url'rel='nofollow'><data:backlink.title/></a>

Jika sudah ketemu hapus tulisan yang berwarna merah sehingga akan menjadi seperti dibawah ini :

<a expr:href='data:backlink.url'><data:backlink.title/></a>

Kemudian cari lagi code seperti dibawah :

<a expr:href='data:comment.authorUrl'rel='nofollow'><data:comment.author/></a>

Jika sudah ketemu hapus tulisan yang berwarna merah sehingga akan menjadi seperti dibawah ini :

<a expr:href='data:comment.authorUrl'><data:comment.author/></a>

Nach jika sudah, [klik] Save Template.

Simpan juga Commennya yach...!!!

EnaL Rhay SyahRinggan Next..>>

Rabu, 09 Juni 2010

Cara Memasangkan Feed ke Blog

Cara Memasangkan Feed ke Blog

Bagaimana caranya kita dapat mengetahui perkembangan atau update terbaru dari blog yang kita inginkan, apa ada yang bisa kita pasangkan/memasang sesuatu pada blog kita sendiri agar dapat melihat perkembangan Update terbaru yang kita inginkan....>>

Ok...Sobat blogger dapat melihat semua perkembangan Update terbaru pada blog sobat dan hanya dengan satu cara yaitu memakai RSS feed.

Apa itu RSS?

RSS singkatan dari Rich Site Summary atau jika dalam bahasa indonesia adalah ringkasan dari isi sebuah situs dan Blog juga menjadi salah satu yang termaksud di dalamnya Feed.

Dalam posting berikut ini, saya akan membahas tentang Cara Memasangkan Feed ke Blog. Bagi sobat yang ingin tahu lebih lanjut tentang masalah di atas sobat bisa membacanya di RSS-Wikipedia.

Sekarang bagaimana cara memasang kode feed di blog milik kita.....???

Bagi anda yang menggunakan template baru atau new blogger template caranya sangat mudah. Silahkan ikuti langkah-langkah berikut ini :

Log in ke Blogger Anda.
Pilih Tata Letak.
Tambah Gadget dan pilih Feed.
Tulis alamat ini pada kotak di samping tulisan URL feed (http://blogenalrhaysyahringgan.blogspot.com/atom.xml)
Klik tombol Simpan.
Pindahkan Gadget yang baru saja di buat pada tempat yang dikehendaki
Klik tombol Simpan
Klik tulisan Lihat Blog untuk melihat hasil penambahan elemen yang baru di buat
Selesai....!!!

Ok....Lanjut...>>>

Bagi sobat yang lebih mengutamakan penampilan, spring widget telah membuat suatu panel yang sangat unik sehingga akan bisa di jadikan sebagai aksesori blog (untuk template baru).

Apabila sobat tertarik memasangnya... silahkan ikuti langkah-langkah berikut :

Log in ke Blogger Anda.
Pilih Tata Letak.
Tambah Gadget dan pilih HTML/JavaScript.
Copy paste code script di bawah ini....(paste ke HTML/JavaScript anda)

5. Klik tombol Simpan.

6. Pindahkan Gadget yang baru saja di buat pada tempat yang dikehendak.

7. Klik tombol Simpan.

8. Klik tulisan Lihat Blog untuk melihat hasil penambahan elemen yang baru di buat.

9. Selesai....!!!!!!!

* Keterangan :

Mengatur menu setting agar bisa menampilkan feed. Langkah-langkahnya yaitu :

Log in ke Blogger Anda.
Pilih Tata Letak.
Klik menu Pengaturan.
Klik menu Feed situs
Klik menu dropdown di samping tulisan Ijinkan Feed blog
Pilih yang Penuh
Klik tombol Simpan Setting
Selesai....!!!!

EnaL Rhay SyahRinggan Next..>>

Cara Mengganti Icon Cursor Pada Blog

Cara Mengganti Icon Cursor Pada Blog

Selamat datang di Blog Enal Rhay SyahRingGan.....!! Mau modifikasi blogger anda....???
Nach sekarang saya nemuin cara memodifikasi blogger.

Dalam posting kali ini saya akan membahas tentang cara memodifikasi blogger anda, Cara yang satu ini termaksud g' sulit kok... Kamu ikutin aja langkah-langkah Cara Mengganti Icon Cursor Pada Blog.

Nach Langkah-langkahnya seperti biasa....yang harus anda lakukan..:

Log in ke Blogger Anda.
Pilih Tata Letak.
Tambah Gadget dan pilih HTML/JavaScript.
Copy paste code script di bawah ini....(paste ke HTML/JavaScript anda)

<style type="text/css">body {cursor:url("http://img2.enal.com/img/icon18_rhay_allbkgsyahrenggan.png"),default}</style>

* Ket :

Ganti tulisan "http://img2.enal.com/img/icon18_rhay_allbkgsyahrenggan.png" dengan alamat URL Cursor Anda...

     5. Save...Selesai dech.....!!!!

         Coba dech kamu lihat hasilnya......!!!

EnaL Rhay SyahRinggan Next..>>

Cara Membuat Animasi Tulisan Pada Kursor (Berputar-putar)

Cara Membuat Animasi Tulisan Pada Kursor (Berputar-putar)

Nah...Sekarang saya mau ngasih tau bagaimana Cara Membuat Tulisan Bergerak Pada Kursor (Animasi) Blog... Sesuai dengan permintaan dari sahabat blogger yaitu Cara Membuat Animasi Tulisan Pada Kursor (Berputar-putar) pada blog.

Malas rasanya nge-blogging tanpa ada modifikasi-modifikasi keren pada blog anda. Maka dari itu di posting kali ini saya akan membahas tentang Cara Membuat Animasi Tulisan Pada Kursor (Berputar-putar) pada blog.

Contohnya bisa anda lihat pada gambar di bawah ini..:

Langka-langkah yang harus anda lakukan..:

Log in ke Blogger Anda.
Pilih Tata Letak.
Tambah Gadget dan pilih HTML/JavaScript.
Copy paste code script di bawah ini....(paste ke HTML/JavaScript anda)

<style type="text/css">
/* Circle Text Styles */
#outerCircleText {
/* Optional - DO NOT SET FONT-SIZE HERE, SET IT IN THE SCRIPT */
font-style: italic;
font-weight: bold;
font-family: 'comic sans ms', verdana, arial;
color: #999;

/* End Optional */

/* Start Required - Do Not Edit */
position: absolute;top: 0;left: 0;z-index: 3000;cursor: default;}
#outerCircleText div {position: relative;}
#outerCircleText div div {position: absolute;top: 0;left: 0;text-align: center;}
/* End Required */
/* End Circle Text Styles */
</style>
<script type="text/javascript">

/* Circling text trail- Tim Tilton
Website: http://www.tempermedia.com/
Visit: http://www.dynamicdrive.com/ for Original Source and tons of scripts
Modified Here for more flexibility and modern browser support
Modifications as first seen in http://www.dynamicdrive.com/forums/
username:jscheuer1 - This notice must remain for legal use
*/

;(function(){

// Your message here (QUOTED STRING)
var msg = "***eNaL Rhay SyahRingGan***";

/* THE REST OF THE EDITABLE VALUES BELOW ARE ALL UNQUOTED NUMBERS */

// Set font's style size for calculating dimensions
// Set to number of desired pixels font size (decimal and negative numbers not allowed)
var size = 24;

// Set both to 1 for plain circle, set one of them to 2 for oval
// Other numbers & decimals can have interesting effects, keep these low (0 to 3)
var circleY = 0.75; var circleX = 2;

// The larger this divisor, the smaller the spaces between letters
// (decimals allowed, not negative numbers)
var letter_spacing = 5;

// The larger this multiplier, the bigger the circle/oval
// (decimals allowed, not negative numbers, some rounding is applied)
var diameter = 10;

// Rotation speed, set it negative if you want it to spin clockwise (decimals allowed)
var rotation = 0.4;

// This is not the rotation speed, its the reaction speed, keep low!
// Set this to 1 or a decimal less than one (decimals allowed, not negative numbers)
var speed = 0.3;

////////////////////// Stop Editing //////////////////////

if (!window.addEventListener && !window.attachEvent || !document.createElement) return;

msg = msg.split('');
var n = msg.length - 1, a = Math.round(size * diameter * 0.208333), currStep = 20,
ymouse = a * circleY + 20, xmouse = a * circleX + 20, y = [], x = [], Y = [], X = [],
o = document.createElement('div'), oi = document.createElement('div'),
b = document.compatMode && document.compatMode != "BackCompat"? document.documentElement : document.body,

mouse = function(e){
e = e || window.event;
ymouse = !isNaN(e.pageY)? e.pageY : e.clientY; // y-position
xmouse = !isNaN(e.pageX)? e.pageX : e.clientX; // x-position
},

makecircle = function(){ // rotation/positioning
if(init.nopy){
o.style.top = (b || document.body).scrollTop + 'px';
o.style.left = (b || document.body).scrollLeft + 'px';
};
currStep -= rotation;
for (var d, i = n; i > -1; --i){ // makes the circle
d = document.getElementById('iemsg' + i).style;
d.top = Math.round(y[i] + a * Math.sin((currStep + i) / letter_spacing) * circleY - 15) + 'px';
d.left = Math.round(x[i] + a * Math.cos((currStep + i) / letter_spacing) * circleX) + 'px';
};
},

drag = function(){ // makes the resistance
y[0] = Y[0] += (ymouse - Y[0]) * speed;
x[0] = X[0] += (xmouse - 20 - X[0]) * speed;
for (var i = n; i > 0; --i){
y[i] = Y[i] += (y[i-1] - Y[i]) * speed;
x[i] = X[i] += (x[i-1] - X[i]) * speed;
};
makecircle();
},

init = function(){ // appends message divs, & sets initial values for positioning arrays
if(!isNaN(window.pageYOffset)){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
} else init.nopy = true;
for (var d, i = n; i > -1; --i){
d = document.createElement('div'); d.id = 'iemsg' + i;
d.style.height = d.style.width = a + 'px';
d.appendChild(document.createTextNode(msg[i]));
oi.appendChild(d); y[i] = x[i] = Y[i] = X[i] = 0;
};
o.appendChild(oi); document.body.appendChild(o);
setInterval(drag, 25);
},

ascroll = function(){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
window.removeEventListener('scroll', ascroll, false);
};

o.id = 'outerCircleText'; o.style.fontSize = size + 'px';

if (window.addEventListener){
window.addEventListener('load', init, false);
document.addEventListener('mouseover', mouse, false);
document.addEventListener('mousemove', mouse, false);
if (/Apple/.test(navigator.vendor))
window.addEventListener('scroll', ascroll, false);
}
else if (window.attachEvent){
window.attachEvent('onload', init);
document.attachEvent('onmousemove', mouse);
};

})();

</script>

* Ket :

Ganti tulisan yang berwarna merah (***eNaL Rhay SyahRingGan***)dengan tulisan yang anda inginkan.
Ganti tulisan yang berwarna merah (#999) dengan warna yang anda inginkan.

Lalu simpan...selesai dech.....!!

Coba Anda lihat hasilnya........!!!

EnaL Rhay SyahRinggan Next..>>

Minggu, 06 Juni 2010

Tips Mendaftarkan Blog atau Web ke Google

Banyak tehnik yang dipakai agar blog atau situs kita dikunjungi banyak orang. Diantaranya melakukan kegiatan blogwalking, mengunjungi situs-situs terkenal, memberi komentar pada postingan blog orang lain, dan mendaftarkan blog ke mesin pencari. Berikut adalah tips untuk mendaftarkan blog Kita ke mesin pencari. Banyak mesin pencari yang digunakan diseluruh dunia, akan tetapi Google merupakan yang paling banyak digunakan.

Nah, jika kalian mempunyai blog atau situs, dan ingin blog atau situs kalian ini dikunjungi banyak orang, salah satu caranya adalah dengan mendaftarkan blog atau situs kalian ke Google. Caranya gampang, lihat tutorialya disini.

Masuk aja ke situs ini: "http://www.google.com/addurl/"

Nah, jika kalian sudah berada pada halaman situs ini, isilah form yang ada pada halaman situs ini..

Berikut langkah-langkahnya.

URL : isi dengan alamat URL atau situs kalian,

contoh: http://blogenalrhaysyahringgan.blogspot.com

Comments : Isi dengan kata kunci yang ada hubungannya blog kalian

contoh: Trik-Trik Blogger | SEO Blogspot | Tips-tips Menarik, dll

Pokonya Yang ada sangkutpautnya dengan web kalian

Verifikasi: isi dengan huruf verifikasi yang muncul pada gambar,

Klik tombol Add URL, selesai.

Setelah melakukan pendaftaran, tunggu 2 sampai 4 hari agar blog kita terindeks pada mesin pencari Google. Kadang hanya butuh waktu beberapa hari saja agar blog kita terindeks ke mesin pencari. Nah jika sudah, cobalah masukkan alamat blog atau judul salah satu postingan blog kalian di Google. Setidaknya alamat blog anda bisa masuk daftar 10 besar pencarian di Google. Selamat mencoba.

EnaL Rhay SyahRinggan Next..>>

Cara Mengganti Icon Pada Address Bar

Jika kita membuka suatu website atau blog maka seringkali kita menjumpai ada sebuah gambar atau icon pada address bar (kotak untuk mengetikkan alamat web). Dan jika kita punya blog di Blogspot maka icon default yang akan tampil adalah gambar seperti ini :

Bagi kamu yang tidak puas dengan icon/gambar tersebut, kamu bisa menggantinya dengan gambar sesuai dengan keinginanmu. caranya sangat mudah, yaitu dengan membuat gambar (gif, jpg, ico, dan lain2) dengan ukuran kira2 24x24 pixel sampai 32x32 pixel (sebenarnya ukurannya bebas sih, tapi biar filenya kecil dan proses membukanya cepat). Setelah itu .....

Masuk ke "Layout --> Edit HTML" trus tempatkan script berikut sebelum kode </head>

<link href='http://kendhin.890m.com/sonictrik.gif' rel='SHORTCUT ICON'/>

ganti huruf yang dicetak tebal dengan lokasi gambar dimana kamu menyimpannya. Kamu bisa menyimpan gambarmu di 000webhost atau bisa juga di photobucket dan juga di imageshack atau kalo kamu tidak mau pusing dibawah ini ada beberapa contoh icon/gambar beserta dengan linknya.

http://img87.imageshack.us/img87/5862/image1an1.gif

http://img110.imageshack.us/img110/6218/image2ie0.gif

http://img98.imageshack.us/img98/9617/image3cr0.gif

http://img134.imageshack.us/img134/633/image4hx4.gif

http://img139.imageshack.us/img139/83/image5oa7.gif

http://img509.imageshack.us/img509/6449/image6fu0.gif

http://img527.imageshack.us/img527/6543/image7go9.gif

http://img507.imageshack.us/img507/5774/image8wn8.gif

http://img150.imageshack.us/img150/5784/image9qo1.gif

http://img404.imageshack.us/img404/1214/image10vr1.gif

http://img412.imageshack.us/img412/3808/image11pc0.gif

http://img100.imageshack.us/img100/4658/image12du2.gif

http://img132.imageshack.us/img132/4733/image13lj1.gif

http://img145.imageshack.us/img145/7793/image14zg9.gif

http://img412.imageshack.us/img412/4403/image15jc7.gif

http://img264.imageshack.us/img264/7575/image16kn8.gif

EnaL Rhay SyahRinggan Next..>>

Sabtu, 05 Juni 2010

Membuat Tulisan Terbaru (Recent Post) Keren Dengan Gambar

Oke, kali ini saya akan membagikan trik-tips cara Membuat Recent Post Keren Dengan Gambar Thumbnail disampingnya.

Langka-langkah yang harus anda lakukan..:

Log in ke Blogger Anda.
Pilih Tata Letak.
Tambah Gadget dan pilih HTML/JavaScript.
Copy paste code script di bawah ini....(paste ke HTML/JavaScript anda)

imgr = new Array();

imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-zKPQMPeACRXgSzbQ7J9VerPFL4VFS-cdGNAjrtWtdP8OqWBLDuWTvFdXZIxJ4nm0FSqTkTO-9Z7x_TLuwBwZkIpWTjOvj1IY1vwyU7QUrJKsrX9YMDCD80EOrfD11ANFz_oyFWBS5v4/";

imgr[1] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-zKPQMPeACRXgSzbQ7J9VerPFL4VFS-cdGNAjrtWtdP8OqWBLDuWTvFdXZIxJ4nm0FSqTkTO-9Z7x_TLuwBwZkIpWTjOvj1IY1vwyU7QUrJKsrX9YMDCD80EOrfD11ANFz_oyFWBS5v4/";

imgr[2] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-zKPQMPeACRXgSzbQ7J9VerPFL4VFS-cdGNAjrtWtdP8OqWBLDuWTvFdXZIxJ4nm0FSqTkTO-9Z7x_TLuwBwZkIpWTjOvj1IY1vwyU7QUrJKsrX9YMDCD80EOrfD11ANFz_oyFWBS5v4/";

imgr[3] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-zKPQMPeACRXgSzbQ7J9VerPFL4VFS-cdGNAjrtWtdP8OqWBLDuWTvFdXZIxJ4nm0FSqTkTO-9Z7x_TLuwBwZkIpWTjOvj1IY1vwyU7QUrJKsrX9YMDCD80EOrfD11ANFz_oyFWBS5v4/";

imgr[4] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-zKPQMPeACRXgSzbQ7J9VerPFL4VFS-cdGNAjrtWtdP8OqWBLDuWTvFdXZIxJ4nm0FSqTkTO-9Z7x_TLuwBwZkIpWTjOvj1IY1vwyU7QUrJKsrX9YMDCD80EOrfD11ANFz_oyFWBS5v4/";

showRandomImg = true;

boxwidth = 260;

cellspacing = 3;

borderColor = "#FFFFFF";

bgTD = "#000000";

thumbwidth = 40;

thumbheight = 40;

fntsize = 12;

acolor = "#666";

aBold = true;

icon = " ";

text = "Komentar";

showPostDate = false;

summaryPost = 40;

summaryFontsize = 10;

summaryColor = "#666";

icon2 = " ";

numposts = 15;

home_page = "Alamat URL Blog Anda/";

</script>

</div>

Keterangan:

boxwidth = 260; Gantri angka itu untuk menyesuaikan ukuran gadget
numposts = 15; Angka "15" Jumlah postingan, bisa diganti
home_page = "Alamat URL Blog Anda/"; Urlnya ganti dengan Url blog kamu

Selesai dech....

Selamat mencoba.

EnaL Rhay SyahRinggan Next..>>

Jumat, 04 Juni 2010

Random Post Dinamis

Ini adalah demo untuk menampilkan random post atau postingan acak. Dengan random post ini, artikel atau postingan yang ada di blog anda akan ditampilkan secara acak nantinya.

Demo random post ini bisa anda lihat di sidebar blog ini.

Sekilas Script...

CSS
.gfg-root { width: auto; height: auto; position: relative; overflow: hidden; text-align: center; font-family: verdana, sans-serif;font-size: 12px;padding:2px; background:none;border: 0px solid #363636;}

.gfg-title {font-size: 16px;font-weight : bold;color : #fff;background-color: none;line-height : 1.4em;overflow: hidden;white-space : nowrap;}

.gfg-subtitle {font-size: 14px;font-weight: bold;color: #333;background-color: none;line-height : 1.4em; overflow : hidden;white-space : nowrap;margin-bottom : 0px;}

.gfg-subtitle a {color : #a43434;display:none !important;}

.gfg-entry {background-color: none;width : 100%;height : 9.9em;position : relative;overflow : hidden;text-align : left;margin-top : 0px;}

/* To allow correct behavior for overlay */
.gfg-root .gfg-entry .gf-result {position : relative;background-color:none;width : auto;height : 100%;padding-left : 5px;padding-right : 5px;}

.gfg-list {position : relative;overflow : hidden;text-align : left; margin-bottom : 15px;display:none !important;}

.gfg-root .gfg-entry .gf-result .gf-title {font-size: 13px;display:block;color:#a43434;font-weight:bold;line-height: 1.2em;overflow : hidden;white-space : nowrap;text-overflow : ellipsis;-o-text-overflow : ellipsis;margin-top : 4px;}

.gfg-root .gfg-entry .gf-result .gf-snippet {line-height : 1.3em;color: #333;margin-top : 3px;font-size: 12px;}

.clearFloat {clear : both;}

#feedGadget { margin-top: 3px;margin-left: auto;margin-right: auto;width: auto;font-family:verdana, arial;font-size: 10px;color: #333;}

Script
<script src="http://www.google.com/jsapi/?key=ABQIAAAAcV2jSs52yGHKNXjYTcwvNBQjGizh_00DUHOFTBoYdXcXzGgaZxRGIm148GyVsULR8I1--uCF7hoW2w" type="text/javascript"></script>

<script src="http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.js" type="text/javascript"></script>

<script type="text/javascript">
function showGadget() {
var feeds = [
{title:'title',
url:'http://namablog.blogspot.com/feeds/posts/default?redirect=false&start-index=1&max-results=999'},
];
new GFdynamicFeedControl(feeds, 'feedGadget',
{numResults : 1000, stacked : true,
title: " "});
}
google.load("feeds", "1");
google.setOnLoadCallback(showGadget);
</script>

<div id="feedGadget"><center><img src="http://img80.imageshack.us/img80/1577/loadingtrans.gif" /></center></div>

Mengenai pemasangan script di atas, lihat: Cara Buat Random Post di Blogger.

EnaL Rhay SyahRinggan Next..>>

Cara Membuat Random Post di Blogger

Cara membuat random post di blogger. Tutorial blog kali ini akan menjelaskan bagaimana cara menampilkan posting/artikel secara acak di blogspot.

Random post ini disebut dengan random post dinamis, karena tampilannya yang berupa slide. Dengan tampilan slide tersebut, tentu random post ini juga akan menarik perhatian pengunjung.

Bagi anda yang jarang mengupdate blog, mungkin widget ini cukup berguna. Karena semua artikel yang ada di blog anda akan ditampilkan secara acak nantinya dengan menggunakan widget ini.

Dengan begitu, pengunjung yang beberapa kali mengunjungi blog anda bisa terus membaca artikel-artikel anda yang lain, walaupun anda belum menambahkan postingan baru sekalipun.

Bagi anda yang ingin mencoba random post dinamis ini, bisa langsung mengikuti tutorial blog berikut.

CSS

Pertama yang perlu anda lakukan, yaitu menyimpan css untuk random post ini.

Log in ke blogger.
Pilih menu Layout (Tata Letak) » Edit HTML.
Cari kode ]]></b:skin>.
Copy kode berikut di atas kode tadi.

.gfg-root { width: auto; height: auto; position: relative; overflow: hidden; text-align: center; font-family: verdana, sans-serif;font-size: 12px;padding:2px; background:none;border: 0px solid #363636;}

.gfg-title {font-size: 16px;font-weight : bold;color : #fff;background-color: none;line-height : 1.4em;overflow: hidden;white-space : nowrap;}

.gfg-subtitle {font-size: 14px;font-weight: bold;color: #333;background-color: none;line-height : 1.4em; overflow : hidden;white-space : nowrap;margin-bottom : 0px;}

.gfg-subtitle a {color : #a43434;display:none !important;}

.gfg-entry {background-color: none;width : 100%;height : 9.9em;position : relative;overflow : hidden;text-align : left;margin-top : 0px;}

/* To allow correct behavior for overlay */
.gfg-root .gfg-entry .gf-result {position : relative;background-color:none;width : auto;height : 100%;padding-left : 5px;padding-right : 5px;}

.gfg-list {position : relative;overflow : hidden;text-align : left; margin-bottom : 15px;display:none !important;}

.gfg-root .gfg-entry .gf-result .gf-title {font-size: 13px;display:block;color:#a43434;font-weight:bold;line-height: 1.2em;overflow : hidden;white-space : nowrap;text-overflow : ellipsis;-o-text-overflow : ellipsis;margin-top : 4px;}

.gfg-root .gfg-entry .gf-result .gf-snippet {line-height : 1.3em;color: #333;margin-top : 3px;font-size: 12px;}

.clearFloat {clear : both;}

#feedGadget { margin-top: 3px;margin-left: auto;margin-right: auto;width: auto;font-family:verdana, arial;font-size: 10px;color: #333;}

Simpan template.

Script Random Post

Untuk memasang script random post ini ikuti langkah-langkah berikut.

Buka Layout (Tata Letak) » Page Elements (Elemen Laman).
Klik Add a Gadget (Tambah gadget).
Pilih gadget HTML/JavaScript.
Copy-paste script berikut ke dalam gadget tadi.

Jangan lupa ganti nama blog anda.
Simpan gadget.

Sekarang lihat hasilnya. Postingan anda akan tampil secara random (acak).

Selamat mencoba!

Lihat demo:
http://blogenalrhaysyahringgan.blogspot.com/2011/06/random-post-dinamis.html
update:
Tutorial membuat random post di Wordpress

EnaL Rhay SyahRinggan Next..>>

Selasa, 29 Juni 2010

Minggu, 27 Juni 2010

Selasa, 15 Juni 2010

Sabtu, 12 Juni 2010

Rabu, 09 Juni 2010

Minggu, 06 Juni 2010

Sabtu, 05 Juni 2010

Jumat, 04 Juni 2010

Comments Via Facebook

| Enal | Trik-Trik Blogger | SEO Blogspot

Cari Blog Ini

FeedBurner

Total Pageviews

Recent Posting Title

Recent Post

Artikel Terkait

Labels

Popular Posts

Download FIlm

Blogger Templates

FeedBurner

Subscribe To

Guest Book

About Me

Followers

Clock

Weather

Send Free SMS to Indonesia

Blog Archive

Blog Archive