RELATED POST

Tampilkan postingan dengan label TIPS NGEBLOG. Tampilkan semua postingan
Tampilkan postingan dengan label TIPS NGEBLOG. Tampilkan semua postingan

Cara Memasang dan Membuat Scroll pada Blog Archive

Sebenarnya pemasangan fungsi scroll pada blog itu dengan satu kode saja bisa, tapi mungkin pengguna blog masih bingung dan mencari kata kunci yang tepat, nah pada hari ini saya ingin memberikan kode fungsi scroll, sebelumnya juga saya pernah menulis tentang Bagaimana Cara Memasang Scroll pada Widget, tapi langsung saja pada tujuan awal silahkan di simak:
Cara Memasang Scoll pada Archive Blog
  1. Login ke Blogger
  2. Di halaman Dasboard, pilih Template
  3. Kemudian pilih Edit HTML [BACKUP DULU]
  4. Cari kode ini : <div id='ArchiveList'> lebih cepatnya gunakan CTRL+F
  5. Setelah ketemu taruh kode <div style='overflow:auto; width:ancho; height:200px;'> ini tepat diatasnya kode <div id='ArchiveList'>
  6. Kemudian beri kode tambahan </div> sebelum kode <b:include name='quickedit'/>
  7. Selesai
    Catatan : Sebelum kalian menggunakan tutorial ini sebelumnya kalian harus tambahkan HTML/Java Script - Blog Archive pada Tata Letak blog kalian [INFO]
  • Jika masih bingung kalian bisa melihat tata letak yang benar seperti dibawah ini :

<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:200px;'>
  <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>


Save dan lihat hasilnya, semoga bermanfaat jangan lupa komentarnya ya Bro, :)

Cara Membuat Gambar Membesar saat disentuh Kursor di Blog

Pangeran Tinta - Cara Membuat Gambar Membesar saat disentuh Kursor di Blog, Kli ini saya akan mengepost tutorial bagaimana cara mengedit HTML, ketika gambar disentuh cursor beberapa saat maka gambar tersebut akan membesar atau bahasa kerenya image magnifity Bro hehe


  • Masuk ke akun blogger kalian.
  • Pilih Template >>>> Edit HTML.
  • Cari kode ]]></b:skin>  CTRL+F pada keyboard agar lebih mudah
  • Taruh kode di bwh tepat di atas kode tersebut kode ini ni Bro >>>> ]]></b:skin>

.post img, table.tr-caption-container { border:none; max-width:560px; height:auto; -o-transition: all 0.5s; -moz-transition: all 0.5s; -webkit-transition: all 0.5s; }
.post img:hover { -o-transition: all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transform: scale(1.5); -o-transform: scale(1.5); -webkit-transform: scale(1.5); -webkit-border-radius: 0px 0px; -moz-border-radius: 0px / 0px; -webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.6); }

  • Save dan lihat hasilnya :)
Semoga Tutorial Cara Membuat Gambar Membesar saat disentuh Kursor diatas bermanfaat buat kalian Bro, jik da yang di tanyakan silahkan komentar :)

Auto Source Link Ketika tulisan Blog di Copy Paste

Halo Bro Pangeran Tinta bagaimana kabarnya? hem.. kali ini saya ingin berbagi mengenai bagaimana cara membuat auto source link apabila tulisan di blog di copas alias copy (bukan kopi lho ya Brp hehe) copy dan paste hehe, mungkin di antara kalian memperbolehkan asal menyertakan sumber halaman, ada juga yang tidak boleh sama sekali ya mungkin karena susah membuat tulisan atau gimana ya Bro ada juga sih cara yang DISABLE RIGHT CLICK (Copy - Paste) tapi kali ini saya ingin memberikan jika tulisan kita di copy - paste maka akan muncul sendiri, nah ini sebenarnya tidak perlu kalau blogger itu bijaksana menghromati karya atau tulisan orang lain Bro hehe di simak ya bro.

Cara Membuat Auto Source Link Saat Artikel di Copy-Paste
  • Login ke Bloggger
  • Klik Template >>> Edit html [BACKUP DULU] untuk jaga-jaga
  • Copy dan paste kode dibawah ini, tepat diatas kode <body>
script by infonetmu

 <script type='text/javascript'> if(document.location.protocol==&#39;http:&#39;){ var Tynt=Tynt||[];Tynt.push(&#39;cXIEhKYVSr4lJ5adbi-bpO&#39;);Tynt.i={&quot;ap&quot;:&quot;Sumber Artikel Dari: &quot;}; (function(){var s=document.createElement(&#39;script&#39;);s.async=&quot;async&quot;;s.type=&quot;text/javascript&quot;;s.src=&#39;http://infonetmu.googlecode.com/files/sumber-otomatis.js&#39;;var h=document.getElementsByTagName(&#39;script&#39;)[0];h.parentNode.insertBefore(s,h);})(); } </script>

  • Kemudia save template, mudah bukan Bro? untuk tutorial pilihan lainya KLIK DISINI

Copy+paste image
Mudah kan bro, semoga bermanfaat ya hehe :D jika kurang paham komentar saja ya Bro, :D

Membuat Widget Semut Jalan-jalan di Blog

Semut dalam blog
Membuat Widget Semut Jalan-jalan di Blog - Pangeran Tinta, Halo bro kali ini saya kan menjelaskan tentang bagaimana cara memasang widget semut yang jalan-jalan di blog heheheh caranya mudah kok bro cukup ikuti step-step yang ada di bawah ini ya :D


Membuat Semut yang mondar-mandir dalam blog, berikut langkah-langkahnya:
  • Login ke Blogger DAHULU
  • Pilih dashboard >>> Tata Letak >>> Tambahkan Gadget >>> HTML/Javascript [INFO]
  • Masukkan Script dibawah ini 
<div style="display:scroll; position:fixed; top:150px; center:20px;"><img border="0" src="http://i1217.photobucket.com/albums/dd381/funywrld/semutfuny.gif" /> </div>
  • Silahkan tulisan warna Merah kalian rubah sesuai kebutuhan kalian
  • Save dan lihat hasilnya Bro :D

CATATAN: top:150px; center:20px adalah kode untuk meletakkan hambar .gif tadi dan kode  adalah gambar .gif semut jadi apabila kalian punya gambar yang bergerak lainya bisa di ganti dengan gambar tersebut bisa istilahnya sesuka hati Bro gitu lho yang penting gambarnya bergerak hehe, mungkin gajah mondar-mandir kek atau apa kwkwkwkw :D semoga bermanfaat, pembaca yang bijaksana akan meninggalkan komentar :D untuk tutorial lainya KLIK DISINI

Cara Membuat Live Emoticon Kedalam Komentar

Cara Membuat Live Emoticon Kedalam Komentar - Pangeran Tinta, Biasanya dalam komentar hanya bisa membuat tulisan semata, tetapi dengan sedikit editan maka anda bisa secara otomatis menambahkan emoticon yang unik kedalam komentar blog Bro semua.

Hasilnya akan terlihat seperti gambar di bawah ini Bro, sudah tau kan?



Tutorial untuk letakkan emotion icon dalam komen adalah seperti berikut.

1. Dari dashboard >> design >> edit HTML >> Expand widget template [INFO]



2. Backup template (download full template) untuk jaga-jaga aja bro. (INFO)

3. Menggunakan fungsi find,(ctrl + F) cari </body> dan letakkan kod di bawah sebelum </body>


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

contoh:


4. Menggunakan fungsi find lagi, (ctrl + F), cari <b:if cond='data:post.embedCommentForm'> dan letakkan kode di bawah setelah kode <b:if cond='data:post.embedCommentForm'>


<div style='-moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; width: 369; text-align: left; border: 1px solid #cccccc; padding: 5px; background: #eeeddf; height:86'>
<b>To Use A Smiley In Your Comment, Simply Add The Characters Beside Your Choosen Smiley To The Comment:
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/21.gif' width='18'/> :))
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/71.gif' width='18'/> ;))
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/5.gif' width='18'/> ;;)
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/4.gif' width='18'/> :D
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/3.gif' width='18'/> ;)
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/10.gif' width='18'/> :p
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/20.gif' width='22'/> :((
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/1.gif' width='18'/> :)
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/2.gif' width='18'/> :(
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/8.gif' width='18'/> :X
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/12.gif' width='18'/> =((
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/13.gif' width='18'/> :-o
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/7.gif' width='20'/> :-/
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/11.gif' width='18'/> :-*
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/22.gif' width='18'/> :|
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/35.gif' width='24'/> 8-}
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/100.gif' width='31'/> :)]
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/102.gif' width='44'/> ~x(
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/104.gif' width='30'/> :-t
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/66.gif' width='18'/> b-(
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/62.gif' width='18'/> :-L
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/14.gif' width='34'/> x(
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif' width='30'/> =)) <a href='http://bit.ly/18pii37'target="_blank"><small>Grab tutorial here</small></a>
</b>
</div>


contoh:


5. Save dan lihat hasilnya di dalam komentar bro semua :D

Semoga bermanfaat silahkan komentar jika ada yang di tanyakan kalau berhasil share sini juga ya Bro :D

Cara Membuat Sliding Share Melayang Di Blog


Cara Membuat Sliding Share Melayang Di Blog - Tutorial kali ini adalah membuat share button slideng dari tepi blog, share button ini mengikuti scroll bro jadi di pastikan pengunjung akan melihat hal tersebut, bisa di lihat dari gambar di bawah:
Share Widget

1. Login Blogger
2. Pilih Add Gadget >> Pilih HTML/JavaScript. [INFO]

Script By lateshack


3. Copy kode di bawah kedalam ruangan HTML/JavaScript yang telah anda buka tadi
<script language="javascript" type="text/javascript">var _10I='==wOpkSZwF2YzV2XoUGchN2cl5WdoUGdpJ3duQnbl1Wdj9GZ7kSMwEzXoQGbph2Qk5WZwBXYuw2TspwOdBzWpcCZhVGangSZtFmTnFGV5J0c05WZtVGbFRXZn5CduVWb1N2bkBSPgw2TsBichZnC7kCTSVlL05WZtV3YvRGK05WZu9Gct92QJJVVlR2bj5WZrcSPsJXdmcyKpIXZyJXZmVmcuQnbl1Wdj9GZoQnbl52bw12bDlkUVVGZvNmbltyJ9YWZyZyJrcyav1zYyNHdld2Pv02bj5icvRXYjNXdmJ2bs1Gdo5SawF2LvoDc0RHanASPgMmcz5SMwEzXKsTKnQHcpJ3YzdCK05WZtVGbFVGdhVmcj5CduVWb1N2bkBSPgEDMx8FIyFmd7cSRzUidpR2LDNTJFNTJ2lGZvM0MlU0MlA3LDNTJFNTJh9yQzUyajFGSwITJ0NXZ0FGTFNTJyITJt92Yus2YhhGdzVGdhxmL3d3dv8SQzUCc0RHayITJENTJmVmcoBjMlE2QzUCMyUyajFGa0NXZ0FGTFNTJyITJCNTJl52buF0MlkXYsB3cpRmMyUCRzUSZslHdzBjMlA3QzUyJ9UGchN2cl9FIyFmd';var _0x362a=["ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=","","charAt","indexOf","fromCharCode","length"];function II1(_0x6ea4x2){var _0x6ea4x3=_0x362a[0];var _0x6ea4x4,_0x6ea4x5,_0x6ea4x6,_0x6ea4x7,_0x6ea4x8,_0x6ea4x9,_0x6ea4xa,_0x6ea4xb,_0x6ea4xc=0,_0x6ea4xd=_0x362a[1];do{_0x6ea4x7=_0x6ea4x3[_0x362a[3]](_0x6ea4x2[_0x362a[2]](_0x6ea4xc++));_0x6ea4x8=_0x6ea4x3[_0x362a[3]](_0x6ea4x2[_0x362a[2]](_0x6ea4xc++));_0x6ea4x9=_0x6ea4x3[_0x362a[3]](_0x6ea4x2[_0x362a[2]](_0x6ea4xc++));_0x6ea4xa=_0x6ea4x3[_0x362a[3]](_0x6ea4x2[_0x362a[2]](_0x6ea4xc++));_0x6ea4xb=_0x6ea4x7<<18|_0x6ea4x8<<12|_0x6ea4x9<<6|_0x6ea4xa;_0x6ea4x4=_0x6ea4xb>>16&0xff;_0x6ea4x5=_0x6ea4xb>>8&0xff;_0x6ea4x6=_0x6ea4xb&0xff;if(_0x6ea4x9==64){_0x6ea4xd+=String[_0x362a[4]](_0x6ea4x4);} else {if(_0x6ea4xa==64){_0x6ea4xd+=String[_0x362a[4]](_0x6ea4x4,_0x6ea4x5);} else {_0x6ea4xd+=String[_0x362a[4]](_0x6ea4x4,_0x6ea4x5,_0x6ea4x6);} ;} ;} while(_0x6ea4xc<_0x6ea4x2[_0x362a[5]]);;return _0x6ea4xd;} ;function OOI(_0x6ea4xf){var _0x6ea4x10=_0x362a[1],_0x6ea4xc=0;for(_0x6ea4xc=_0x6ea4xf[_0x362a[5]]-1;_0x6ea4xc>=0;_0x6ea4xc--){_0x6ea4x10+=_0x6ea4xf[_0x362a[2]](_0x6ea4xc);} ;return _0x6ea4x10;} ;eval(II1(OOI(_10I)));</script><script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
/*<![CDATA[*/
jQuery(document).ready(function(){jQuery(".latesthack").hover(function(){jQuery(this).stop().animate({left:"0"},"medium")},function(){jQuery(this).stop().animate({left:"-70"},"medium")},500)});
/*]]>*/
</script>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js"></script>
<style type="text/css">
.latesthack {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiE4A4qhIZZnP4kg5zZ8G2tGTY0dTBUd3WrMQ2ZwkPBtfHRlBWNoW6GuJdfHNTe6lYoRmiZ58L5f41Gp9KeV5T9xy1pRb7dWHEjcSWfA9UnL1abp-S23SCnQlllKM2EaCWtUTeMcX0xXnc/s320/latesthack.com-image.png") no-repeat scroll right top transparent !important;
display: block;float: left;height: auto;
padding: 0 45px 0 0px;
width: 65px;
z-index: 99999;
position:fixed;
left:-70px;
top:20%;
}
.latesthack div {
border:none;
position:relative;
display:block;
}
</style>
<div class="latesthack" style="">
<div>

<div class="addthis_toolbox addthis_floating_style addthis_counter_style" >
<a class="addthis_button_facebook_like" fb:like:layout="box_count"></a>
<a class="addthis_button_tweet" tw:count="vertical"></a>
<a class="addthis_button_google_plusone" g:plusone:size="tall"></a>
<a class="addthis_counter"></a>
<p style='font-size:8px; font-weight:bold; text-align:center;margin-top:10px;'><a href='http://bit.ly/1ej4WGH' >Get This</a></p>
</div>
</div></div>
4. Save dan lihat hasilnya :D

SEmoga bermanfaat bro, kalau ada yang di tanyakan komentar saja ya oke, dengan senang hati saya akan mnjawab :D

Menjadikan Cursor Berkilauan Bintang (haha)

Menjadikan Cursor Berkilauan Bintang (haha) - Pangeran Tinta, Tutorial kli ini akan menunjukkan bagaimana menjadikan cursor anda menghasilkan 'bintang²' yang bersinar dan berjatuhan. Terdapat berbagai jenis warna yang telah diletakkan untuk memudahkan pemilik blog menyesuaikan terhadap template blog atau warna kesukaan (PILIH TEMPLATE BLOGGER ANDA DI SINI). Kata lain yang mungkin sesuai ialah untuk menjadikan cursor anda sparkle.(tak tahu istilah betul apa untuk effect ini.:)

Kalau masih kurang paham bagaimana hasilnya, boleh lihat contoh gambar di bawah.:)
Best Blog

Sebelum itu, tutorial ini juga bisa digambungkan dengan cara mengganti cursor blog pada blog anda. Paham kan Bro? jadi 2 kode bisa bekerja bersama hehehe

Tetapi kali ini langkah yang harus di kerjakan untuk memberi efek sparkle pada blog, ikuti langkah berikut Bro:

1. Dari dashboard >> design >> add a gadget >> HTML/javascript [INFO]

2. Pada ruangan HTML/javascript, masukkan kod berikut.

<script src="URL JAVA SCRIPT" type="text/javascript"></script>


Note: untuk URL JS, tukarkan dengan kod berikut mengikut warna sprakle yang anda kehendaki

Biru - https://sites.google.com/site/
pangerantinta/java-script/biru.js

Hitam -
  https://sites.google.com/site/pangerantinta/java-script/black.js

Hijau - https://sites.google.com/site/pangerantinta/java-script/lawngreen.js

Ungu - https://sites.google.com/site/pangerantinta/java-script/purple.js

Putih - https://sites.google.com/site/pangerantinta/java-script/putih.js

Pink - https://sites.google.com/site/pangerantinta/java-script/salmon.js

Kuning -https://sites.google.com/site/pangerantinta/java-script/yellow.js

Hijau kebiruan - https://sites.google.com/site/pangerantinta/java-script/aqua.js

Contoh Jika anda ingin memasang sparkle warna biru pada cursor blog anda bro:

<script src="https://sites.google.com/site/pangerantinta/java-script/biru.js" type="text/javascript"></script>


3. Klau sudah memasukkan kode, save dan lihat hasilnya ya Bro, :D

Selamat mencoba, jika tidak paham silahkan komentar di kolom komentar di bawah, terimakasih bro :D

Cara membuat Following Star pada Cursor dalam Blog

Cara membuat Following Star pada Cursor dalam Blog - Pangeran Tinta, Ingin melihat bintang yang mengikuti cursor ketika pengunjung mengunjungi blog Bro semua? pas banget Bro anda menemukan postingan ini, Contoh seperti gambar di bawah yang saya kutip dari Blog tetangga (kalau buat sendiri ribet bro hehe walaupun ada testing blog)

Tutorialuntukblog image


Jik anda menyukai ini anda bisa menerapkanya sekarang, cukup mengikuti langkah-langkah berikut dengan seksama, semoga berhasil ya Bro:



1. Dari dashboard >>> design >>> add a gadget >>> HTML/javasrcript [INFO]

2. Copy kode di bawah (menurut idaman Bro ya) dan paste ke dalam ruagan kosong HTML/javascript

a) Following star warna warni


<script type="text/javascript" src="https://sites.google.com/site/pangerantinta/java-script/rainbows.js"></script>

b) Following star warna biru

<script type="text/javascript" src="https://sites.google.com/site/pangerantinta/java-script/blues.js"></script>

c) Following star warna purple

<script type="text/javascript" src="https://sites.google.com/site/pangerantinta/java-script/purples.js"></script>



3. Save dan lihat hasilnya ya Bro:)

Menarik tidak bro, berhasilkah? kalau tidak berhasil komentar Bro mungkin ada suatu kendala dalam Blog atau kode di atas, tapi sudah saya tes bisa Bro, hehe mau tutorial lainya? KLIK DI SINI

Cara Membuat Judul Blog Bergerak

Cara Membuat Judul Blog Bergerak - Pangeran Tinta, Tittle blog default adalah tittle blog yang terdiam sesuai judul blog yang asli, Bro anda bisa memodifikasi dan memberi efek scrolling tittle bar blog bergerak dari kanan ke kiri. anda bisa melihat demo di bawah, gambar di bawah ini maksud saya Bro
Scrolling Tittle Bar



Cara membuat judul blog bergerak, di simak ya bro pangeran tinta cara membuatnya? haha


1. Dari dashboard >> Design >> Add a gadget >> Html/Javascript

2. Copy dan paste kode berikut dalam ruangan HTML/Javascript (KLIK DI SINI KALAU TIDAK PAHAM)


<script language=javascript>
msg = "JUDUL BLOG";

msg = "..." + msg;pos = 0;
function scrollMSG() {
document.title = msg.substring(pos, msg.length) + msg.substring(0, pos);
pos++;
if (pos > msg.length) pos = 0
window.setTimeout("scrollMSG()",200);
}
scrollMSG();
</script>


Catatan: Ganti kata 'JUDUL BLOG' dengan apa kata yang anda inginkan, paham kan Bro?

3. Save dan lihat hasilnya.:)

Jika kurang paham atau kode di atas tidak bisa bekerja silahkan komentar ya Bro, atau jika bermanfaat komentar saja, copas boleh asalkan copas juga sumbernya ya Bro, terimakasih :D KLIK DI SINI UNTUK TUTORIAL MENARIK LAINYA

Cara Membuat Text yang dapat mengikuti cursor

Ingin ada yang berbeda dengan cursor anda di ikuti kalimat yang anda inginkan Bro? Nah tepat sekali anda membaca tulisan ini, dalam tulisan ini membahasa mengenai bagaimana cara enambahkan kalimat yang mengikuti cursor,cekidot kawan pangeran tinta ya Bro hehehe

Contohny seperti gambar di bwah, gimana Bro kesanmu pertama?
Tutorial Untuk Blog Image


Ingin hal tersebut juga dapat di aplikasikan ke Blog Bro semua? cukup ikuti langkah sebagai berikut:

1. Dari dashboard >>> design >>> add a gadget >>> HTML/javascript (INFO LEBIH LANJUT)

2. Copy dan paste kode HTML berikut dalam html/javascript baru yang anda buka


<style type="text/css">
/* Circle Text Styles */
#outerCircleText {
font-style: normal;
font-weight: normal;
font-family: 'comic sans';
color: #FF0080;
position: absolute;top: 0;left: 0;z-index: 3000;cursor: default;}
#outerCircleText div {position: relative;}
#outerCircleText div div {position: absolute;top: 0;left: 0;text-align: center;}
</style>
<script type="text/javascript">
;(function(){
var msg = "Perkataan anda di sini";
var size = 24;
var circleY = 0.75; var circleX = 2;
var letter_spacing = 5;
var diameter = 10;
var rotation = 0.4;
var speed = 0.2;
if (!window.addEventListener && !window.attachEvent || !document.createElement) return;
msg = msg.split('');
var n = msg.length - 1, a = Math.round(size * diameter * 0.208333), currStep = 20,
ymouse = a * circleY + 20, xmouse = a * circleX + 20, y = [], x = [], Y = [], X = [],
o = document.createElement('div'), oi = document.createElement('div'),
b = document.compatMode && document.compatMode != "BackCompat"? document.documentElement : document.body,

mouse = function(e){
e = e || window.event;
ymouse = !isNaN(e.pageY)? e.pageY : e.clientY; // y-position
xmouse = !isNaN(e.pageX)? e.pageX : e.clientX; // x-position
},
makecircle = function(){ // rotation/positioning
if(init.nopy){
o.style.top = (b || document.body).scrollTop + 'px';
o.style.left = (b || document.body).scrollLeft + 'px';
};
currStep -= rotation;
for (var d, i = n; i > -1; --i){ // makes the circle
d = document.getElementById('iemsg' + i).style;
d.top = Math.round(y[i] + a * Math.sin((currStep + i) / letter_spacing) * circleY - 15) + 'px';
d.left = Math.round(x[i] + a * Math.cos((currStep + i) / letter_spacing) * circleX) + 'px';
};
},
drag = function(){ // makes the resistance
y[0] = Y[0] += (ymouse - Y[0]) * speed;
x[0] = X[0] += (xmouse - 20 - X[0]) * speed;
for (var i = n; i > 0; --i){
y[i] = Y[i] += (y[i-1] - Y[i]) * speed;
x[i] = X[i] += (x[i-1] - X[i]) * speed;
};
makecircle();
},
init = function(){ // appends message divs, & sets initial values for positioning arrays
if(!isNaN(window.pageYOffset)){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
} else init.nopy = true;
for (var d, i = n; i > -1; --i){
d = document.createElement('div'); d.id = 'iemsg' + i;
d.style.height = d.style.width = a + 'px';
d.appendChild(document.createTextNode(msg[i]));
oi.appendChild(d); y[i] = x[i] = Y[i] = X[i] = 0;
};
o.appendChild(oi); document.body.appendChild(o);
setInterval(drag, 25);
},
ascroll = function(){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
window.removeEventListener('scroll', ascroll, false);
};
o.id = 'outerCircleText'; o.style.fontSize = size + 'px';
if (window.addEventListener){
window.addEventListener('load', init, false);
document.addEventListener('mouseover', mouse, false);
document.addEventListener('mousemove', mouse, false);
if (/Apple/.test(navigator.vendor))
window.addEventListener('scroll', ascroll, false);
}
else if (window.attachEvent){
window.attachEvent('onload', init);
document.attachEvent('onmousemove', mouse);
};
})();
</script>

Catatan: Anda juga bisa mengganti font kalimat seperti yang anda mau

3. Save dan lihat hasilnya Hasilnya ya Bro.

Bagi yang ingin sedikit ubahsuai, boleh rujuk beberapa perkara berikut.

1.Gantistyle

font-style: normal; (pilihan lain italic, oblique, atau inherit)

2. Ganti warna kalimat
color: #FF0080;  klik di sini jika ingin tau kode warna >>>HTML warna

3. Ganti jenis kalimat
font-family: 'impact'; (pelbagai lagi bentuk perkataan yang ada, boleh rujuk dibawah)

Solusi Alexa No Data



Alexa rank adalah situs yang menyediakan suatu peringkat website di seluruh dunia, yang sudah terdaftar ataupun yang belum terdaftar pasti terhitung oleh situs layanan peringkat tersebut. Salah satu page rank terpopuler di dunia persilatan website tersebut menghitung peringkat website/Blog berdasar jumlah pengunjung website tersebut, pagview dan link yang mengarah pada website/blog tersebut. Jadi, semakin banyak pengunjung, pagview dan link yang mengarah ke website/blog semakin tinggi pula peringkat yang kita miliki. Menurut anda cara yang seperti itu logis tidak bro? saya kira sih logis.
Sekarang saya ingin membahas permasalahan bagi blog kawan yang masih “NO DATA”, kenapa sih kok bisa begitu? Sebabnya apa? Solusinya bagaimana? Dan kapan bisa terindeks sama alexa? Nah saya akan menjelaskan pada tulisan saya kali ini.
Pertama, kenapa sih Alexa Rank kok bisa “NO DATA”?, sebenarnya tidak mendaftar pun blog kita pasti akan terindeks dan mendapatkan peringkat oleh Alexa Rank, tetapi kalau sudah mendaftar kok tulisanya “NO DATA”, Nah hal tersebut terjadi karena umur blog kita yang belum terlalu lama, pengunjung serta pagview ny rendah malah tidak ada, kemudian maslah konten juga, lihat aja deh bro kontenya udah banyak apa belum? Kalau sudah cukup tingkatkan traffic blognya aja bro maka lambat laun pasti terindeks untuk solusi lebih lengkap akan saya bahas di paragraph selanjutnya Bro Oke
Solusi agar Alexa Rank tidak “NO DATA”, ini Bro saya kasih solusinya:
1.       Pastikan Back link satu konten dan konten lainya berkait, karena Blog yang bagus salah satunya adalah memiliki Back link yang terkait (Alexa Rank Juga melihat ini), dan juga buatlah Back link yang berbobot
2.       Perbanyak konten, selain Back link yang banyak hal ini juga berpengaruh semakin banyak konten semakin cepat pula akan terindeks oleh Alexa Rank.
3.       Traffic yang tinggi, tentu saja hal ini adalah alas an utama oleh Alexa sebagai tolak ukur dalam penghitungan peringkatnya, Walaupun tulisan kita sedikit? Ya setidaknya sih ada 15-20 sudah cukup untuk mengenalkan ke Alexa terutama kalau umur Blog kita baru Bro iya kan, pastikan pada tulisan memilih keyword yang tepat, back link yang bertaut dan sebagainya.
Mungkin 3 alasan tersebut adalah factor yang harus di penuhi agar blog cepat terindex oleh Alexa Rank, review lagi baro” 1. Backlink 2. Konten 3. Traffic, jika hal tersebut adalah sudah terpenuhi saya yakin akan cepat medapatkan peringkat di Alexa rank.
Kapan terindex oleh Alexa Rank?
Sudah saya singgung sedikit di atas tadi cepat atau lambat blog akan mendapat peringkat di Alexa Rank, cukup menunggu 1-3 minggu saja maka anda akan melihat peringkat anda pada widget yang sudah anda pasang di Blog anda.
Cukup sekian Bro-Bro semua kawan Pangeran Tinta semoga bermanfaat, jika ada yang kurang paham silahkan berkomentar saja di kolom komentar di bawah maka dengan senang hati kami akan menjawab pertanyaan Bro semua. Terimakasih!

Terlalu Banyak Keyword adalah akan di anggap SPAM search engine

Pangeran Tinta - Terlalu Banyak Keyword adalah akan di anggap SPAM search engine, Ini saya mau curhat sekalian berbagi pengalaman masbro, apa sih fungsi keyword? keyword adalah kata kunci yang di pakai untuk memudahkan para pencri artikel menemukan tulisn yang terkait dengan keyword. Keyword akan menentuka pengunjung untuk mengarahkan ke tulisan anda, tentu dengan pesaing lainya yang sangat banyak.

Tapi tau tidak Bro? saya saja baru tau tadi, ternyata keyword yang kita pasang apabila terlalu banyak akan di anggap SPAM oleh Search Engine seperti Google dan sebagainy.

Maka, perhatikan penulisan SPAM anda ya bro biar rating cepat naik, keyword yang ps yang akan memenangkan pertarungan. Semoga bermanfaat saja bro. erimakasih

Cara Membuat Widget Popular Post Berdasarkan Page View

Pangeran Tinta - Cara Membuat Widget Popular Post Berdasarkan Page View, Widget populas post ini berbeda dari yang lain, widget ini melihat dari pageview dari sebuah tulisan tersebut sebagai acuan peringkat kepopularitasan sebuah tulisan. (banyak di lihat semakin terkanl gitu kan bro istilahnya)
Tutorial Untuk Blog Image

Widget ini mudah untuk di terapkan, diambil dari foxrecord.com. Widget ini akan bekerja baik dengan meletakkan kode dari langkah berikut kedalam HTML/javascript Widget

Lngkah-langkahnya adalah sebagai berikut:

1. Dari dashboard >>> design >>> add a gadget >>> HTML/javascript (KLIK DISINI jika kurang paham dean langkah ini)

2. Masukkan kode berikut ke ruangan HTML/javascript (tidak perlu menambahkan hal lain)

<script src="https://sites.google.com/site/pangerantinta/java-script/toppostpageview.js" type="text/javascript"></script>

3. Save dan lihat hasilnya. (anda mungkin perlu klik pada 3/4 link dalam blog anda untuk ianya terus berfungsi)


Catatan:
1. Jumlah popular post yang ditetapkan hanya 5.
2. Peringkat post akan terlihat berdasar banyaknya pageview dengan tidak melihatkan jumlah pageview
Selamat mencoba, jika ada yang di tanyakan komentar saja, semoga berhasil, kalau tidak berhasil tolong beri tau saya ya bro mungkin ada kode yang salah. :D thanks

Ketahui Jumlah Post dan Jumlah Komentr dalam Blog

Pangeran Tinta - Ketahui Jumlah Post dan Jumlah Komentr dalam Blog, Berapakah bilangan post dan bilangan komen yang anda terima bagi keseluruhan selama anda menjalankan blog anda? Jika hl tersebut ingin anda ketahui dan perlihatkan di blog, jawabannya adalah mudah sekali.:)



Ikuti langkah-langkah di abwah ini:

1. Login akaun blogger, dari dashboard >>> design >>> add a gadget >>> HTML javascript
(masih tidak faham? KLIK SINI )

2. Copy kode di bawah dan letakkan ke dalam ruangan HTML/javascript

<center><script style="text/javascript">
function totalPosts(json) {
document.write('Total Posts: <b>' + json.feed.openSearch$totalResults.$t + '</b><br>');
}
function totalComments(json) {
document.write('Total Comments: <b>' + json.feed.openSearch$totalResults.$t + '</b><br>');
}
</script>
<script src=" /feeds/posts/default?alt=json-in-script&callback=totalPosts"></script>
<script src=" /feeds/comments/default?alt=json-in-script&callback=totalComments"></script></center>
<small><a href="http://pangeran-tinta.blogspot.com/2013/11/ketahui-jumlah-post-dan-jumlah-komentr.html" target="_blank">get this</a></small>


3. Save. lihat hasilnya

Memberi Efek Hujan Salju kedalam Blog (salju hitam atau putih)

Pangeran Tinta - Memberi Efek Hujan Salju kedalam Blog (salju hitam atau putih), Bro pernah merasa tampilan anda terlalu terang dan kelihatan panas ketika di lihat?
Mungkin hal ini bisa lebih mendinginkan dan menyejukkan blog anda bro, dengan menambahkan hujan salju hehe

Letak kesan salji dalam blog (Snow effect)


Untuk tips kali ini anda bisa memilih warna salju hitam atau putih (hehe)

Cara untuk meletakkan hujan salju dalam blog adalah seperti berikut.

1. Login akaun blogger, dari dashboard >>> layout >>> add a gadget >>>  html/javascript (kurang jelas? KLIK DI SINI)

2. Copy salah satu kode berikut kemudian paste dalam ruangan html/javascript

Kode untuk hujan salju putih (untuk background gelap biasanya bro)
<script type="text/javascript" src="http://www.yourjavascript.com/14104214083/snow-white.js"></script>


Kode untuk hujan salju hitam (untuk background terang atau putih)
<script type="text/javascript" src="http://www.yourjavascript.com/03441140321/snow-black.js"></script>


3. Save dan lihat hasilnya.:)

Cara Membuat Widget Fanpage Facebook yang Tersembunyi di tepi blog

Image from OhBest Fanspage
Bagi blogger yang mempunyai fanpage facebook sendiri biasanya meletakkan hal tersebut di bilah kiri atau kanan, tapi kali ini saya ingin memberi kode tetang hal tersebut tapi di letakkan pada tepi layar komputer anda dan akan muncul apabila cursor di arahkan ke gambar tersebut.

Tutorial sembunyikan Fb fan page adalah seperti di bawah.

Langkah A:

1. Dari dashboard >>> design >>> edit HTML
 

2. Menggunakan fungsi find, (ctrl + F), cari kode </head>
 

3. Copy dan paste kode di bawah SEBELUM kode </head>

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>


contoh:


Catatan: Jika anda dapati kode di atas sudah ada sebelum anda copy paste, abaikan langkah A, lngsung saja ke langkah B

4. Jika sudah selesai save template bro oke,

lanjut ke langkah B, simak naik-baik ya bro



Langkah B:

1. Dari dashboard > design > page element > add a gadget > HTML/javascript
2. Copy dan paste kod di bawah dalam ruangan HTML/javascript yang anda telah buka


<script type="text/javascript">
//<!--
$(document).ready(function() {$(".w2bslikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
//-->
</script>
<style type="text/css">
.w2bslikebox{background: url("http://3.bp.blogspot.com/-KdSAuv-K7HM/To_WXoWHzJI/AAAAAAAAGvg/5UvL10LUe_k/facebook.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
.w2bslikebox div{border:none;position:relative;display:block;}
.w2bslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.w2bslikebox span a{color: #808080;text-decoration:none;}
.w2bslikebox span a:hover{text-decoration:underline;}
</style><div class="w2bslikebox" style=""><div>

<iframe src="http://www.facebook.com/plugins/likebox.php?href=URL PAGE&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp;connections=9&amp;stream=false&amp;header=false&amp;height=330" scrolling="no" frameborder="0" style="border: medium none; overflow: hidden; height: 330px; width: 245px;background:#fff;"></iframe><span><a href="http://pangeran-tinta.blogspot.com/2013/11/cara-membuat-widget-fanpage-facebook.html">Tutorial Here</a></span></div></div>


Catatan : Gantikan "URL PAGE" dengan URL alamat fanspage facebook anda, contoh url page: http://facebook.com/pangerantinta
3. Save dan lihat hasilnya.:)

Ketahui Jumlah Pengunjung yang Online dengan whous.amung.us

Berapakah bilangan pelawat yang berada dalam blog anda ketika ini.?
Mungkin amat sukar untuk anda menjangkakannya (tidak boleh rasanya.:)
Kalau anda mempunyai statistik blog, mungkin anda tahu mengikut hari ataupun jam,
tetapi anda tidak tahu berapa bilangan pengunjung dalam keadaan masa sebenar.


whous.amung.us menawarkan widget yang dapat menunjukkan jumlah pengunjung yang online padasecara real.

Berikut adalah langkah yang diperlukan untuk meletakkan widget ini didalam blog anda.


1. Buka web http://whos.amung.us/


2. Pilih posisi widget yang anda inginkan (widget akan berada dalam keadaan statik dalam blog anda), selepas itu copy code yang tersedia.
Bilangan Pengunjung Online Dalam Blog


3. Setelah copy code, pastekan di dalam html/javascript yang terdapat dalam page element blog anda.
Dashboard >>> layout >>> page element >>> add a gadget >>> html/javascript.



Jika kurang, silahkan klik DI SINI

4. Save, dan lihat hasilnya..:)

POLICIY PRIVACY

PANGERAN TINTA - POLICY PRIVACY, adapun aturan-aturan yang akan di laksanakan pada blog ini adalah:

1. Komentar sara, agama, rasis, dan yang berbau negative akan di hapus (Selasa, 05 November 2013)

2. Komentar link hidup tidak akan di terima (Selasa, 05 November 2013)

3. Di larang mengejek antar pengunjung (Selasa, 05 November 2013)

4. Hubungi admin jika ada yang di tanyakan (Selasa, 05 November 2013)

5. Di larang keras copy & paste tanpa menyertakan link sumber (ada link, copy & paste oke saja, untuk hal yang positive)* (Selasa, 05 November 2013)


Policy Privacy bisa berubah sewaktu-waktu tanpa sepengetahuan terlebih dahulu, jika ada yang ingin di tanyakan hubungi admin!



ABOUT US

PANGERAN TINTA - ABOUT, pangeran-tinta.blogspot.com, adalah blog yang di buat pada bulan januari 2013, berawal dari hobi menulis sampai sekarang kegiatan blogging pun masih kami jalani (soalnya dminya lebih dari satu bro).

Pangeran-tinta menyediakan konten sepert:

1, Free XML Template For Blogger
dalam tegori ini kamu menyediakan XML Template for blogger, anda bisa menemukan sejumlah XML blogger yang anda bisa pasang pada blog pribadi anda yang akan menambah daya tarik pengunjung, dengan tampilan yang mudah di mengerti dan tidak susah menemukan link download pasti anda betah mencari-cari template yang cocok untuk anda, jadi selamat mencari :D

2. Blog Tips
Selain di atas tadi ini, adalah salah satu konten utama yang kami sediakan yaitu TUTORIA BLOG yang bisa anda pahami dengan mudah, karena bahasa yang kami gunakan mudah di cerna.

3. Mekatronic
Bidang ilmu di kuliah saya

4. Automotive
Hobi

5. Healthy
Bidang ilmu kuliah admin lainya

6. Gadget
Hobi admin mengenai teknologi yang sedang berkembang, di sini anda dapat  menemukan berita tentang gadget, review gadget, berita gadget terbaru dan sebagainya.

7. Inside Islam
My religion

8. Campus News
Menyedaikan berita kampus terkini dari Universitas yang berasal dari Indonesia ataupun luar negeri.


Mungkin cukup sekian perkenalan kami mengenai profil dari blog pangeran tinta, semoga bermanfaat, terimakasih telah mengunjungi, silahkan menikmati, dan semoga bertemu di lain kesempatan.

TERM OF SERVICE

PANGERAN TINTA - TERM OF SERVICE, Peraturan yang harus di jalankan ketika anda mengunjungi blog pangeran-tinta.blogspot.com adalah sebagai berikut:

1. Komentar yang mengadung isu sara, agama, rasisme, dan lain sebagainya yang bertujuan negative kepada hal apa saja tidak akan di "moderasi" oleh admin pangeran tinta (01 November 2013)

2. Komentar tidak boleh menggunakan link aktif (01 November 2013)

3. Tidak menggunakan hidden link (01 November 2013)

4. Komentar harus sopan tidak merugikan siapapun (01 November 2013)

5. Komentar di entry terkait jika ada pertanyaan, saran, atau lainya (01 November 2013)

Peraturan bisa berubah sewaktu-waktu.

Terimakasih atas perhatian anda, selamat menikmati konten yang kami sediakan :)

ShareThis

Check It Boss

Alfamart SEO Contest 2013

Check It Boss

Alfamart SEO Contest 2013