Follow Us @soratemplates

Saturday, 12 December 2015

TUTORIAL: Meet The Author macam saya


ASSALAMUALAIKUM | SALAM SEJAHTERA

Tutorial kali ini aku nak ajar satu persatu mcm mana nak buat MEET THE AUTHOR mcm aku kat sidebar tepi ni. [macam dalam gambar] This tutorial request by Sab [http://bluechoralpearl.blogspot.my/], kawan aku yang mana juga merupakan seorang blogger. Korang sila lah jenguk blog dia yaa sebab dia pun masih je baru-baru buat blog hiihi.

Untuk tutorial ni, korang kena buat empat perkara.
  1. LETAK GAMBAR
  2. LETAK TULISAN
  3. LETAK SOCIAL ICON
  4. LETAK ONLINE USERS
  5. LETAK JUMLAH POST DAN COMMENT
Thats all. Siap semua step tu maka dapatlah MEET THE AUTHOR macam aku ni hehehh. K jom hakak nak buat tuto ni.



1. LETAK GAMBAR
Layout>Add A Gadget>HTML/JavaScript
Copy paste kod di bawah ni:

<center><img src="URL GAMBAR" width="WIDTH GAMBAR" / /></center>

URL GAMBAR korang boleh letak gambar apa korang suka. Kalau nak letak gambar korang sendiri, kena upload dulu untuk dapatkan url gambar. Korang boleh upload dengan mudah kat imgur.com tanpa perlu sign up ataupun kalau korang ada photobucket, upload guna photobucket je. Kalau tak, guna je gambar aku bagi kat bawah ni atau usha gambar lain kat http://iheart-pictures.tumblr.com/ sbb kat situ banyak gambar comel-comel. WIDTH GAMBAR pulak kena bersesuaian dengan blog korang. Kalau aku, aku letak 290. Kalau korang rasa terbesar terkecik ke sila dah ubah angka tersebut yaa. TUTORIAL UTK DAPATKAN URL/LINK GAMBAR KLIK SINI


http://40.media.tumblr.com/0afe58440bf9bcd0620a168c95aaf552/tumblr_n98ztj0CIl1rnn1dwo1_500.jpg

http://36.media.tumblr.com/a69fa39cd3fe1137deed98cf022800c1/tumblr_nec8vrFzek1qjiwlho1_500.png

2. LETAK TULISAN
Layout>Add A Gadget>HTML/JavaScript atau paste kod di bawah ni selepas step 1 tadi.

<center style="font-style: normal;"><b><span style="color:KOD WARNA;">"AYAT KORANG"</span></b></center><center style="font-style: normal; font-weight: normal;">
<center>
<center><span style="font-weight:bold;">AYAT KORANG</span><center>
<center>AYAT KORANG<center>

KOD WARNA korang boleh cari kat SINI. Contoh: #000000
Kalau nak semua tulisan kaler lain lain ke atau kaler sama boleh ubah sikit coding dia atau korang pakai kod yg kat bawah ni je.

<center style="font-style: normal;"><b><span style="color:KOD WARNA;">"AYAT KORANG"</span></b></center><center style="font-style: normal; font-weight: normal;">
<center>

Aku bahagikan kepada tiga ayat sebab kod yg aku bagi tu ikut kod aku. Aku punya kan ada tiga bahagian ayat. Apapun ikut citarasa korang yee. Kalau taknak tulisan tu bold, korang buang kod <b> kat dalam coding tuu k.

3. LETAK SOCIAL ICON
Layout>Add A Gadget>HTML/JavaScript atau paste kod di bawah ni selepas step 2 tadi.


 <center><a href="URL FACEBOOK"><span style="width: 40px; height: 40px;"><img style="width: 40px; height: 40px;" src="URL ICON" /></span></a>


<a href="URL TWITTER"><span style="width: 40px; height: 40px;"><img style="width: 40px; height: 40px;" src="URL ICON" /></span></a>


<a href="URL TUMBLR"><span style="width: 40px; height: 40px;"><img style="width: 40px; height: 40px;" src="URL ICON" /></span></a>

<a href="URL INSTAGRAM"><span style="width: 40px; height: 40px;"><img style="width: 40px; height: 40px;" src="URL ICON" /></span></a>

<a href="https://www.blogger.com/home"><span style="width: 40px; height: 40px;"><img style="width: 40px; height: 40px;" src="URL ICON" /></span></a><center></center></center>

URL ICON korang boleh cari kat SINI atau guna yang aku share kat bawah ni.

http://findicons.com/files/icons/2812/flat_social_icons/128/02_facebook.png
http://findicons.com/files/icons/2812/flat_social_icons/512/01_twiter.png
http://findicons.com/files/icons/2812/flat_social_icons/128/15_tumblr.png
http://findicons.com/files/icons/2812/flat_social_icons/128/10_instagram.png
http://findicons.com/files/icons/2812/flat_social_icons/128/21_blogger.png

Kalau korang takde tumblr ke instagram ke dan korang taknak letak social icon tersebut, korang just delete cod tumblr atau instagram tu mula dari <a href sampai </a> kod tersebut.

Contohnya, korang takde tumblr dan korang taknak letak icon tumblr. Korang delete kod kat bawah ni:
<a href="URL TUMBLR"><span style="width: 40px; height: 40px;"><img style="width: 40px; height: 40px;" src="URL ICON" /></span></a>

K. Setakat ni faham tak? Kalau penjelasan aku kabur, tolong suarakan yaa.

4. LETAK ONLINE USERS
Untuk yang ini, aku ada buat tutorial step by step. Korang boleh refer kat SINI yaa
Korang boleh paste selepas step 3.

5. LETAK JUMLAH KOMEN DAN POST
Layout>Add A Gadget>HTML/JavaScript atau paste kod di bawah ni selepas step 4 tadi.
Ni aku bagi sebijik aku punya coding. Korang ubah dulu yaa sebelum copy tuuu.

<center><script style="text/javascript">
function numberOfPosts(json) {document.write('Total Post: <b>' + json.feed.openSearch$totalResults.$t + '</b><br>');}
function numberOfComments(json) {document.write('Total Comment: <b>' + json.feed.openSearch$totalResults.$t + '</b><br>');}
</script><script src="http://bajuwarnacoklat.blogspot.my/feeds/posts/default?alt=json-in-script&callback=numberOfPosts"></script>
<script src="http://bajuwarnacoklat.blogspot.my/feeds/comments/default?alt=json-in-script&callback=numberOfComments"></script></center></center></center></center></center>

Yang kaler merah ubah url blog korang ok.

..............................................................................

Faham tak dengan tutorial aku ni? Sorry eah kalau ada yang tak faham ke hehehee. Harap tuto ni dapat membantu Sab dan juga sesiapa yang sedang cari tuto ni. Apa-apa pertanyaan boleh tanya aku terus yaa.

Tataaa dan selamat malam!







10 comments:

  1. thank you rrai... om dh lama nak request tapi malu...

    ReplyDelete
  2. wahhh bestnyaaa thanks youu Rrai nt boleh cuba :)
    macam ni lagi nampak kemas :)

    ReplyDelete
  3. Assalamualaikum. Saya guna icon ni. Comelnyaa. Haha. Thanks :)

    ReplyDelete
  4. yay dah jadi. thank you share icon :*

    ReplyDelete
  5. thanx tutonya .. sy pkai ikon tu .. tyouu ..:)

    ReplyDelete
  6. yeahhh menjadi tq sangat-sangat

    ReplyDelete
  7. Thankyou! senang faham and menjadi :D

    ReplyDelete
  8. http://fallensecrets.blogspot.com

    ReplyDelete

Penghantaran sebarang komen, permintaan, cadangan ATAU komunikasi lain yg lucah, sumbang, palsu, mengancam ATAU negatif dengan niat untuk menyakiti hati, menganiayai, mengugut ATAU mengganggu orang lain dengan ATAU tanpa mendedahkan identitinya adalah suatu kesalahan boleh didenda tidak melebihi 58 ribu ringgit atau dipenjarakan selama tempoh tidak melebihi 1 tahun ATAU kedua-duanya sekali.