Image Hosting

Hari ni MP nak bagi ceramah free untuk adik-adik yang masih konfius bila MP buat tutorial dan bagi arahan masukkan URL image, URL mp3 dan sebagainya.
Untuk elakkan korang rasa serabut, hari ni kita tumpukan pada URL image je dulu, ok?

Url Image tu ape sebenarnya?

Korang boleh rujuk contoh entry tutorial sebelum ni
Tutorial : Icon Cute Sebelah Bloglist

MP ada bagi arahan masukkan URL Gambar Kesukaan.
Hah, macam mana rupa nya URL Gambar / Url Image tu?

First, korang kena tau dulu gambar ni ada beberapa jenis file
Antara format-format fail imej yang paling kerap dijumpai dan digunakan adalah JPEG/JPG, GIF dan PNG.
haa, biasa nampak kann

So sekarang ni apa kaitan dengan URL image?
Nak senang kerja, ambik je gambar-gambar dari Glitter Graphics
Cara nak ambil URL Image hanya ikut step di bawah.

Pilih gambar yang korang suka, contohnya gambar kalender ni



Kalau tengok kat website Glitter Graphicsada 2 kod kat situ, abaikan Code HTML.

Copy BB code dia, korang perhati elok-elok kod ni
Url Image terletak antara [img] dan [/img]

[url=http://www.glitter-graphics.com][img]http://dl.glitter-graphics.net/pub/725/725451hqye09hovg.gif[/img][/url]<br />

[url=http://www.glitter-graphics.com][img]http://dl.glitter-graphics.net/pub/725/725451hqye09hovg.gif[/img][/url]

Yang MP highlight tu la Url Image
atau dikenali sebagai Direct Link.

http://dl.glitter-graphics.net/pub/725/725451hqye09hovg.gif

nampak tak kat belakang dia tu ada .gif
So, lepas ni kalau korang jumpa link yang hujung dia ada .gif ke, .png ke, .jpg ke korang faham la itu maksudnya link untuk gambar
Clear?

Baik, tadi kita belajar ambil Url Image dari Pic yang sudah siap ada BB code, senang kata ready stock la.
Macam mana plak kalau kita nak guna gambar kita sendiri @ download pic @ icon kat mana2?
Mereka ni tak de BB code.
So, macam mana nak cari Url Image dia?
Hah, di sini la kita akan masuk ke tajuk utama tutorial ni. Kita akan belajar tentang Image Hosting.


Tak payah susah-susah cari web hosting
Sebab blogspot kita ni dah memang boleh kita guna untuk upload gambar dan kenal pasti URL Imagenya dengan mudah

bersambung..

---

Dah habis baca ke? Jemput tinggalkan komen ◕‿◕

---

Floating Button

Dah lama tak buat tutorial ek? Hari ni adik d'fiey bertanya camne agaknya nak pasang floating button kat blog kita.

Eh, floating button tu ape? Ini dia.

Haha, nak buat ni senang je, sebab tu cepat je buat tutorial ni. Heh. Ikut saje step kat bawah ni ye :)

Dashboard / Design / Page Elements / Add A Gadget / HTML/Javascript.

Ok, sekarang copy code dibawah ni dan paste di ruang Content HTML/Javascript

<style type='text/css'>
a.linkopacity img {
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
-khtml-opacity: 0.5;}

a.linkopacity:hover img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
-khtml-opacity: 1.0; }
</style>

<div style='display:scroll; position:fixed; top:140px; left:-12px;'>

<a class='linkopacity' href='http://www.facebook.com/zanariahmohdnasir' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='facebook'><img border="0" src="http://img.photobucket.com/albums/v486/mafiatrg/232.png" /></a><br />

<a class='linkopacity' href='http://twitter.com/mommypinky' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='twitter'><img border="0" src="http://img.photobucket.com/albums/v486/mafiatrg/432.png" /></a><br />

<a class='linkopacity' href='http://www.blogger.com/home' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='feed'><img border="0" src="http://img.photobucket.com/albums/v486/mafiatrg/blogger_64x64.png" /></a><br />


</div>

Haip, belum siap lagi..kat atas ni code Mommy Pinky yang punya..haha. Sila la tukar Url yang di bold dengan Url akaun anda sendiri ye!!

Kalau rasa tak cukup 3 buttons je, hanya tambah code kat bawah ni dan adjust la sendiri. Hua Hua.

<a class='linkopacity' href='LINK ADDRESS' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='feed'><img border="0" src="URL IMAGE" /></a><br />

Tips :
Kedudukan floating buttons boleh diubah di 140px,

Left tu boleh ubah kepada Right kalau nak floating buttons kat belah kanan blog korang.. :)

Tak berkenan gambar kat atas tu? Boleh ubah url image yang berwarna biru, cari sendiri icon yang korang suka. Mommy Pinky suke cari kat sini :) KLIK

Dah siap, SAVE!!

Kredit

Ada apa-apa kurang faham, tinggalkan komen ok. InsyaAllah, mommy tolong pahamkan..tapi lmbat la kot, masa terhad..ekeke~

---

Dah habis baca ke? Jemput tinggalkan komen ◕‿◕

---