Monday

Cara Pasang Statistik Pengunjung di Blog

Monday
0 comments
Cara Pasang Statistik Pengunjung di Blog untuk newbie. Kali ini kita akan belajar memasang statistik jumlah pengunjung blog online dan mengetahui punca datangnya pengunjung blog anda.

Kita terus ke caranya:

1. Masuk ke akaun Blogspot anda
2. Design >> Add a gadget
3. HTML/JavaScript

Masukkan Kode ini

<center>
<script type="text/javascript" src="http://feedjit.com/serve/?vv=650&amp;tft=3&amp;dd=09514fa85a964fb42396a151ec40740f5873991e9dcb9333a452d2528467fab1&amp;wid=bd8b9f6fef46217e&amp;pid=b35629837c39c6e5&amp;proid=da9d6cdf1790743e&amp;bc=FFFFFF&amp;tc=B05AB0&amp;brd1=8D8294&amp;lnk=DE31C4&amp;hc=FFFFFF&amp;hfc=838B99&amp;btn=C99700&amp;ww=200&amp;wne=10&amp;wh=Live+Traffic+Feed&amp;hl=1&amp;hlnks=1&amp;hfce=1&amp;srefs=1&amp;hbars=1"></script><noscript><a href="http://feedjit.com/">Feedjit Live Blog Stats</a></noscript>
</center>

Save/simpan.

Untuk mengetahui jumlah pengunjung blog anda yang sedang online boleh pasang kode dibawah ini;



<center><!-- Start FastOnlineUsers.com -->
<a href="http://www.fastonlineusers.com"><script type="text/javascript" src="http://fastonlineusers.com/on3.php?d=www.wanesweb.blogspot.com"></script> Best Friend </a><br /><a href="http://onlineprestigecasino.com"></a>
<!-- End FastOnlineUsers.com --></center>
</center>
SAVE/simpan.

Nota: Anda ganti alamat URL www.wanesweb.blogspot.com dengan URL blog anda. Anda juga boleh ganti Best Friend dengan apa-apa perkataan yang anda suka (Perkataan ini akan berada selepas statistik pengunjung online).

Semoga Cara Pasang Statistik Pengunjung di Blog ini dapat memberi menafaat kepada anda. Mungkin anda berminat untuk memasang Random Post di Sidebar. Tuhan memberkati.

read more

Cara Membuat Read More Otomatis

0 comments
Cara Membuat Read More Otomatis untuk newbie. Selepas memasangnya ia akan bekerja untuk kita. Dengan Read More juga blog kita lebih kemas dan teratur. Sebelum melangkah ke cara membuat read more otomatis di blogspot lebih baik kita tahu apa itu read more? dan apa fungsi read more? Read more atau " Baca Selengkapnya " berfungsi untuk meminima halaman blog agar paparannya lebih rapi dan menarik. Read more otomatis ini akan memotong post atau artikel yang panjang menjadi pendek ditampilkan di halaman depan. Anda juga boleh menentukan jumlah huruf yang dipaparkan, Artikal lengkap hanya dapat dibaca oleh pengunjung dengan menekan “Read more” atau “baca selengkapnya” Sekarang terus kepada cara membuat read more otomatis.

1.Login ke Blogspot anda
2.Buka halaman design > Edit HTML > centang Expand template widget
3.Cari kode </head> (gunakan CTRL + F untuk mempermudah pencarian)
4.Paste kode berikut tepat dibawah </head>

<script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://script-bamz-us.googlecode.com/files/read-moreotomatis.js' type='text/javascript'/>


5.Seterusnyanya cari kode <data:post.body/> atau <p><data:post.body/></p> .
Jika terdapat 2 kode yang sama, gunakan atau ganti kode yang pertama.
6.Ganti kode tersebut dengan kode dibawah ini

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<span class='rmlink' style='float:right;padding-top:20px;'>
<a expr:href='data:post.url'><img src="http://lh3.ggpht.com/_kTaFrEr_318/SkKGIoU-oPI/AAAAAAAAA9g/5A_nTHvFgiI/readmore_thumb%5B2%5D.gif"></img></a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

7.Biasakan menekan Preview sebelum di SAVE/simpan
8.Selesai simpan template dan lihat hasilnya

Cara membuat Read More otomatis di Blogspot berwarna merah ini boleh anda ubah. Berikut adalah keterangannya :
  • summary_noimg = 430; apabila artikel anda tanpa gambar satupun maka yang akan tampil pada halaman depan adalah 430 huruf
  • summary_img = 340; apabila artikel anda berisi gambar maka yang akan tampil pada halaman depan adalah 340 huruf dan gambar
  • img_thumb_height = 100; ini adalah ukuran tinggi gambar / thumbnail yang akan muncul di halaman depan
  • img_thumb_width = 120; sedangkan yang ini adalah lebar gambar / thumbnail di halaman depan.
  • Anda juga boleh mengganti Icon read more http://lh3.ggpht.com/_kTaFrEr_318/SkKGIoU-oPI/AAAAAAAAA9g/5A_nTHvFgiI/readmore_thumb%5B2%5D.gif dengan URL icon yang anda inginkan. Sekiranya anda ingin mengubah Icon Read more menjadi tulisan saja seperti ini " >> Read more ", maka anda hanya perlu menghapus / mengganti kode <img src="http://lh3.ggpht.com/_kTaFrEr_318/SkKGIoU-oPI/AAAAAAAAA9g/5A_nTHvFgiI/readmore_thumb%5B2%5D.gif"></img>menjadi tulisan >> Read more atau Baca selengkapnya dll.

Semoga cara membuat read more otomatis di blog ini bermanfaat untuk anda. Selamat mencoba dan semoga berhasil. Tuhan memberkati.

read more

Saturday

Cara Tukar Newer dan Older Post Jadi Tajuk di Footer

Saturday
0 comments
Cara tukar newer post dan older post menjadi tajuk di footer untuk newbie. Jika anda menggunakan bahasa, bererti catatan lama dan baru ditukar kepada tajuk post seperti dalam gambar:


Mari kita terus kepada langkah-langkahnya:

Login ke akaun Blogspot anda

- Pergi ke design >> edit HTML >> Klik expand widget template.
- Klik ctrl + F : taip
- copy dan paste code di bawah sebelum code ini.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>


- Setelah itu. terus SAVE.

- Sekarang pergi lagi ke design >> page element >> add widget >> html/java script
- Copy kode di bawah dan pastekan kedalam html/java script tersebut:

<!-- Post title blog pager by BloggerSentral.com START -->
<style type="text/css">
#blog-pager-newer-link {font-size:85%;width:200px;text-align:left;}
#blog-pager-older-link {font-size:85%;width:200px;text-align:right;}
</style>
<script type="text/javascript">
$(document).ready(function(){
var newerLink = $("a.blog-pager-newer-link").attr("href");
$("a.blog-pager-newer-link").load(newerLink+" .post-title:first", function() {
var newerLinkTitle = $("a.blog-pager-newer-link:first").text();
$("a.blog-pager-newer-link").text("<< " + newerLinkTitle);
});
var olderLink = $("a.blog-pager-older-link").attr("href");
$("a.blog-pager-older-link").load(olderLink+" .post-title:first", function() {
var olderLinkTitle = $("a.blog-pager-older-link").text();
$("a.blog-pageLinkr-older-link").text(olderLinkTitle + " >>");//rgt
});
});
</script>
<!-- Post title blog pager by BloggerSentral.com END -->


Tarik dan simpan widget tadi di bahagian bawah catatan blog. ( atau dimana-mana bahagian bawah )

Yang terakhir sila SAVE dan tengok hasilnya. Jika menjadi, tahniah! Sekiranya tidak boleh komen. Mungkin juga anda berminat Membuat Archive Scroll. Tuhan memberkati.

read more

Friday

Cara Menghilangkan Navbar di Blog

Friday
0 comments
Cara menghilangkan navbar di Blogspot untuk newbie. Beberapa blogger yang ingin kelihatan blog mereka kemas dengan menghilangkan navbar (navigation bar).

Navbar adalah tombol navigasi yang berada di paling atas layout blog anda, yang biasanya terdiri dari tombol admin, entry baru, email, ataupun tombol masuk/keluar. Kita terus kepada caranya.

- Login ke akaun Blogspot anda

- Masukl ke dashboard blog anda
- Cari Edit HTML mungkin ada di Template/design, lalu dari Edit HTML, klik > Lanjutkan
- Maka akan muncul kode HTML , selanjutnya anda cari kode ini, ]]></b:skin>

- ( Tekan tombol Ctrl+F lalu masuknya kode ]]></b:skin> )
- Langkah seterusnya masukkan kode berikut ini di atas atau sebelum kode ]]></b:skin>

Kode yang harus anda masukkan:



#navbar-iframe {

height:0px;

visibility:hidden;

display:none

}



- Terakhir silahkan Preview dahulu dan jika nabvar telah hilang, anda klik Save Template
- Selesai, dan jika anda ingin memunculkan kembali navbar maka anda hanya menghapus kode yang anda masukkan tadi.


Semoga info ini bermanfaat, Mungkin juga anda ingin Menghilangkan Widget di Blog. Semoga terus sukses dan Tuhan memberkati.


read more

Wednesday

Cara Membuat Archive Scroll

Wednesday
0 comments
Cara membuat archive scroll untuk newbie. Fungsi scroll dapat menjimatkan ruangan dan meringankan paparan blog. Kita terus kepada cara membuatnya.

Pertama sekali kita harus membuat/menambah Archive (mengikut judul pilihan anda)

• Login ke blogger
• Klik Tata Letak
• Klik Design/Elemen Halaman
• Klik Add a gadget/Tambah elemen=> Blog Archive
• Anda harus pilih gaya Hierarki
• SAVE.

Pada menu diatas Itu belum terdapat fungsi scroll, untuk membuatnya menjadi fungsi scroll ikuti langkah-langkah berikut;

• Klik Design/Elemen Halaman
• Klik Edit Html
• Tandakan centang pada tulisan Expand Widget Template
• Lalu Anda cari kode seperti ini

<b:widget id='BlogArchive2' locked='false' title='Blog Archive' type='BlogArchive'>


Anda akan menemukan kode lengkapnya seperti ini :

<b:widget id='BlogArchive2' locked='false' title='Blog Archive' type='BlogArchive'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<div style='overflow:auto; width:ancho; height:100px;'>
<div id='ArchiveList'>
<div expr:id='data:widget.instanceId + &quot;_ArchiveList&quot;'>
<b:if cond='data:style == &quot;HIERARCHY&quot;'>
<b:include data='data' name='interval'/>
</b:if>
<b:if cond='data:style == &quot;FLAT&quot;'>
<b:include data='data' name='flat'/>
</b:if>
<b:if cond='data:style == &quot;MENU&quot;'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div></div>
<b:include name='quickedit'/>
</div>
</b:includable>
<b:includable id='flat' var='data'>
<ul>
<b:loop values='data:data' var='i'>
<li class='archivedate'>
<a expr:href='data:i.url'><data:i.name/></a> (<data:i.post-count/>)
</li>
</b:loop>
</ul>
</b:includable>
<b:includable id='menu' var='data'>
<select expr:id='data:widget.instanceId + &quot;_ArchiveMenu&quot;'>
<option value=''><data:title/></option>
<b:loop values='data:data' var='i'>
<option expr:value='data:i.url'><data:i.name/> (<data:i.post-count/>)</option>
</b:loop>
</select>
</b:includable>
<b:includable id='interval' var='intervalData'>
<b:loop values='data:intervalData' var='i'>
<ul>
<li expr:class='&quot;archivedate &quot; + data:i.expclass'>
<b:include data='i' name='toggle'/>
<a class='post-count-link' expr:href='data:i.url'><data:i.name/></a>
<span class='post-count' dir='ltr'>(<data:i.post-count/>)</span>
<b:if cond='data:i.data'>
<b:include data='i.data' name='interval'/>
</b:if>
<b:if cond='data:i.posts'>
<b:include data='i.posts' name='posts'/>
</b:if>
</li>
</ul>
</b:loop>
</b:includable>
<b:includable id='toggle' var='interval'>
<b:if cond='data:interval.toggleId'>
<b:if cond='data:interval.expclass == &quot;expanded&quot;'>
<a class='toggle' expr:href='data:widget.actionUrl + &quot;&amp;action=toggle&quot; + &quot;&amp;dir=close&amp;toggle=&quot; + data:interval.toggleId + &quot;&amp;toggleopen=&quot; + data:toggleopen'>
<span class='zippy toggle-open'>&#9660; </span>
</a>
<b:else/>
<a class='toggle' expr:href='data:widget.actionUrl + &quot;&amp;action=toggle&quot; + &quot;&amp;dir=open&amp;toggle=&quot; + data:interval.toggleId + &quot;&amp;toggleopen=&quot; + data:toggleopen'>
<span class='zippy'>
<b:if cond='data:blog.languageDirection == &quot;rtl&quot;'>
&#9668;
<b:else/>
&#9658;
</b:if>
</span>
</a>
</b:if>
</b:if>
</b:includable>
<b:includable id='posts' var='posts'>
<ul class='posts'>
<b:loop values='data:posts' var='i'>
<li><a expr:href='data:i.url'><data:i.title/></a></li>
</b:loop>
</ul>
</b:includable>
</b:widget>



Kode warna merah dan hijau adalah kode yang ditambahkan kedalam script tersebut. Kode warna 100px yang dicetak tebal adalah tinggi dari elemen tadi, Anda boleh tukar mengikut kesesuaian anda.

Jangan lupa simpan/SAVE. Mungkin anda juga ingin meringankan paparan blog dengan Menghilangkan Widget di Blog. Semoga info ini bermanafaat dan semoga Tuhan memberkati.

read more
 

Pengikut