Anda di halaman 1dari 4

Cara membuat ikon YM melayang

Pada pagi hari yang cerah ini ( hahaha ),,saya akan berbagi tips buat sobat seka
lian mengenai cara memasang ikon YahooMessenger melayang (menggantung)..
Sobat bisa lihat contohnya di blog saya..
Kenapa saya mau repot2 memasang ikon terbang seperti itu??
Hal ini dikarenkan untuk meminimalisir widget yang ada di blog..
Jujur,,saya sedikit risih sobat buat banyak2 masang widget di sidebar blog..
Jadi lebih baik saya gantung..hehehe
Oke lanjut..
Trus bagaimana cara membuatnya???
Yang jelas,,sobat harus punya akun yahoo dlu..hahahahaha..
Becanda itu...
Caranya seperti biasa, sobat buka dahbor blogger,,trus tata letak..
Setelah itu, sobat klik edit html..
Contreng expand widget..
Trus cari kode ]]></b:skin>
Copy paste kode dibawah ini tepat diatas kode tadi..
#gambar_melayang {
position:fixed;_position:absolute;
bottom:40px;
right:5px;
clip:inherit;_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(docum
ent.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWid
th); }
Untuk kode berwarna hijau, sobat bisa ganti sesuai dengan tempat ikon itu mau so
bat gantung..hehe

Kemudian...
Sobat copy lalu paste kode dibawah ini diatas kode </body>
<div id='gambar_melayang'><img border='0' src='http://opi.yahoo.com/online?u=ran
diadityakusuma&amp;m=g&amp;t=14' style='float: right; margin-top: 35px;'/></div>
Untuk kode berwarna hijau, sobat bisa ganti sesuai dengan IDyahoo sobat dan angk
a itu bisa diganti dengan style yang sobat suka...
Membuat Gambar Melayang (Float Image)
Teman-teman semua saya mendapatkan tips bagus ni bwt hias blog kalian semua dari
internet kemaren
kita bisa bikin gambar yang ngelayang di tampilan blog kita kayak wargreymon yan
g nemplok di pojok kanan bawah blog saya
penasaran ngebuatnya gimana??
simak yang di bawah ini
Membuat Anu Supaya Selalu Berada Di pojok
Pasti pada bingung nih, apa maksudnya dan kenapa judulnya begitu, sebenarnya aku
sendiri juga bingung mau ngasih judul apa untuk trik yang berikut ini. Setelah
aku pikir-pikir eee.. nggak nemu-nemu juga judul yang cocok, ya udah deh aku asa
l aja kasih judul gitu. Trus apa maksudnya dari judul tersebut dan trik apa yang
akan dibahas?
Gini, untunya itu gini trik nyoba ngebahas gimana cara membuat "ANU" itu selalu
berada di pojok (bisa atas, bawah, kiri, kanan) meskipun "scroll bar" ditarik ke
mana-mana. "Scroll bar" itu apa sih? itu lho kotak kecil panjang yang ada disamp
ing itu, yg biasanya ditarik kebawah dan keatas supaya bisa ngelihat isi blog ya
ng kepanjangan. Trus maksudnya "ANU" itu apa? "ANU" itu maksudnya bisa gambar at
au photo kamu, animasi, Jam, Hit Counter, Shoutbox, Kalender, Adsense, Iklan, Wi
dget-widget dan lain-lain. Kalo untuk di blog ini aku pasang gambar sonic yg sed
ang lari-lari (pojok kiri bawah). Nha udah tahu kan maksudnya. Kalo dah tahu dan
pingin mencobanya mari ikuti trik berikut ini:
1. Login ke blogger trus klik "Layout -->> Edit HTML
2. Cari kode ini ]]></b:skin> kalo dah ketemu taru kode berikut ini di atasnya.

#trik_pojok {
position:fixed;_position:absolute;bottom:0px; left:0px;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(docum
ent.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWid
th); }

3. Text yang dicetak tebal adalah posisinya, kalo pingin ganti di posisi pojok k
anan bawah tinggal text "left" diganti dengan "right". Begitu juga tulisan "butt
om", jika pingin di posisi atas bisa diganti dengan "top".
4. Langkah selanjutnya yaitu letekkan script berikut ini sebelum kode </body>

&ltdiv id="trik_pojok">
&lta href="http://trik-tips.blogspot.com">
&ltimg src="http://kendhin.890m.com/soniclari.gif" border="0" /></a>
</div>

"http://trik-tips.blogspot.com" adalah link. ganti dengan link kamu.


"http://kendhin.890m.com/soniclari.gif" adalh lokasi gambarmu. ganti dengan loka
si gambar kamu.
5. Jika kamu pingin yang ada disitu bukan gambar tetapi jam/kalender/hit counter
/widget-widget yg lain, maka ganti text yang berwarna merah dengan script widget
-widget tersebut.
6. Simpan hasil kerja kamu dan lihat hasilnya.

Cara Membuat Read More / Baca Selengkapnya di Blogger


Biasanya postingan terbaru akan ditampilkan dihalaman utama blog. Namun jika pos
tingan kamu terlalu panjang maka hal tersebut akan membuat penuh halaman utama.
Jika kamu ingin supaya postingan kamu yang ditampilkan dihalaman utama cuma abst
raksinya saja kemudian ada sebuah link Read More / Baca Selengkapnya untuk melih
at selengkapnya maka ikutilah langkah-langkah berikut :

Cara Membuat Read More / Baca Selengkapnya di Blogger


Biasanya postingan terbaru akan ditampilkan dihalaman utama blog. Namun jika pos
tingan kamu terlalu panjang maka hal tersebut akan membuat penuh halaman utama.
Jika kamu ingin supaya postingan kamu yang ditampilkan dihalaman utama cuma abst
raksinya saja kemudian ada sebuah link Read More / Baca Selengkapnya untuk melih
at selengkapnya maka ikutilah langkah-langkah berikut :
1. Buka menu Layout kemudian pilih Edit HTML.
2. Kasih tanda cek (centang) pada cekbox "expand widget template"
3. Cari kode berikut di Template blog kamu (tempatnya kira-kira pada 1/4 bagian
bawah kode hmtl) :

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


<p><data:post.body/></p&gt;

4. Kalau sudah ketemu, Ganti kode tersebut menjadi seperti ini :

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


<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/></p>
<a expr:href='data:post.url'>Baca selankapnya ?</a>
</b:if>

Tulisan "Read More....." itu bisa kamu rubah, misalnya jadi "Baca Selengkapnya".
5. Simpan hasil pengeditan.
6. Kemudian pilih menu Setting lalu pilih Formatting
7. Pada kotak Post Template isikan kode berikut:

<span class="fullpost">

</span>

8. Kemudian Simpan.
9. Ketika memposting, klik EDIT HTML. Maka, secara otomatis akan tampak kode sep
erti berikut :

<span class="fullpost">

</span>
10. Letakkan abstraksi posting atau artikel yang akan ditampilkan dihalama utama
(sebelum tulisan "Redmore") diatas kode ini : <span class="fullpost"> sementara
sisanya yaitu keseluruhan posting letakkan di antara kode <span class="fullpost
"> dan </span>
11. Ini yang paling penting diantara semua proses diatas yaitu ..... Selesai....
. he..he..he..
Selamat Mencoba...

Anda mungkin juga menyukai