Ada orang bertanya kepada saya, macam mana cara-cara untuk membuat blog sendiri. Sejujurnya saya bukanlah pakar dalam membuat blog. Saya terjebak dengan dunia blogging sejak tahun 2003 lagi. Pada masa itu, komuniti internet sedang hangat membuat blog dan ber'friendster'. Saya tidak pernah menghadiri kelas blogging atau mempelajari secara rasmi dalam tutorial online dan sebagainya. Selama saya berblog, saya hanya menggunakan kaedah google, dan cuba jaya.Oleh itu perkongsian saya kali ini hanyalah sekadar perkongsian. Saya yakin ada cara lebih mudah untuk membuat blog, cuma saya tidak tahu dan tidak berguru. Mungkin selepas ini, pembaca boleh mencari sendiri ilmu secara formal.
- Wordpress
Anda perlu sign up account. Dan apabila anda log in, anda boleh mula menulis. Biasanya arahan-arahannya adalah straight forward dan tidak perlukan guru untuk mengajarnya.
- Tulis
- Pilih tarikh
- Label/tag (jangan lupa label entri anda kerana ia akan memudahkan anda mengumpulkan kategori penulisan pada satu page khas dalam blog anda). Kalau di alam facebook, anda boleh nisbahkan label/tag ini sebagai hashtag (e.g. #gaza, #pray4mh370 etc.)
2. Blog template
Medium blogging akan menyediakan beberapa layout template yang kita boleh pilih untuk dijadikan sebagai template blog kita. Tetapi kebiasaannya ia kurang menarik.
Cara nak dapatkan blog template yang menarik adalah dengan google search: blog template html code
Haa...html code ni apa pulak?
Mudah kata, dengan adanya code ini lah terjadilah template blog itu...dia adalah bahasa kod bertulis.
Pokoknya, cari template ikut cita rasa kita. Ada banyak template yang menarik. Ada yang berkonsepkan magazine, ada yang berkonsepkan photoblog, entertainment, business, literature blog dan sebagainya. Saua menggunakan template dari website ini:
http://www.spiceupyourblog. com/2013/11/best-free-blogger- templates-2013.html#. VFnUymcVXFw
http://www.spiceupyourblog.
Kalau anda scroll ke bawah, anda boleh lihat saya menggunakan Kent Free Blogger Template. Untuk font dan sebagainya semuanya telah ditetapkan dalam html code tu. Gambar yang bergerak-gerak itu pun telah ditetapkan, tetapi kita boleh ubah gambarnya. Perubahan-perubahan ini, saya hanya guna kaedah membaca html code dan cuba jaya. Cuba jaya. Cuba jaya. Dan cuba jaya. Memang berpinar mata melihat bahasa-bahasa yang tidak difahami. Tapi bila jumpa bahasa yang difahami, terus berfikir dan bandingkan dengan preview blog. Perkataan-perkataan lazim yang seseorang perlu alert adalah seperti heading, title, submenu, picture, font, align dan sebagainya. Kemudian adjust-adjust (masukkan maklumat berkenaan) dan preview semula untuk lihat kesan. Kalau tak jadi, undo semula dan teruskan usaha cuba jaya.
Copy paste html code yang dikehendaki dan paste di ruang edit code untuk blog template. Preview blog. Save apabila sudah puas hati.
__________________________________________
Contoh html code untuk bahagian paling atas blog saya:
<div class='social'>
<ul>
<li> <a href='http://www.twitter.com/' rel='nofollow' target='_blank' title='Twitter'>Twitter</a> </li>
<li> <a href='http://www.facebook.com/' rel='nofollow' target='_blank' title='Facebook'>Facebook</a> </li>
<li> <a href='https://plus.google.com/' rel='nofollow' target='_blank' title='Google+'>Google+</a> </li>
<li> <a expr:href='data:blog.homepageUrl + "feeds/posts/default"' rel='nofollow' target='_blank'>RSS feed</a> </li>
</ul>
</div>
__________________________________________
Contoh html code untuk bahagian menu blog saya:
<div class='clearfix' id='submenu'>
<ul class='sfmenu' id='web2feel'>
<li><a expr:href='data:blog.homepageUrl'><strong>Home</strong><span class='menudescription'>Homepage</span></a></li>
<li><a href='http://paparankasih.blogspot.com/search/label/Finance'><strong>Finance</strong><span class='menudescription'>category</span></a></li>
<li><a href='http://paparankasih.blogspot.com/search/label/Religion'><strong>Religion</strong><span class='menudescription'>category</span></a></li>
<li><a href='http://paparankasih.blogspot.com/search/label/Politics'><strong>Politics</strong><span class='menudescription'>category</span></a></li>
<li><a href='http://paparankasih.blogspot.com/search/label/Parenting'><strong>Parenting</strong><span class='menudescription'>category</span></a></li>
<li><a href='http://paparankasih.blogspot.com/search/label/Marriage%20Life'><strong>Marriage</strong><span class='menudescription'>category</span></a></li>
<li><a href='http://paparankasih.blogspot.com/search/label/Medical%20Knowledge'><strong>Medical</strong><span class='menudescription'>category</span></a></li>
<li><a href='http://paparankasih.blogspot.com/search/label/Reflection'><strong>Reflection</strong><span class='menudescription'>category</span></a></li>
<li><a href='http://paparankasih.blogspot.com/search/label/Current%20Issues'><strong>Current Issues</strong><span class='menudescription'>category</span></a></li>
<li><a href='http://paparankasih.blogspot.com/search/label/Miscellaneous'><strong>Miscellaneous</strong><span class='menudescription'>category</span></a></li>
</ul>
</div>
</div>
_____________________________________
Contoh html code untuk gambar slide bergerak:
<div class='kcarcover'>
<div class='flexslider' id='kentcarousel'>
<ul class='slides'>
<li>
<a href='#'><img src='http://www.hdwallpapers.in/walls/vivid_flowers-wide.jpg'/></a>
</li>
<li>
<a href='#'><img src='http://www.get-free-wallpapers.com/wallpaper/preview/p8965-1295299437/peaceful-scenery.jpg'/></a>
</li>
<li>
<a href='#'><img src='http://electronicintifada.net/sites/electronicintifada.net/files/120704-quran-boys.jpg'/></a>
</li>
<li>
<a href='#'><img src='http://www.onislam.net/english/oimedia/onislamen/images/mainimages/Story%202.JPG'/></a>
</li>
<li>
<a href='#'><img src='http://in-islam.com/wp-content/uploads/2012/11/mosque-is-original-place-prayer.jpg'/></a>
</li>
<li>
<a href='#'><img src='http://cdn.productivemuslim.com/wp-content/uploads/2012/04/Creative_Wallpaper_The_stones_on_the_sand_015970_2.jpg'/></a>
</li>
<li>
<a href='#'><img src='http://i1.tribune.com.pk/wp-content/uploads/2011/01/muslim-kids-640x480.jpg'/></a>
</li>
<li>
<a href='#'><img src='http://religionnerd.com/wp-content/uploads/2010/05/Muslim-praying.jpg'/></a>
</li>
<li>
<a href='#'><img src='http://data3.whicdn.com/images/125976732/large.jpg'/></a>
</li>
<li>
<a href='#'><img src='http://tljax.files.wordpress.com/2012/08/father-child-walking-silhouette.jpg'/></a>
</li>
</ul>
</div>
</div>
</div>
___________________________________
Saya nasihatkan untuk pengguna pertama kali untuk search google tentang "basic html code for bloggers" untuk lebih memahami kata-kata saya ini.
Macam-macam boleh tambah dalam blog kalau sudah pandai memanipulasi html code. Kalendar, lagu, ruangan chatting dan sebagainya pun boleh dimasukkan untuk menjadikan blog anda lebih ceria dan interaktif.
Selamat mencuba ilmu saya yang tidak berguru ini. Saya pasti ada jalan lebih mudah. Kalau betul-betul berminat, bergurulah.
0 comments:
Post a Comment