Advertisement

Latest News

Showing posts with label Tips Dan Trik Ngeblog. Show all posts

  • Chrome Pointer Cursor
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-11/cur1054.cur), progress;}</style><a href="http://www.cursors-4u.com/cursor/2012/02/11/chrome-pointer.html" target="_blank" title="Chrome Pointer"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Chrome Pointer" style="position:absolute; top: 0px; right: 0px;" /></a>

Screenshots
Chrome Pointer


  • Blue Fire Pointer Cursor
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-11/cur1058.ani), url(http://cur.cursors-4u.net/cursors/cur-11/cur1058.png), progress;}</style><a href="http://www.cursors-4u.com/cursor/2012/03/03/blue-fire-pointer.html" target="_blank" title="Blue Fire Pointer"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Blue Fire Pointer" style="position:absolute; top: 0px; right: 0px;" /></a>

Screenshots
Electricity Lightning


  • Wavy Cursor Tail 10 Cursor
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-1/cur62.ani), url(http://cur.cursors-4u.net/cursors/cur-1/cur62.png), progress;}</style><a href="http://www.cursors-4u.com/cursor/2006/04/23/cur62.html" target="_blank" title="Wavy Cursor Tail 10"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Wavy Cursor Tail 10" style="position:absolute; top: 0px; right: 0px;" /></a>


Screenshots
Wavy Cursor Tail 10


  • The Alien Cursor
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-9/cur815.ani), url(http://cur.cursors-4u.net/cursors/cur-9/cur815.png), progress;}</style><a href="http://www.cursors-4u.com/cursor/2011/03/29/the-alien-15.html" target="_blank" title="The Alien"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="The Alien" style="position:absolute; top: 0px; right: 0px;" /></a>

Screenshots
The Alien


  • Cool Blue Outer Glow Cursor
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-2/cur116.cur), progress;}</style><a href="http://www.cursors-4u.com/cursor/2008/12/17/cool-blue-outer-glow-pointer.html" target="_blank" title="Cool Blue Outer Glow Pointer"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Cool Blue Outer Glow Pointer" style="position:absolute; top: 0px; right: 0px;" /></a>

Screenshots
Cool Blue Outer Glow Pointer


  • Animated Cool Shiny Blue Pointer Cursor
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/games/gam-11/gam1090.ani), url(http://cur.cursors-4u.net/games/gam-11/gam1090.png), progress;}</style><a href="http://www.cursors-4u.com/cursor/2010/02/24/animated-cool-shiny-blue-pointer.html" target="_blank" title="Animated Cool Shiny Blue Pointer"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Animated Cool Shiny Blue Pointer" style="position:absolute; top: 0px; right: 0px;" /></a>

Screenshots
Animated Cool Shiny Blue Pointer


  • Perfect World Online Spear Thingy Cursor
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/games/gam-13/gam1229.ani), url(http://cur.cursors-4u.net/games/gam-13/gam1229.png), progress;}</style><a href="http://www.cursors-4u.com/cursor/2011/03/03/perfect-world-online-spear-thingy.html" target="_blank" title="Perfect World Online Spear Thingy"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Perfect World Online Spear Thingy" style="position:absolute; top: 0px; right: 0px;" /></a>

Screenshots
Perfect World Online Spear Thingy


  • Rave Cursor
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-4/cur320.ani), url(http://cur.cursors-4u.net/cursors/cur-4/cur320.png), progress;}</style><a href="http://www.cursors-4u.com/cursor/2009/11/25/rave-2.html" target="_blank" title="Rave"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Rave" style="position:absolute; top: 0px; right: 0px;" /></a>

Screenshots
Rave


  • Psychedelic Pointer Cursor
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-2/cur197.ani), url(http://cur.cursors-4u.net/cursors/cur-2/cur197.png), progress;}</style><a href="http://www.cursors-4u.com/cursor/2009/04/22/psychedelic-pointer.html" target="_blank" title="Psychedelic Pointer"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Psychedelic Pointer" style="position:absolute; top: 0px; right: 0px;" /></a>

Screenshots
Psychedelic Pointer


  • Animated Fire Cursor
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/special/spe-1/spe19.ani), url(http://cur.cursors-4u.net/special/spe-1/spe19.png), progress;}</style><a href="http://www.cursors-4u.com/cursor/2005/10/18/spe19.html" target="_blank" title="Animated Fire"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Animated Fire" style="position:absolute; top: 0px; right: 0px;" /></a>

Screenshots
Animated Fire


  • Flame Cursor
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-1/cur15.ani), url(http://cur.cursors-4u.net/cursors/cur-1/cur15.png), progress;}</style><a href="http://www.cursors-4u.com/cursor/2005/07/26/cur15.html" target="_blank" title="Flame"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Flame" style="position:absolute; top: 0px; right: 0px;" /></a>

Screenshots
Flame
  • Heartless Background Cursor
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/symbols/sym-6/sym549.ani), url(http://cur.cursors-4u.net/symbols/sym-6/sym549.png), progress;}</style><a href="http://www.cursors-4u.com/cursor/2010/12/20/heartless-background.html" target="_blank" title="Heartless Background"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Heartless Background" style="position:absolute; top: 0px; right: 0px;" /></a>

Screenshots
Heartless Background
  • X-Steel Cursor
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-11/cur1028.ani), url(http://cur.cursors-4u.net/cursors/cur-11/cur1027.png), progress;}</style><a href="http://www.cursors-4u.com/cursor/2012/01/22/x-steel-wait.html" target="_blank" title="X-Steel - Wait"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="X-Steel - Wait" style="position:absolute; top: 0px; right: 0px;" /></a>

Screenshots
X-Steel - Wait
  • Defender Blue Cursor
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-4/cur395.ani), url(http://cur.cursors-4u.net/cursors/cur-4/cur395.png), progress;}</style><a href="http://www.cursors-4u.com/cursor/2010/09/08/defender-black-blue.html" target="_blank" title="Defender Black Blue"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Defender Black Blue" style="position:absolute; top: 0px; right: 0px;" /></a>

Screenshots
Defender Black Blue
  • Shiny Flashy Green Matrix Cursor
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-3/cur201.ani), url(http://cur.cursors-4u.net/cursors/cur-3/cur201.png), progress;}</style><a href="http://www.cursors-4u.com/cursor/2009/04/22/shiny-flashy-green-matrix.html" target="_blank" title="Shiny Flashy Green Matrix"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Shiny Flashy Green Matrix" style="position:absolute; top: 0px; right: 0px;" /></a>

Screenshots
Shiny Flashy Green Matrix
  • Batman Begins - Help Select Cursor
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-10/cur949.ani), url(http://cur.cursors-4u.net/cursors/cur-10/cur949.png), progress;}</style><a href="http://www.cursors-4u.com/cursor/2011/12/26/batman-begins-help-select.html" target="_blank" title="Batman Begins - Help Select"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Batman Begins - Help Select" style="position:absolute; top: 0px; right: 0px;" /></a>

Screenshots
Batman Begins - Help Select


Cara Membuat Recent Comment di Blog :
Masuk blogger > Design/Rancangan >> Page Element >> Add a Gadget >>HTML/Javascript









 Kemudian pastekan script di bawah ini di dalam box HTML/Javascript
<script style="text/javascript" src="http://panitah.googlecode.com/files/recentcomment-panitah.js>
</script><script style="text/javascript">var numcomments = 5;var showcommentdate = true;var showposttitle = true;var numchars = 100;var standardstyling = true;</script> <script src="http://howfreeblogs.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script>
Ganti tulisan berwarna merah howfreeblogs.blogspot.com dengan alamat blog atau web anda dan terakhir lihat hasilnya. 
   
Ada pilihan untuk memasukan username, warna background, dan jumlah follower. Button ini banyak manfaatnya, dengan tampilan yang tidak menyita banyak tempat tapi fungsional, dengan mudah pembaca blog kita bisa mem-follow atau sekedar melihat profil kita di twitter dengan membuka tab baru yang minimize. Siapa tahu, follower kita bertambah dengan pesat.
https://twitter.com/about/resources/followbutton

Cara Menambahkan Follow Button dari Twitter :
1. Login ke blogger
2. Pilih Rancangan kemudian Tambah Gadget
3. Pilih HTML/JavaScript
4. Masukan kode HTML berikut ini:

<a href="http://twitter.com/erichwiwit" class="twitter-follow-button" data-show-count="false">Follow @erichwiwit/a>
<script src="http://platform.twitter.com/widgets.js" type="text/javascript"></script>

5. Itulah contoh kodenya, lalu Simpan jika sudah selesai. 
   

Tutorialnya mudah, ikuti langkah-langkah dibawah ini :

Cara Pertama :
-Loggin blogger
-Klik Template
-Edit html <ceklist kotak kecil (expant witget)>



-Cari tag 
 
<!-- navigation -->

<b:include name='nextprev'/>
 susah carinya? tekan CTRL+F untuk memudahkan
Biasanya ada diatas tag 

<!-- feed links -->
<b:include name='feedLinks'/>
Kurang Lebih Seperti ini


<!-- navigation -->
<b:include name='nextprev'/> 
<!-- feed links -->
<b:include name='feedLinks'/>
-Kemudian hapus kode merah dan simpan template dan lihat hasilnya

Cara Kedua :
-Loggin blogger
-Klik Template
-Edti html <ceklist kotak kecil (expant witget)>
-Cari tag 
 yang Mirip seperti ini :


#blog-pager-newer-link {float:left}
#blog-pager-older-link {float:right}
#blog-pager {text-align:center}

Ganti Tiga tag Tersebut Menjadi seperti ini :


#blog-pager-newer-link {display:none;}

#blog-pager-older-link {display:none;}

#blog-pager {display:none;}


Terakhir simpan dan lihat hasilnya.

After The Jump adalah fitur yang memungkinkan Anda membuat post summaries      diupgrade dalam posting blog Anda, posting    sehingga muncul sebagai intro dengan link ke  Read More.

Membuat ini dalam posting blog Anda dapat dengan   mudah  benar dari editor posting, tanpa perlu untuk setiap    perubahan HTML.     Pertama, memutuskan mana    di   pos    Anda   ingin membuat after the jump, dan tempatkan kursor Anda dalam posisi itu:



Setelah kursor mouse anda ditempatkan pada titik melompat, cukup klik ikon Insert Jump toolbar:


Mengklik ikon akan memasukkan bar abu-abu pada titik kursordi mana  di pos tersebut  akan muncul.    Bar    dapat diseret , sehingga    Anda selalu dapat kembali   posisi bar setelah insersi.

Jika Anda tidak menggunakan editor posting baru,    Anda masih     dapat menyisipkan after the jump dalam mode Edit HTML dengan menambahkan    di mana Anda ingin posisi after the jump tersebut.



Setelah Anda ditetapkan pada lokasi after the jump dalam  waktu  posting,   Anda   siap    untuk  mempublikasikan      posting     Anda.        Setelah     penerbitan,  Anda akan melihat bahwa link  ditempatkan di mana Anda mengatur after the jump.
  


Untuk membuatnya ada beberapa langkah yang harus anda ikuti, yaitu :
  1. Mempunyai facebook fans page dan tahu alamat URL nya.
    Ini adalah syarat wajib jika anda ingin mengikuti tutorial ini dari awal. Saya sudah membuat facebook fans page untuk blog panitah news , URL nya adalah http://www.facebook.com/informasicpns. Ingat ya facebook fans page, bukan facebook personal. 
  2. Masuk ke halaman facebook developer Social Plugin, link http://developers.facebook.com/docs/plugins/.
  3. Karena di sini saya akan membuat  like box, pasti saya klik like box.
  4. Isilah form yang tersedia untuk membuat like box sesuai keinginan anda.
    Anda bisa melihat preview pada bagian sebelah kanan blog saya ini.
Penjelasan form :
  • Facebook Page URL : URL facebook fans page yang akan dibuatkan like box
  • Width : lebar like box yang akan dibuat
  • Height : tinggi like box yang akan dibuat
  • Color Scheme : pilihan warna, hanya ada 2 light (putih) dan dark (hitam)
  • Show Faces : Menentukan apakah foto user yang mengklik like akan ditampilkan atau tidak
  • Border Color : Menentukan warna garis tepi like box (warna yang digunakan dalam format hexa, misalnya #ffffff untuk warna putih)
  • Stream : Menentukan apakah isi post terakhir fans page akan ditampilkan atau tidak
  • Show Header : Menentukan apakah tulisan “Temukan kami di facebook” akan ditampilkan atau tidak
Jika sudah selesai, klik tombol Get Code.
Akan muncul pop-up window berisi kode yang harus anda letakkan di blog. Ada kode HTML5, XFBML dan Iframe yang bisa anda pilih. Saya pilih format iframe agar mudah diletakkan di widget wordpress. Copy paste kode itu ke tempat yang anda inginkan.


Cara Membuat Artikel Terkait Pada Sidebar :
 
1. Loging pada blog anda
2. Rancangan >> Edit HTML (centang "Expand Template Widget")
3. Masukan kode dibawah ini tepat dibawah kode ]]></b:skin>
<script type="text/javascript">
//<![CDATA[

var relatedTitles = new Array();

var relatedTitlesNum = 0;

var relatedUrls = new Array();

function related_results_labels(json) {

for (var i = 0; i < json.feed.entry.length; i++) {

var entry = json.feed.entry[i];

relatedTitles[relatedTitlesNum] = entry.title.$t;

for (var k = 0; k < entry.link.length; k++) {

if (entry.link[k].rel == 'alternate') {

relatedUrls[relatedTitlesNum] = entry.link[k].href;

relatedTitlesNum++;

break;

}

}

}

}

function removeRelatedDuplicates() {

var tmp = new Array(0);

var tmp2 = new Array(0);

for(var i = 0; i < relatedUrls.length; i++) {

if(!contains(tmp, relatedUrls[i])) {

tmp.length += 1;

tmp[tmp.length - 1] = relatedUrls[i];

tmp2.length += 1;

tmp2[tmp2.length - 1] = relatedTitles[i];

}

}

relatedTitles = tmp2;

relatedUrls = tmp;

}

function contains(a, e) {

for(var j = 0; j < a.length; j++) if (a[j]==e) return true;

return false;

}

function printRelatedLabels() {

var r = Math.floor((relatedTitles.length - 1) * Math.random());

var i = 0;

document.write('<ul>');

while (i < relatedTitles.length && i < 20) {

document.write('<li><a href="' + relatedUrls[r] + '">' + relatedTitles[r] + '</a></li>');

if (r < relatedTitles.length - 1) {

r++;

} else {

r = 0;

}

i++;

}

document.write('</ul>');

}

//]]>

</script>

4. Kemudian cari kode yang mirip seperti dibawah ini :

<b:if cond='data:post.labels'>
<data:postLabelsLabel/>

<b:loop values='data:post.labels' var='label'>

<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>

</b:loop>

</b:if>
5. Terus ganti kode tersebut menjadi seperti ini :

<b:if cond='data:post.labels'><data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>

<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=15&quot;' type='text/javascript'/>

</b:if>

</b:loop>

</b:if>
NB : kode yang berwarna merah menyatakan banyak artikel terkait yang akan ditampilkan.
6. Simpan atau Save.

7. Selanjutnya buka menu tata letak >> tambah gadget (HTML/JavaScript) lalu masukkan kode dibawah ini.

<script type="text/javascript">
removeRelatedDuplicates();

printRelatedLabels();

</script>
8. Beri judul dan simpan.

* Karena artikel terkait ini masih muncul di postingan dan homepage, jadi kita akan mensettingnya agar muncul hanya pada postingan saja.

Caranya :
1. Buka menu edit HTML (centang "Expand Template Widget")
2. Cari kode yang seperti ini :

<b:widget id='HTML10' locked='false' title='Artikel Terkait Sidebar' type='HTML'>
<b:includable id='main'>


<b:if cond='data:blog.pageType == "item"'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>

<h2 class='title'><data:title/></h2>

</b:if>

<div class='widget-content'>

<data:content/>

</div>

<b:include name='quickedit'/>


</b:if>
</b:includable>
</b:widget>
Keterangan : kode yang berwarna biru adalah judul widget artikel terkait tadi yang sobat buat. Kode HTML10 abaikan saja, karena tergantung pada banyak widget kita, kode yang berwarna merah adalah kode yang harus sobat sisipkan.
Advertisement