Ahad, 12 Disember 2010

Tutorial : Bagaimana Cara Membina Blog Yang Menarik

Assalamualaikum


Hello lads, gents, gays and lesbs sekalian. Aku ada dapat beberapa pertanyaan berkenaan dengan blog. Mostly, newbies datang dan tanya perihal blog. Terutama pasal apa yang patut ada di blog.

Ini adalah entri yang paling paling paling paling paling basic tentang cara untuk buat blog. Sebab, some of guys datang dan kata dia tak tahu apa-apa mengenai blog.

Kalau dulu, aku selalu kata worpress adalah best sebab boleh reply comment and etc. Sebenarnya, wordpress adalah best, tetapi hanya kalau korang nak buat domain sendiri. If not, then blogger (blogspot) adalah yang terbaik setakat ini. Lebih-lebih lagi, kalau korang agak baru memandangkan blogger adalah amat simple kalau nak di bandingkan dengan wordpress.

The Whole Template.


Okay, bagi korang yang baru belajar cara membuat blog, dan tak tahu nak ambil template / layout yang macam mana, korang boleh download je dari website-website yang cool. Korang boleh lepak di blog mamat ni untuk cari template yang best.

Selepas download extract keluar template (code script) tu guna winzip/winrar. Buka account blogger anda -> Dashboard ->Design -> Edit HTML then upload the code script -> Save Template.

Then tadaaa. Korang dah ada template sendiri.

Besarkan size ruangan blog entry post (post body)
Dan, antara soalan yang paling banyak yang aku dapat adalah pasal cara nak besarkan ruangan blog post which is ruangan entri anda di blog anda. Caranya, aku tak tahu pada asalnya, tapi bila aku belajar sendiri bila nak buat template baru warna hijau ni, aku terbelajar lah cara nak edit semua ni. Caranya:

Dashboard ->Design -> Edit HTML-> 'Tick' Expand Widget Template -> Tekan Ctrl + F (Ini akan aktifkan fungsi search di web brower anda- Juga boleh di gunakan di Microsoft Office) Tulis 'main-wrapper' tanpa koma atas.

Anda akan nampak seperti di bawah


Dari situ, cari dia punya width. Itu lah size blog post (post / entry body) anda. Kalau kita tengok, asalnya 500px.


Bila preview, ia akan jadi macam ni;



Aku tukarkan ke 1000px, ia akan jadi macam ni.


Dengan kata lain, just tukarkan ikut suka korang lah nak width berapa pun. Dan, pastikan ada ruang untuk sidebar.


Dan kalau korang nak ubah warna link, visited link dan hover (letakkan mouse di atas link), boleh search guna perkataan yang di dalam gambar bawah,


Then tukar dia punya colour. Kod-kod warna dia, korang boleh ambil di blog ini.

Begitu juga lah dengan fungsi quote dan sidebar. Korang boleh belajar discover sendiri. Dan kalau nak diikutkan, korang boleh ubah setiap benda yang ada di blog korang dengan satu syarat, korang kena faham bahasa kod. Tak payah belajar kat kelas pun apa. Belajar sendiri pun boleh. Main agak-agak dan main logik-logik je. Sebab, aku pun belajar sendiri dan selalu buat try and error. Aku berani belajar sendiri sebab HMTL codes ni, adalah semuanya based on logik. Ingat tu.

Tapi, sebelum try and error tu, pastikan korang buat back-up korang punya template dulu. Kang nanti template blog hancur, jangan nak salahkan aku.

Title tag improve SEO.
Apa itu SEO? Kalau dulu, aku tengok hampir setiap hari blogger-blogger tulis pasal SEO. Tapi sekarang, amat susah nak cari. SEO adalah Search Engine Optimization. Kalau SEO korang bagus, raking Alexa korang akan jadi bagus. Kalau SEO korang bagus, blog korang akan di penuhi dengan orang ramai yang search di Google, Bing dan Yahoo! Sebab, semakin tinggi SEO korang, semakin mudah lah blog korang nak di jumpai di ketika di search.

Cara paling mudah untuk improve SEO adalah dengan ubah dan letak Title tag.

Caranya, mula-mula

Dashboard ->Design -> Edit HTML-> 'Tick' Expand Widget Template -> Tekan Ctrl + F (Ini akan aktifkan fungsi search di web brower anda- Juga boleh di gunakan di Microsoft Office). Search untuk

<title><data:blog.pageTitle/></title>

Bila dah jumpa, replacekannya dengan code di bawah;

<b:if cond='data:blog.pageType == &quot;index&quot;'>
<title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/></title>
</b:if>

Selepas dah replace tu, Save kan template.

Code ini akan membuatkan nama blog tidak akan di papar bila di search. Aku rasa, SEO makin bagus kalau kita buang kita punya nama blog. Lagi pun, tak kerasa nama blog tu akan buat ianya kacau SEO? Orang search tentang blog post, bukannya nama blog.

The Must Have


Apa yang wajib ada di blog anda;
Blog roll / Blog list - Senarai blog orang lain yang anda minat baca. Contohnya di blog aku, The Other Pretty Gay. Ianya penting supaya orang sedar akan kewujudan blog korang.
Google Connects (Followers) - Pelanggan tetap anda.
Chatbox - Shoutmix (Free dan ada banyak kelebihan berbanding chatbox lain. Ada IP address misalnya)
Label / Tag - Penting kalau blog anda best.
Iklan - Nuffnang - Kalau anda berminat nak cari sikit duit. (Perhatian, aku ulang SIKIT DUIT.)
Counter, Referrer / Tracker - Panting untuk korang tengok aktiviti trafik blog anda. Boleh tahu apa yang orang-orang di dunia ni search untuk sampai di blog anda.
Google WebMaster - Juga tracker. Penting untuk tengok trafik dan keyword dan trend blog anda.

The NOT TO
Apa yang tak patut ada di blog anda adalah;
Jam - Pembaca anda boleh tengok jam di sudut bawah kanan di PC dieorang. Melainkan kalau blog korang banyak porno sampai mereka terlalai sampai tak perasan waktu solat.
Oh, selebihnya, boleh dirujuk di SINI.

Macam mana / Bagaimana nak buat supaya orang tak boleh copy entry blog kita?


Ya, antara masalah paling tak best bila kita buat entri yang agak best, adalah bila ada malaun tak tahu malu yang copy apa yang kita tulis. Kalu copy tak apa. Aku pun tak kisah, tapi, letak lah link ke blog yang korang copy. Kalau boleh, letak lah direct link. Ni tak, dah la copy orang punya, link tak letak. Selepas tu, buat macam dia punya. Aku pernah ada masalah ni. Ada sorang mamat ni. Dia buat note kat FB, tapi isi dia bulat-bulat entri aku. Aku dah lupa nama dia. Yang aku ingat, dia pakai baju melayu pastu muka bajet comel.

So, cara untuk prevent orang dari curi blog post korang adalah dengan;

Dashboard ->Design -> Page Element -> Add Gadget -> Add HTML/JavaScript -> Paste code di bawah -> Save.


<script language="JavaScript">
<!-- 
//Disable right mouse click Script
//By Maximus (maximus@nsimail.com) w/ mods by DynamicDrive
//For full source code, visit http://www.dynamicdrive.com 
var message="Function Blocked"; 

///////////////////////////////////
function clickIE4(){
if (event.button==2){
alert(message);
return false;
}

function clickNS4(e){
if (document.layers||document.getElementById&&!document.all){
if (e.which==2||e.which==3){ alert(message); return false;
}
}

if (document.layers){
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=clickNS4;
}
else if (document.all&&!document.getElementById){
document.onmousedown=clickIE4;

document.oncontextmenu=new Function("alert(message);return false") 
// -->
</script>
Selepas save, then bila view blog, korang dah tak boleh tekan kanan mouse sebab nanti dia akan keluar error tulis "Function Blocked". Korang boleh tukar perkataan ni kepada perkataan lain.

Atau pun, lagi mudah bila korang gunakan code di bawah.

Dashboard ->Design -> Edit HTML-> 'Tick' Expand Widget Template -> Tekan Ctrl + F -> Search untuk

<body>

Dan replace dengan

<body oncontextmenu='return false;' onkeydown='return false;' onmousedown='return false;'>

Kemudia, Save Template.

Code di atas akan membuatkan blog anda tak boleh di kanan klik, tak boleh di select (Highlight) dan tak boleh di Ctrl+C Ctrl V.

Okay dah. Semoga korang ada blog yang best

Aku rasa, apa yang di atas adalah benda yang antara paling penting untuk sesebuah blog. Mungkin aku ada missed something or whatever. Apa-apahal, boleh tanya di Formspring aku.

Bye



81 Comments:

superstar racing berkata...

Your blog is great
If you like, come back and visit mine: http://b2322858.blogspot.com/

Thank you!!Wang Han Pin(王翰彬)
From Taichung,Taiwan(台灣)

Tok Esah berkata...

wah, bagus Mr K!!!! tok esah suke...

belajar dulu bahsa HTML tu..

Cara nak ngorat aek comei!!! 18SX

crayon berkata...

aku suka part blogroll tu.. hahaha...

Kei berkata...

thnaks mr.K :D

Selikat Coklat Berbicara berkata...

sangat membantu mR K !!! yeahh ! tenkiu tenkiu :)

a_a berkata...

salam...
aku blogger baru jugak...
tapi nak tambah sikit boley...
hu2..nak kongsi sikit ilmu yg tak seberapa...
sebab yang dekat part ubah width post 2 n nk tukar2 kaler 2 mcm complicated...
boley buat dekat dashboard>design>template designer
kat situ boley tukar2 kaler..ubah width...
stakat ni tu je yg aku berjaya explore...
terkial2 gak mase buat..
but succes walaupon blog x seberapa...
=]

♥CIK SHA♥ berkata...

good explanation..^_^

Tanpa Nama berkata...

thanks for the effort.

bella dela rosa berkata...

this is very much helpful.tq khairul;)

Fina Fento berkata...

Bookmark teros :P

masshie mastura berkata...

sangat berguna.
thanks :)

mOOn berkata...

Betul2 jam sangat tak perlu.. haha.. sangat terasa tang jam tuh.. Fine. aku pergi remove sekarang.. haha..

::n.u.r.f.a.r.h.a.n.a:: berkata...

Mr. Kay. I baru dlm blog blog ni. thanx lah sebab you bg tutorial ni. :)

rhapsody LiN berkata...

bgus2.sgt berguna utk newbie. hehe

Hasrol Nizam berkata...

aku rasa as basic mmg cukup dah apa yg ko ckp ang bagi rujukan dalam entri ni. good job bro :D

Pendapat anda?
Kenangan cuti sekolah aku dulu-dulu

Cik Sehari Anti Kanta Lekap berkata...

serius bagus utk new bloggers.Thanks khairul :)

cik SYANA'S @ I-cha comel berkata...

thanks..mr.k

Mr K berkata...

@a_a - But, mostly, template yang diconvert dari Wordpress tak boleh guna cara tu.

And thanks for your support guys

Lupi berkata...

aku boleh rite klik semua blog :D

ieka_ecca berkata...

ilmu y berguna utk d aplikasi kn dlm dunia blog ni.....=), sgt membantu bg org y x bwpe nk expert sgt mcm sy ni......

thank u

Riderz berkata...

nice entry Mr.K,

nk tny sket, cne nk wat banner blog & coding dia skali? alaa, yg org slalu duk ltak nk exchange link tu.. ekeke

sailormoon jelyta berkata...

K, aku try expand aku nyer blog post, tapi tetiba aku nyer profile sume, followers sume tercampak ke bawah!

cane ek nak kasi blog post kite ke kiri sket? sebab kiri tuh kan kosong jeeee..

=.='

Pala Maldini berkata...

thumbs up!

cik ain cik siti berkata...

assalamualaikum,

thanks for this tutorial.

im new blogger also.

byk lgi yg perlu belajar.

thanks again.

and for you, keep it up !

GHAH berkata...

terima kasih. :)

noorafzan berkata...

dulu kan mmg dah jadi hobi ku godek2 html code di blog.
sampai pernah jadi hancurlah blog.

tapi daripada situlah sebenarnya kita belajar.
apa kata orang.
"learn from our mistakes"

tapi penah ku rasa geram sebab code html blog tu tak boleh nak buat blockquote. cubalah macam mana gayapun tetap tak boleh.

rasanya kalau entry post ada 'blockquote' lagi cantiklah. entry nampak lebih kemas. =)

Mr K berkata...

@Sailormoon - Jangan buat terlamau besar. Sebab tu lah perlu ngam dengan size sidebar. Kalau sidebar pun besar, memang akan hancur la template.

@Afzan - Boleh. Aku pun, untuk template ni, blockquote aku edit sendiri. Kalau ikutkan asal, template hitam hijau ni tak ada + blockquote.

Cara dia, kau tambah CSS, atau replace dia.

Replace guna ni.

.post-body blockquote {
line-height:1.3em;
}

.post blockquote {
font-family:georgia;
font-style:italic;
margin:1em 20px;
}
.post blockquote p {
margin:0.75em 0;
}

Mr K berkata...

Terlampau*

abcd E fgtakperlulahakutaipsampaihurufz berkata...

bagus.

eiela berkata...

bagus info nih. im new blogger too.

Latest Entri :
Takde Mood, Tak Tau Nak Buat Apa

cik Diva berkata...

wah berkesan.. mekaseh ... ngehngeh

a_a berkata...

owh cam2 ek...
aku pun baru explore..
x berapa nak reti lah sgt kn...
anyway this entri sgt informative...

thumbs up!!!!

(^o^)V

noorafzan berkata...

Mr.K..

untuk replace menthod.
Which code yang existing code dan which code yang nak guna tuk replace?

maybe add css better.
but di mana nak di tambah ye?
I mean dalam design code tu.

Mr K berkata...

@afzan - Klu nk tmbh, kat mana2 pn blh. Asalkan kat sekitar link colour, post size etc. Nak senang, search for "Blockquote" then kau akan jumpa kod yang hampir serupa.

fathiyyahISMAIL berkata...

bila klik kanan je. tiba2 ~

*heyy jangan noty2 tawww ~!*




dahla smua pink .
+_+

Syariniey Amran berkata...

Great!!
ini sangat membantu
tQ Mr.K !
:)

Miss El berkata...

sangat2 membantu mista kay!
btw, check it out
http://misselwords.blogspot.com/

Silly.Fazly berkata...

bagus lah tutorial nih.
dak baru.. :)

http://bloggerojak.blogspot.com

ruggedmom berkata...

Tq Mr K, i mmg dok terkial-kial lg tang ubah-suai nih

aizuddin berkata...

thanks bro tlg link :D

zetty berkata...

suke!gud tips :)) tq..n suke bace blog anda

akunajihah berkata...

mr K..ade x care nak bg side bar back kat kri balik..try expand width tros hancus
huhu
arap dpt membantu
tq

kdee berkata...

thanks..aku dah try wat dh.tq

^^nu[dd]yra^^ berkata...

tq Mr K....
sy dak baru....
tutorial nih sgt mbantu skali ;p

Saye Hajar berkata...

mr k...saye xdapat buat untuk yang main wrapper tuh..sedey lol..nak lebarakan , nak ikt step tapi tetap xde yang main wrapper tu...wuwuwuwuwuw

Eve Azeez berkata...

hi... nice blog & thnks sbb dpt gak manfaatnya... kalau rajin leh la lawat blog akak ek...

z@h!R@h berkata...

Salam, saya dah lama cuba ubah2 blog template ke wordpress template. saya dah try mcm2 tutorial jugak tp benda yg sama je cara2 nye tp tak boleh pun..

saya dh ikut cara mr K dan tutorial org lain yg kena upload code script tu tp dia keluar sama ada blank page with bad request atau dia keluar something error with code...

please do enlighten me.. tqvm

Ollen berkata...

kalo sy nk buat pasal dr mana saya dpt template and link kt awk punya entri ni bole tak.

Tanpa Nama berkata...

~thanks~

anainie@blogspot.com berkata...

Terima Kasih, banyak membantu...

Tanpa Nama berkata...

postingan jelek,, aku kesal same org malaysia

Bukittinggi Fashion berkata...

terimakasih


KAIN SULAM BUKIT TINGGI FASHION
SULAM BUKIT TINGGI FASHION KEBAYA NYONYA TELEKUNG BAJU KURUNG MOSLEM SWIMSUIT

Tanpa Nama berkata...

kalau guna joomla plak camner ?

aku nak tukar warna title sidebar tu . cam warna hijau yg ko buat nie cantik..

Eyna Ixora berkata...

tq Mr.k,..:)

adli berkata...

salam bro.
saya yang baru balajar.
saya guna saranan bro untuk fungsi 'block' tu dan berjaya.
trima kaseh.

MENU berkata...

aku belajar sesuatu lagi hari ini...tx for the info dlm blog ko ni...

akuhensem berkata...

Mr K said...
@a_a - But, mostly, template yang diconvert dari Wordpress tak boleh guna cara tu.

Kalau yang diconvert dari wordpress macam man pulak caranya.. sangat berharap dapat membantu

Ceeyan_Olet berkata...

:D nice la!! :( sye ni budak baru lg ni...xtau nak watpe... byknyer tips yg awk bg.. :) thx!!!!errr...sye pilih comment! :p

Mohd Shah berkata...

Great articles
Kawan2 saya komen kat laman web ini kos saya just nak bagi tau kawan2 semua.Baru2 ini saya jumpa satu laman web panggil CNGNET dia offer free web hosting @ email marketing dan ada lagi lain2.Kawan2 dalam blog ini boleh la layari laman web ini "CNGNET"
CNGNET
Memang bagus :)
yala kalau free kan bagus :P

kebenaran diutamakan berkata...

sifu, tolong ajar, macam mana cara nak buat yang counting jumlah pelawat ke blog kita tu? maaf, saya memang baru sgt. nak belajar buat

Dian Akulah Sindarela berkata...

Hahahahaha sbb die da tanya nyawa @ comment..aku comment jelah..tips yg bagus '

Cara Membuat Blog berkata...

waw komplit banget... Nget... Cocok wat pemula

Mohd Shah berkata...

Pertama Mohon Maaf Pada kawan2 di Theotherkhairul sebab komen saya bahasa engris :P,Hahaha...

Great Site I Love This Site,Beautiful Template's Great Tutorial's Great Design's And All Feature's :-)
Free Blog

MY BLOGGER berkata...

info yang sangat menarik dan bermanfaat,
Mkasi ya sob :)

Blogwalking ya sob :)
http://Laba2laba.blogspot.com

Vindice Aiman berkata...

thnx, salam perkenalan, baru lagi, seminggu je bloggng

dr guabudakbaik.blogspot.com

Ieta Mat Sa'ad berkata...

selamat berkenalan. Sy blogger baru... joint blog ini. sdg bljr setup layout blog sy. Tqvm :) http://www.ieta.my

Darul Barakah berkata...

jika anda yakin tawaf di makkah itu terapi untuk perubatan, anda tidak perlu ragu akan penggunaan jam tawaf. pergerakan jam mengikut hukum alam..jom kembali kepada fitrah klik;
http://jamtawaf.blogspot.com atau;
http://www.facebook.com/CounterAnticlockwiseStore

remoih serr berkata...

salam..

sekadar ingin berkongsi maklumat.
di sini saya ada me reka satu software khusus untuk web developer yang ingin menguji laman yang sedang anda bangunkan. software ini di beri nama "secawan Web Server ". Software ini free untuk digunakan. Untuk maklumat lanjut boleh lihat di sini
http://itsegmen.blogspot.com/2013/01/web-server.html.

Software ini sama tugasnya seperti xampp, wamp,lamp ,dan lain.

Selamat mencuba

adnan sempot berkata...

Salam. Best la blog kwn ni. Thnx for the info^^

Izati berkata...

salam.hye.jumpa bnda baru kat sini.thanks erk..btw kalau rajin follow blog sy yew.sy new blogger..:)

Top Niaga Mall berkata...

pergh memang terbaik. hope dapat godek2 html tu dengan jayanya .

kata kata cinta yg indah berkata...

Thanz..

NULEAD berkata...

Terima kasih

NULEAD berkata...

Terima kasih :)

amirulcyber berkata...

Terdpt 2 jenis blog yg popular iaitu wpress dan blogspot.kedua2nyer userfriendly dan easy to use kata org putih.org yg tidak mempunyai pengetahuan it pun boleh buat blog.setuju tak?hehehe

salmiah othman berkata...

Terima kasih atas info yang amat berguna..nanti nak buat blog saya jadi lebih menarik..hehe

Wina berkata...

wahhh keren bgt dachh tuchhh

sukses ajh dach gan

game murah dan berkualitas berkata...

blognya gelap ya mas... tapi ilmunya banyak hehehe...

Dj Terselubung berkata...

Mampir sini Gan bisa Nonton TV Online Gratis, Video Streaming dan Nonton Film Gratis di BaDeDo.CoM.

Kalo Mau Nonton TV disini Nonton TV Online Gratis.

Kalo mau Nonton Film disini Nonton Film Gratis.

Kalo mau Nonton Video SEX / Bokep disini Nonton Video SEX/Bokep.

Terima Kasih. www.badedo.com

Ahli SEO berkata...

i think your blog very informative, thanks for sharing.
Best Regards,
Ahli Seo dan Pakar Seo Indonesia

Jeanne Ley berkata...

nice explaination.

Disclaimer

This is a personal blog and everything written on this blog, based on own and personal thought.

The owner of this blog did not responsible for any comments that made in the comment sections. The owner is only responsible by his name as written by the sections.

This web blog does not store any file on its server. All movies, software, form of files, pictures and any type of graphic forms that are posted on this blog are indexed from other sites and they are just for personal purpose only.

For download-able form of files/software/etc, it's just for demo and must be deleted within 24 hours. You are agreed with this term as clicking the download button.

Any pictures, videos and graphic forms, are not copyrighted as the date taken from the search engines. As if its copyrighted, all credit goes to the owner and I did not own the copyrights. All of the graphic forms are linked with the original source. All of those pictures, videos and graphic forms are not for any commercial use, I gain nothing for those forms of files.

Light 18sx contents.

All related names mentioned are totally fiction and got nothing to do with your and my life.
 
Powered by Blogger