Kaedah Buat Blog Dan Tutorial

Cara Pasang Kotak Komen Facebook Di Blog

noreply@blogger.com (Anonymous) — Tue, 18 Dec 2012 10:21:00 +0000

CONTOH KOTAK KOMEN FACEBOOK DI DALAM BLOG

Cara-cara letak kotak komen Facebook di blog:

1. Pergi ke bahagian Design > Edit HTML

2. Tick atau tanda pada Expend widget templates
Note : Sila Download Full Templates terlebih dahulu sebagai langkah keselamatan.

3. Kemudian tekan CTRL+F (Find) untuk mencari code ini < div class='comments' id='comments'>

4. Copy code di bawah ni dan paste kan selepas perkataan < div class='comments' id='comments'> yang korang jumpa tadi.

<div class='comments-tab' id='blogger-comments' onclick='javascript:commentToggle("#blogger-comments");' title='Comments from Blogger'>
<img class='comments-tab-icon' src='http://www.blogger.com/img/icon_logo32.gif'/> <data:post.numComments/> Comments
</div>
<div class='comments-tab inactive-select-tab' id='fb-comments' onclick='javascript:commentToggle("#fb-comments");'

title='Comments made with Facebook'>
<img class='comments-tab-icon' src='http://static.ak.fbcdn.net/rsrc.php/v1/yH/r/eIpbnVKI9lR.png'/>
<fb:comments-count expr:href='data:post.url'/> Comments
</div>
<div class='clear'/>
</div>

<div class='comments-page' id='fb-comments-page'>

<b:if cond='data:blog.pageType == "item"'>

<div id='fb-root'/>

<fb:comments expr:href='data:post.url' num_posts='5' width='400'/>

</b:if>

</div>

<div class='comments comments-page' id='blogger-comments-page'>

*num_posts='5' = Nilai 5 merupakan jumlah komen yang akan terpapar secara default pada kotak komen FB

*width='400' = Ini merupakan saiz kotak komen untuk Facebook comments box. Korang boleh adjust saiz tersebut mengikut kesesuaian blog masing-masing.

5. Tekan CTRL+F (Find) untuk cari code <head> , Kemudian Copy dan Pastekan code di bawah ini, selepas code tersebut (<head>) .

<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>

<script src='http://code.jquery.com/jquery-latest.js'/>

<meta content='YOUR_FB_ID' property='fb:admins'/>

<script type='text/javascript'>

function commentToggle(selectTab) {

$(".comments-tab").addClass("inactive-select-tab");

$(selectTab).removeClass("inactive-select-tab");

$(".comments-page").hide();

$(selectTab + "-page").show();

}

</script>

Note : Pastikan korang menukarkan YOUR_FB_ID dengan ID Facebook korang tersendiri. Korang boleh dapatkan ID Facebook korang dengan cara Sign In ke Facebook korang dan tengok URL di bahgian profile macam contoh ini; http://www.facebook.com/profile.php?id=1234567890. Nombor yang dihujung sekali tu la merupakan ID facebook korang, cam dalam contoh tu 1234567890 merupakan Id facebook yang diperlukan untuk tutorial ini.

6. Copy dan paste code dibawah ke bahagian CSS

.comments-page { background-color: transparent;}

#fb-comments-page { padding: 0px 5px; display: none;}

.comments-tab { float: left; padding: 5px; margin-right: 3px; cursor: pointer; background-color: #cfe2f3; -moz-border-radius: 10px 10px 0px 0px;

-webkit-border-top-left-radius: 10px;

-webkit-border-top-right-radius: 10px;

-webkit-border-bottom-left-radius: 0px;

-webkit-border-bottom-right-radius: 0px;

-goog-ms-border-radius: 10px 10px 0px 0px;

border-radius: 10px 10px 0px 0px;}

.comments-tab-icon { height: 14px; width: auto; margin-right: 3px; }

.comments-tab:hover { background-color: #eeeeee;}

.inactive-select-tab { background-color: #F0F8FF;}

****Untuk step ini ada 2 cara yang korang boleh buat****

a ) Korang Copy dan paste code diatas sebelum perkataan ]]></b:skin> (di bahagian Design > Edit HTML)

ATAU

b ) Korang pergi ke bahagian Design > Template Designer > Advanced > Add CSS dan pastekan code tersebut di dalam kotak css tersebut.

Makluman :
Sila adjust background color mengikut kesesuaian blog korang. Cam saya ni saya guna warna biru .

Gambar Membulat Ketika Disentuh

noreply@blogger.com (Anonymous) — Tue, 11 Dec 2012 15:24:00 +0000

Tutorial kali ini aku nak ajar korang buat kesan rounded shadow ketika di hover atau sentuh. Contohnya, kalau korang letakkan cursor kat any picture dia akan keluar imej macam ini :

Memang comel dan nampak canggih sikit blog korang kalau guna tutorial ini.. Nak cuba tak? Jom ikuti step by step ye!

1. Sign in Blogger > Design > Edit HTML > Tick Expand Widget Templates
2. Cari code ini, nak mudah tekan ctrl F je dan pastekan code di bawah dalam kotak find..

/* Header

3. Lepas jumpa code di atas, copy code di bawah dan paste di atas atau sebelum code yang dicari tadi.

/*------ IMAGE ANIMATION------*/img {filter:alpha(opacity=100);-webkit-transition-duration:.5s;} img:hover {filter: alpha(opacity=60); opacity: .6; -webkit-box-shadow: 0px 0px 10px #000000; -moz-box-shadow: 0px 0px 10px#000000; -webkit-border-top-right-radius:10; -webkit-border-top-left-radius:10; -webkit-border-bottom-right-radius:10; -webkit-border-bottom-left-radius:10;}img:hover {filter: alpha(opacity=60); opacity: .60; border: 1px solid#000000; border-radius: 30px; -moz-border-radius: 30px;}-moz-opacity:1.0;opacity:1.0;}img:hover {filter:alpha(opacity=80);-moz-opacity:0.80;opacity:.80;}u {text-decoration:underline;border-bottom: 2px solid #F781BE;padding: 0px;}

4. Kalau nak ubah warna boleh tukar code #000000 kepada warna kesukaan anda. Nak code sila tengok SINI

5. Silalah SAVE dan tengok hasil tangan anda!

Cara Membuat Kotak Shout Box

noreply@blogger.com (Anonymous) — Mon, 30 Jul 2012 18:22:00 +0000

Kotak shoutbox adalah suatu kotak yang berfungsi untuk memasukkan pesanan, namun boleh juga berfungsi sebagai tempat sembang (chatting). Biasanya Shoutbox dimasukkan kedalam halaman web/blog dengan bahasa java Script. Kita boleh mendapatkan shoutbox dari Cbox . Caranya adalah sebagai berikut :

1. Buka website Cbox, dan daftar seperti gambar di bawah.

2. Tick pada " I have read and do agree to the Cbox terms and conditions of service." Kemudian
click pada create my Cbox!

Sekarang anda telah pun selesai mendaftar ke akaun Cbox anda, sila semak email yang anda register dan ikut arahan pada email tersebut. Contoh adalah seperti gambar di bawah:

Cbox Created, confirmation email will send to your email

Email received from Cbox. Click on link given.

3. Kemudian anda akan di minta memasukan login name serta pasword anda. Seperti di bawah.

4. Apabila anda telah login, kod akan di berikan kepada anda. Copy kod tersebut kemudian anda
pilih Layout - Add a gadjet - HTML/JavaScript

5. Kemuadian anda Paste kod yang telah anda copy tadi ke dalam kotak "content" dan seterusnya
anda save untuk anda lihat hasilnya. Selamat mencuba :)

Cara Disable Right Click Dalam Blog

noreply@blogger.com (Anonymous) — Mon, 30 Jul 2012 17:09:00 +0000

Adakah anda tidak suka orang lain mengambil apa sahaja kandungan dalam blog anda.?
Dan pada masa yang sama anda tidak suka dengan kod² yang berserabut yang perlu di edit dalam 'edit html'. Kini ada cara mudah untuk realisasikan hasrat anda.:)

Kenapa Perlu Disable Right Click.?

Kebiasaannya,seseorang pemilik blog akan menggunakan fungsi ini untuk megelakkan orang lain mengambil apa yang ada dalam blog mereka. Samada tidak senang ayat mereka ditiru bulat² (copy paste), ataupun untuk mengelakkan bandwidth habis digunakan. Kebiasaan alasan yang aku selalu baca adalah kerana ada orang yang copy entri mereka bulat².

Berikut adalah contoh msg yang akan keluar apabila anda aktifkan disable right click

Berikut adalah cara yang mudah untuk menggunakan fungsi ini.

1. Copy kod ini.

<script language=JavaScript>

</script>

2. Pilih add gadjet-HTML/JavaScript

3. Paste kan Code yang anda copy tadi di dalam kotak seprti di bawah.

Apabila sudah selesai, anda save dan lihat hasilnya pada blog anda. Selamat Mencuba.

Link Dalam Blog Warna-Warni ( Rainbow Link )

noreply@blogger.com (Anonymous) — Sat, 14 Jul 2012 20:36:00 +0000

Rainbow link merupakan salah satu trick yang diaplikasikan kepada link yang ada dalam sesebuah blog. asalkan cursor mouse dilalukan pada sesuatu link, link tersebut akan berubah menjadi warna-warni dengan warna yang tertentu.

Klik disini untuk lihat contoh worldmentioned.blogspot.com yang menggunakan trick link warna warni ini.

Tutorial untuk menjadikan blog anda juga mempunyai link berwarna-warni adalah seperti berikut.

1.) Copy code di bawah ini.

<script src="https://sites.google.com/site/unwanted86/javascript/rainbowlink.js" type="text/javascript">
</script>

2) Buka dashboard blog anda, kemudian pergi ke layout dan klik add a gadget.

3) Cari HTML/javascript.

4) Masukkan skrip yang telah anda copy dari langkah 1 tadi ke dalam kotak content seperti dibawah. kemudian save.

Selamat mencuba.

Buka Link Baru Apabila Klik Pada Gambar

noreply@blogger.com (Anonymous) — Sat, 14 Jul 2012 19:54:00 +0000

Apabila upload gambar menggunakan kaedah yang telah tersedia oleh blogger.com, secara default gambar tersebut akan dibuka pada page yang sama.

Ada ketikanya ianya bagus apabila merujuk kepada blog yang sama, tetapi kurang bagus apabila seorang blogger hendak merujuk kepada tempat lain. ini kerana apabila buka pada page yang sama, pengunjung terpaksa menekan button back untuk kembali kepada blog asal.

Tutorial ini akan menerangkan bagaimana untuk menjadikan gambar yang mempunyai link. Perhatikan kedua-dua gambar ini, sila klik pada keduanya.

1)Gambar 1

1)Gambar 2

Gambar pertama tidak memberi kesan apa-apa, tetapi gambar kedua membawa anda ke DailyMail (memang sengaja di'link'kan kepada DailyMail).

Jangan terkejut jika tutorial ini sangat mudah.

Langkah 1

Highlight pada gambar yang anda upload kemudian klik pada link.

Langkah 2

Masukkan web address untuk gambar yang anda upload, klik pada open this link in a new window dan klik ok. Dalam tutorial ini saya gunakan gambar Salena Gomez dan web address untuk gambar ini adalah dailymail. Selesai.. selamat mencuba.

Website untuk download template blog

noreply@blogger.com (Anonymous) — Sat, 14 Jul 2012 19:15:00 +0000

Sebelum menukar template sesebuah blog, perkara yang diperlukan adalah template yang hendak ditukar. Seseorang pemilik blog mesti mengetahu template bagaimana yang hendak digunakan untuk blognya.

Jika anda seorang pemilik blog dan masih belum lagi mempunyai template yang hendak digunakan, anda boleh mendapatkan pelbagai jenis template secara percuma dan pelbagai jenis yang dirasakan sesuai untuk blog anda.

Template sesebuah blog adalah dalam format .xml (oleh itu pastikan jika anda download file dalam bentuk zip/rar, anda extract dahulu file tersebut.)

Berikut adalah antara laman web yang menyediakan pelbagai jenis template untuk blogger secara percuma.

http://btemplates.com/

http://www.ourblogtemplates.com/

http://www.deluxetemplates.net/

http://blogtemplate4u.com/

http://www.bloggertemplatesfree.com/

http://www.btheme.info/

http://www.freebloggertemplate.org/

http://www.bloggertemplateplace.com/

Anda juga boleh mendapatkan pelbagai lagi template untuk blog dengan hanya menggunakan fungsi search pada google.

Tips: Anda tidak perlu risau jika anda gunakan banyak masa untuk memilih template yang sesuai untuk anda. Kerana itu adalah perkara biasa. Pastikan template yang anda pilih betul-betul memenuhi citarasa anda.

Bagaimana Backup Template Blog

noreply@blogger.com (Anonymous) — Sat, 14 Jul 2012 18:57:00 +0000

Template bagi sesebuah blog boleh diibaratkan sebagai tulang belakang blog kerana template yang menyimpan semua maklumat berkaitan rupa bentuk blog anda, fungsi blog dan juga kebanyakan trick untuk sesebuah blog akan dilakukan di template (edit html).

Anda letak background ke, ubah colour ke, letak fungsi 'read more' atau pape, kebanyakkannya adalah di template.
Oleh itu adalah perlu untuk seseorang blogger akan backup dahulu template blog sebelum melakukan sebarang pengubahsuaian ataupun sebelum menukar template baru.
Tujuan backup template adalah untuk backup jika sebarang perubahan kod yang diaplikasikan tidak menjadi.

Tutorial untuk backup template bagi blog adalah seperti berikut.

1) Login seperti biasa. Kemudian dari dashboard klik pada Template dan klik pada Backup/Restore.

2) Dari Backup/Restore pilih klik pada Download full templete. di sini template anda akan di download ke PC/Laptop

anda.

3) Contoh File template anda yang telah siap di download adalah sperti dibawah. Selesai

Template yang Selesai di download menggunakan Google Chrome

Template yang di save dalam directory PC/Laptop anda.

------------------------------------------------------------------------------------------------------------------------------------------------------------------

Jika anda ingin restore Templete anda, anda cuma ulang langkah seperti yang dio tunjukkan dari awal. Cuma pada langkah ke-2 anda klik pada Choose File dan select Template dari PC/Laptop anda yang telah sedia anda backup sebelum ini. Selamat berjaya

Setting Asas Yang Perlu Pada Blog

noreply@blogger.com (Anonymous) — Sat, 14 Jul 2012 18:34:00 +0000

Bagi sesebuah blog, setting merupakan antara perkara penting untuk menentukan bagaimana paparan, dan perlakuan-perlakuan lain yang berkaitan dengan blog.

Antara perkara yang berkaitan dengan setting bagi sesebuah blog adalah tajuk blog, berapa bilangan entri, siapa yang boleh komen, dan lain-lain akan direrangkan di bawah.

Untuk entri ini, setting merangkumi basic, formatting dan publishing. Ini kerana 3 perkara ini boleh dianggap bahagian setting yang paling utama bagi sesebuah blog. Beberapa setting asas yang perlu diketahui oleh seorang blogger adalah seperti berikut.

BASIC

Title : Title akan ditunjukkan pada bahagian atas browser apabila sesebuah blog dibuka.

Description : Berkaitan dengan apa kandungan sesebuah blog. Boleh dimasukkan sehingga 500 huruf. Contoh tutorial blog, tutorial blog dalam bahasa melayu, tutorial untuk semua dan lain² yang berkaitan. Kalau blog peribadi hampir boleh diabaikan ataupun letak sahaja seperti perjalanan hidupku, inilah kisah aku dan lain-lain.

LANGUAGE AND FORMATTING

Date header format : Kurang penting, boleh pilih mana yang dirasakan sesuai.

Archive index date format : Format yang akan ditunjukkan untuk apa yang ditaip dalam sesebuah blog dalam jangka sebulan

Timestamp format : Kurang penting, boleh pilih mana yang dirasakan sesuai.

Time zone : Penting untuk pastikan kedudukan untuk masa adalah betul. Jika yang berada dalam negara Malaysia, sila pilih (GMT +8.00) Kuala Lumpur. Jika berada ditempat lain boleh pilih yang yang sepatutnya.

Language : English (Boleh juga pilih malay, tetapi dicadangkan english untuk memudahkan memandangkan kebanyakan sudah biasa dengan perkataan² english dalam dunia bloggin

POST AND COMMENTS

Show at most : bilangan entri untuk paparan muka depan. jangan terlalu banyak. Biasanya antara 5 hingga 10 untuk mempercepatkan loading keseluruhan blog.

Post Template : Template pos membantu menjimatkan masa anda dengan pra-format editor pos. Sesetengah pengguna seperti jawatan mereka diformatkan dalam cara tertentu.

Showcase images with Lightbox : Apabila diklik, imej anda akan membuka dalam Overlay 1 di atas blog anda. Jika selepas anda mempunyai berbilang imej, mereka akan muncul di sebagai thumbnail sepanjang bahagian bawah.

Share to Google : Memaparkan catatan yang telah selesai di Google+

Comments : Kedudukan ruangan komen untuk sesebuah entri. Kebiasaan blogger akan pilih samada pop-up window atau embedded below post. Walau bagaimanapun, tidak semua template boleh gunakan embeded below post.

Who can comments : Bahagian ini bergantung kepada pemilik blog. Kalau pilih anyone, sesiapa sahaja boleh komen. Kalau pilih registered user, hanya orang yang mempunyai blog/id lain yang boleh komen.

Comment moderation : Bergantung kepada pemilik blog. Jika mahu komen pengunjung terus dipaparkan,pilih never. Tetapi jika mahu komen dari pengunjung 'ditapis' dahulu oleh pemilik blog, pilih always.

Show word verification for comment : Pilih No. Kerana kehadiran word verificationbiasanya akan menyusahan pengunjung. Kecuali untuk kes² tertentu jika terlalu banyak spam (di Malaysia perkara ni jarang berlaku)

---------------------------------------------------------------------------------------------------------------------------------------------------------------

Setting untuk sesebuah blog boleh diubah bila-bila masa mengikut kehendak pemilik blog.
Walau bagaimanapun,adalah penting untuk cuba kekalkan setting yang dibuat untuk menyenangkan pemilik blog dan juga pengunjung.

Bagaimana Letak Kod HTML/javascript

noreply@blogger.com (Anonymous) — Thu, 12 Jul 2012 08:15:00 +0000

Apabila memasuki dunia blogging, antara perkara yang tidak dapat dielakkan adalah untuk menghias blog sendiri. Terdapat beberapa cara untuk menghias blog samada menukar template, memasang widget yang telah disediakan oleh blogger.com ataupun meletakkan sumber² lain dari luar yang biasanya melibatkan kod html/javascript.
Selain untuk menghias blog, kod html/javascript juga mempunyai fungsi² lain bergantung kepada tujuan apa kod itu dihasilkan.

Penambahan yang ingin dilakukan biasanya akan melalui perkara yang sama iaitu kod yang diperolehi perlu di 'paste'kan di ruangan html/javascrip.

Tutorial ini akan menunjukkan bagaimana hendak meletakkan kod html/javascript bagi sesebuah blog.

1) Login ke dalam blog anda seperti biasa. Kemudian dari klik pada layout dan Add a Gedjet
UPDATE: untuk template terbaru, klik pada DESIGN

3)Selepas itu anda akan lihat banyak senarai yang ada, cari "HTML/javascript", kemudian klik pada "+"

4)Satu paparan kosong akan dibuka, kemudian paste code yang anda mahu letak dalam blog ke dalam ruangan
kosong. kemudian tekan "save". Dan anda boleh lihat hasilnya di dalam blog anda.

Upload Video Dalam Blog

noreply@blogger.com (Anonymous) — Thu, 12 Jul 2012 07:51:00 +0000

Selain gambar, video juga memainkan peranan yang penting untuk seseorang blogger untuk mempelbagaikan kandungan entri dalam blog.

Video boleh merangkumi samada aktiviti peribadi, video klik lagu kegemaran, video klip percutian, tutorial dan apa sahaja yang dilihat lebih memudahkan untuk disampaikan kepada pengunjung ataupun untuk tatapan pemilik blog sahaja.

Untuk mengupload video menggunakan kaedah yang tersedia untuk blogger adalah seperti berikut:

1. Login ke dalam akaun blogger anda, kemudian klik pada new post.

2. Pada paparan yang muncul, klik pada icon video seperti yang ditunjukkan.

3. Langkah seterusnya, browse video yang hendak diupload, anda ada pilihan untuk upload video daripada YouTube, My YouTube videos, From your phone atau daripada webcam anda.

4. Disini saya tunjukan contoh apabila anda memilih untuk upload video dari YouTube. Cari nama video yang hendak di upload. klick pada video yang telah dicari, kemudian klik pada select kemudian video yang di select akan terpapar. klik pada save dan publish.

5. Lihat contoh video seperti dibawah yang telah siap di upload dengan mengikut langkah-langkah seperti di atas, selamat mencuba.

Upload Gambar Kedalam Blog

noreply@blogger.com (Anonymous) — Wed, 11 Jul 2012 06:56:00 +0000

Meletakkan gambar dalam sesebuah entri dalam sesebuah blog dapat 'merancakkan' lagi kandungan sesebuah entri.

Kebiasaannya gambar yang diletakkan adalah berkaitan dengan entri yang ditaip.
dan adalah biasa pengunjung sesebuah blog suka membaca entri sesebuah blog yang juga mempunyai gambar walaupun sekeping.

Tutorial untuk upload gambar dalam blog adalah seperti berikut.

1.Login seperti biasa, klik pada 'new post' dan insert image

2.klik pada choose files

3.kemudian select picture yang anda ingin upload dan klik pada open.

4.Seterusnya select picture yang anda upload tadi dan klik pada Add selected. Tahniah gambar telah di upload dalam post anda.

Cara Post Entri Dalam Blog

noreply@blogger.com (Anonymous) — Tue, 10 Jul 2012 15:35:00 +0000

Post entri dalam blog merupakan perkara yang paling asas bagi seorang blogger.
Dalam entri anda akan menaip apa yang anda mahu sampaikan samada luahan rasa, perkongsian, info dan apa-apa sahaja yang anda mahu.

Berikut adalah cara bagaimana anda hendak memulakan langkah untuk menaip dalam blog anda.

1. Buka link www.blogger.com (link ini diperlukan setiap kali anda hendak login kepada akaun blogger). Masukkan email dan password anda.

2. Pada paparan muka depan, klik pada 'new post'

3. Masukkan tajuk untuk entri anda dan juga isi kandungan entri anda.(biasa bab ini mengambil masa untuk menaip entri).

4. Apabila sudah tekan button publish, siap untuk sebuah entri dalam blog anda.:) jika anda hendak tengok 'rupa' entri anda itu, klik pada 'Preview'

Mendaftar Akuan Blogspot

noreply@blogger.com (Anonymous) — Tue, 10 Jul 2012 15:12:00 +0000

Mendaftarkan diri sebagai seorang pemilik blog dengan menggunakan platform blogger tidaklah sesusah yang disangka. Dengan mengikuti beberapa langkah ringkas berikut, anda sudah bergelar seorang blogger.

sebelum memulakan pendaftaran untuk akaun blogspot, anda mestilah mempunyai akaun google dahulu. Akaun lain pun boleh, tetapi untuk jangka masa panjang, ada akaun google akan lebih memudahkan memandangkan blogger.com adalah produk dari google.

Jika anda sudah mempunyai akaun google, boleh sign dahulu atau klik disini.http://mail.google.com/mail/?hl=en&tab=im..

Jika anda masih belum mempunyai akaun google, Sila daftarkan disini untuk memudahkan proses pendaftaran akaun blogspot.

Berikut adalah langkah-langkah yang diperlukan untuk mendaftar akaun blogspot.

1. Buka link www.blogger.com

2. Apabila paparan sudah keluar, just sign in menggunakan akaun gmail/google

3. Seterusnya klik pada new blog (Create your blog now)

4. Kemudian masukkan blogname dan juga blog address

Title merujuk kepada trademark sesebuah blog
Address adalah digunakan oleh pengunjung untuk membuka blog anda. Blog address antara perkara paling penting bagi sesebuah blog.
Templete ikut kesesuaian anda
klik create blog, dan anda sudah mempunyai akaun blogspot dan sedia untuk membuat posting pertama anda. selamat mencuba