Tampilkan postingan dengan label Blog. Tampilkan semua postingan
Tampilkan postingan dengan label Blog. Tampilkan semua postingan

Jumat, 16 Maret 2012

Misterlinky - cara mudah untuk pengunjung masukkan link di blog

Filled under:

Sesetengah pemilik blog akan memasukkan link pengunjung sebagai exchange. Cara ini bagus untuk meningkatkan trafik blog. Kebiasaanya, link pengunjung akan dimasukkan oleh pemilik blog.

Tetapi dengan misterlinky, pengunjung sendiri akan meninggalkan link blog mereka pada blog² yang meletakkan widget ini. Secara tidak langsung dapat memudahkan kedua-dua belah pihak, pemilik blog dan pengunjung blog.

Berikut contoh widget misterlinky ini.




Untuk mendapatkan widget ini, anda boleh dapatkan (daftar) di www.misterlinky.net/

Setelah selesai mendaftar dengan linkwinky, dapatkan kod HTML kemudian paste di bahagian page element blog anda.

Antara kelebihan menggunakan misterlink ini adalah widget yang simple dan mudah untuk memasukkan url blog. Pemilik blog juga senang untuk menguruskan widget ini(jika ada link yang tidak dikehendaki)

Posted By @Ucup_bulldog05.48

Tutorial Gerakkan Title Blog

Filled under:

Title blog secara default adalah dalam keadaan statik. Anda boleh tukarkan title blog anda dengan mudah dan juga anda boleh membuatkan ianya bergerak dari kanan ke kiri.



Tutorial untuk buatkan title blog bergerak adalah seperti berikut.


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

2. Copy dan paste code berikut dalam ruangan HTML/Javascript


<script language=javascript>
msg = "Title Blog Anda";

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>


Note: Tukarkan 'Title Blog Anda' dengan apa sahaja yang anda mahu.

3. Save dan lihat hasilnya.:)

Posted By @Ucup_bulldog05.44

Following Star Pada Cursor

Filled under:

Adakah anda suka kalau cursor yang anda guna untuk blog ada beberapa bintang kecil berwarna yang mengikutinya.? Contoh macam gambar di bawah.



Kalau anda suka, ini ada tutorialnya.:)



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

2. Copy code di bawah mengikut kesukaan anda dan paste ke dalam HTML/javascript

i) Following star warna warni

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


ii) Following star warna biru

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


iii) Following star warna purple

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



3. Save dan lihat hasilnya.:)

Posted By @Ucup_bulldog05.42

Letak Emotion Icon Dalam Komen

Filled under:


Kebiasaannya komen dalam blog anda adalah dalam bentuk perkataan semata-mata. Tetapi mahukah kalau komen untuk blog anda juga boleh diletakkan emotion.?
Tentu lebih menarik dengan adanya emotion.

Contoh seperti gambar di bawah, dan anda juga boleh mencubanya sendiri di test blog.


Tutorial untuk letakkan emotion icon dalam komen adalah seperti berikut.

1. Dari dashboard > design > edit HTML > Expand widget template



2. Backup template (download full template) anda untuk langkah berjaga². (more 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 kod di bawah selepas kod <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://tutorialuntukblog.blogspot.com/2011/05/letak-emotion-icon-dalam-komen.html'target="_blank"><small>Grab tutorial here</small></a>
</b>
</div>


contoh:


5. Save dan lihat hasilnya di ruangan komen anda.:)

Posted By @Ucup_bulldog05.40

Tutorial Buat Scroll Box Untuk Blog Archive

Filled under:

Blog archive untuk sesebuah blog boleh menjadi list yang begitu panjang apabila banyak entri yang di post atau jika sudah lama terlibat dengan dunia blogging.

Tutorial kali ini kan menunjukkan bagaimana untuk jadikan blog archive anda boleh scroll untuk menampakkannya lebih ringkas menyenangkan mata memandang.:)



Tutorial untuk buat scroll bagi blog archive adalah seperti berikut.



1. Dari dashboard > design > edit html > Expand widget templates.
(backup template untuk langkah berjaga²)

2. Menggunakan fungsi find (ctrl + F), cari kod <div id='ArchiveList'>

3. Anda akan jumpa kod ini <div class='widget-content'> sebelum kod <div id='ArchiveList'>

4. Gantikan kod <div class='widget-content'> yang anda jumpa di langkah 3 dengan kod berikut.

<div class='widget-content' style='overflow:auto; height:200px'>


Note: Anda boleh tukar 200px dengan ketinggian yang anda mahukan.

Contoh:

Sebelum.


Selepas


4. Save dan lihat hasilnya.:)

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

Posted By @Ucup_bulldog05.39

Tips Menaip Entri Dalam Blog

Filled under:





Untuk kali ini, 3 lagi point yang anda perlu pertimbangkan untuk menaip adalah seperti berikut.

1. Gambar

Meletakkan gambar adalah penting untuk sesebuah entri. Kewujudan gambar akan lebih mencorakkan lagi apa yang anda taip di dalam blog. Jadi gambar sememangnya mempengaruhi minat pengunjung untuk membaca kandungan entri anda.


Kalau anda baca buku, kan best kalau ada diselitkan gambar. Begitu juga entri blog. Paling kurang gambar yang ada adalah sekeping atau berapa banyak yang dirasakan perlu. Tetapi pastikan juga jangan letak terlalu banyak gambar dalam entri melainkan entri yang memang berbentuk penerangan bergambar.


2. Provokasi

Adakah bagus untuk melakukan provokasi semasa menaip blog.?. Jawapannya adalah YA. Menaip entri yang berbentuk provokasi sememangnya salah satu teknik menaip yang mampu menarik lebih ramai pengunjung untuk membaca dan komen.


Tetapi harus diingatkan, jangan melakukan provokasi yang bersifat keras. Lakukan provokasi yang lebih bersifat lembut dan menarik orang untuk membaca dan komen yang bernas, bukannya membaca dan di balas dengan cacian. Dan jika anda hendak tahu, entri yang melakukan provokasi pada jantina yang berlainan lagi bagus.:)

Provokasi akan membuatkan pembaca berasa 'geram' untuk baca dan komen..:). Contoh provokasi 'lembut' untuk lelaki, Lelaki memang banyak bagi alasan macam ni eh.?, dan contoh provokasi 'lembut' terhadap perempuan yang pernah ditaip sebelum ini.,Perempuan memang selalu macam ni eh. So entri ini akan membuatkan pembaca akan berasa relax untuk membaca dan rasa hendak komen je berbanding entri berbentuk fakta.:)


3. Persoalan.

Tinggalkan persoalan untuk entri anda. Persoalan juga boleh memacu pembaca untuk ingin selalu mengikuti setiap entri anda. Selain itu, persoalan juga membolehkan pembaca lebih berminat untuk menghantar komen.



Contoh, jika anda buat persoalan, "Hendak tahu apa yang terjadi lepas tu.? Nanti aku cerita dalam entri akan datang ye.". Apabila membaca, pembaca ingin tahu apa yang berlaku dan kemungkinan akan datang lagi untuk membaca. Kerana entri anda menimbulkan pertanyaan di pikiran mereka.

Juga boleh tinggalkan persoalan di akhir entri untuk pendapat, seperti " Apa yang korang rasa, perlu tak aku teruskan hubungan ini?"..(psst:tetapi janganla setiap entri ada persoalan pula.:)

Entri sebegini akan membentuk satu pembacaan yang bercorak pelbagai, bukan entri yang berbentuk mendatar sahaja.:)

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

Kebiasaaannya, untuk menghasilkan entri yang menarik, ianya lebih kepada pendekatan psikologi dan pengetahuan anda kepada sifat dan perlakuan manusia. Sebab jika anda menaip entri sebenarnya banyak pandangan orang dari perspektif yang berbeza. So ianya bergantung bagaimana anda tackle emosi pengunjung blog anda. Dan cara untuk tackle adalah hasilkan entri yang menarik perhatian mahkluk bernama manusia.:)

Posted By @Ucup_bulldog05.37

Kamis, 15 Maret 2012

Download Template Hazama V.1

Filled under:

 Tampilan Blog : 



Download Template Blogger : By Me

Fitur :
- Change BackGround
- Power Saving Mode
- Dll

Posted By @Ucup_bulldog23.21

Selasa, 06 Maret 2012

Cara Membuat zFP menu pada blog

Filled under:

Tutorial Kali ini adalah cara membuat zFP menu pada blog.
Saya Akan membahas ilmu ini dari inimu.comTutorial kali ini Menjawab pertanyaan dari teman blogger yang menanyakan menu ZFP pada blog ini Pada pojok bawah blog.
zFPmenu – Fixed-Position Custom Menu and Navigation/Share Widget, adalah widget ‘melayang’ yang bisa diisi dengan menu berisi link-link sesuai keinginan.
Di dalamnya sudah termasuk navigasi scroll to top/bottom of page (scroll ke bagian paling atas/bawah halaman web) ber-engine jQuery, dan juga tombol share Twitter dan Facebook (bila diinginkan.

demo bisa di lihat di Blog ini

ikuti langkah-langkahnya
 1. pastinya login ke blogger
 2. masuk ke rancangan>>edit html
 3. cari kode </body> dengan CTRL+F
  kopikan kode dibawah ini tepat di atas kode </body> 



<!-- zFPmenu START -->
<div id="zfpm_div" style="display:none;">
<div id="zfpm_upperBox">

Menu Blog Saya
</div>
<ul id="zfpm_ul">
<!-- Your menus start -->
<li><a href="
link">YOUR MENU-1 (cth : Home)</a></li>
<li class="dir"><a href="link">YOUR MENU 2 (containing submenu) (cth : open menu)</a>
<ul>
<li class="dir"><a href="
link">YOUR SUBMENU 2.1 (containing sub-submenu) (cth : download</a>
<ul>
<li><a href="
link">YOUR SUB-SUBMENU 2.1.1 (cth : lagu)</a></li>
<li><a href="link">YOUR SUB-SUBMENU 2.1.2 (cth : video)</a></li>
</ul>
</li>
<li><a href="
link">YOUR SUBMENU 2.2 (cth : file)</a></li>
<li><a href="link">YOUR SUBMENU 2.3 (cth : indonesia)</a></li>
</ul>
</li>
<li><a href="link">YOUR MENU 3 (cth : guest book)</a></li>
<!-- Your menus end -->

</ul></div>
<script type="text/javascript">
var zfpm_colorTheme = 'light'
var zfpm_shareBox = 'no';
</script>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'/>
<script src='http://zfpmenu.googlecode.com/svn/trunk/js/zfpmenu.js' type='text/javascript'/>
<!-- zFPmenu END -->


4. simpan hasilnya dan utak utik sendiri

 NB : ganti kata - Menu Blog Saya untuk judul nya
                          - link dengan link url anda
                          - YOUR MENU __ dengan menu anda
                          - light untuk warna cerah dan dark untuk warna gelap
                          - no untuk tidak menampilkan tombol share
sudah cukup ya smoga bermanfaat SALAM BLOGGER!!!!!

Posted By @Ucup_bulldog20.00

Jumat, 17 Februari 2012

Template Blog FM FY

Filled under:

Dilarang Mengatas Namakan Template Ini,,
Free Download For You

Download Template : Here


SS Skin





Credits : Yusuƒ C3 Ώ ΣΪΠD - B Ώ

Posted By @Ucup_bulldog02.01

Sabtu, 28 Januari 2012

Anti Klik Kanan Di Blogger

Filled under:

1. Masuk ke Blogger
2. Rancangan >> Elemen Laman >> Tambah Gadget
3. cari HTML/JavaScript
4. Masukkan Kode di bawah ini :


<script language="javascript">
<!-- Begin
function shake(n) {
if (parent.moveBy) {
for (i = 10; i > 0; i--) {
for (j = n; j > 0; j--) {
self.resizeTo(250,150);
parent.moveBy(i,0);
parent.moveBy(0,-i);
parent.moveBy(-i,0);
parent.moveBy(0,i);
parent.moveBy(i,0);
parent.moveBy(0,-i);
parent.moveBy(-i,0);
parent.moveBy(0,i);
parent.moveBy(i,0);
parent.moveBy(0,-i);
parent.moveBy(-i,0);
parent.moveBy(0,i);
parent.moveBy(i,0);
parent.moveBy(0,-i);
parent.moveBy(-i,0);
parent.moveBy(0,i);
parent.moveBy(i,0);
parent.moveBy(0,-i);
parent.moveBy(-i,0);
parent.moveBy(0,i);
parent.moveBy(i,0);
parent.moveBy(0,-i);
parent.moveBy(-i,0);
parent.moveBy(0,i);
parent.moveBy(i,0);
parent.moveBy(0,-i);
parent.moveBy(-i,0);
parent.moveBy(0,i);
parent.moveBy(i,0);
parent.moveBy(0,-i);
parent.moveBy(-i,0);
parent.moveBy(0,i);
parent.moveBy(i,0);
parent.moveBy(0,-i);
parent.moveBy(-i,0);
parent.moveBy(0,i);}}}}

// End -->


PopUpURL = "
Maaf anda tidak di perbolehkan klik kanan jika anda ingin mengcopy tekan ctrl + c";

isIE=document.all;

isNN=!document.all&&document.getElementById;
isN4=document.layers;

if (isIE||isNN)

{
document.oncontextmenu=checkV;
}
else
{
document.captureEvents(Event.MOUSEDOWN || Event.MOUSEUP);
document.onmousedown=checkV;
}
function checkV(e)
{
if (isN4)
{
if (e.which==2||e.which==3)
{
dPUW=alert("Maaf anda tidak di perbolehkan klik kanan jika anda ingin mengcopy tekan ctrl + c");
shake(2);
return false;
}
}
else
{
dPUW=alert(PopUpURL);
shake(2);
return false;
}
}
</script>



<em><script>

//mouse
//Circling text trail- Tim Tilton
//Website: http://www.tempermedia.com/
//Visit http://www.dynamicdrive.com for this script and more
function cursor_text_circle(){
// your message here
var msg='*********************'.split('').reverse().join('');

var font='Verdana,Arial';

var size=3; // up to seven
var color='#ff0000';

// This is not the rotation speed, its the reaction speed, keep low!

// Set this to 1 for just plain rotation w/out drag
var speed=.3;

// This is the rotation speed, set it negative if you want

// it to spin clockwise
var rotation=-.2;

// Alter no variables past here!, unless you are good

//---------------------------------------------------


var ns=(document.layers);

var ie=(document.all);
var dom=document.getElementById;
msg=msg.split('');
var n=msg.length;
var a=size*13;
var currStep=0;
var ymouse=0;
var xmouse=0;
var props="<font face="+font+" color="+color+" size="+size+">";

if (ie)

window.pageYOffset=0

// writes the message

if (ns){
for (i=0; i < n; i++)
document.write('<layer left="0" top="0" width="+a+" name="nsmsg'+i+'" height="+a+"><center>'+props+msg[i]+'</font></center></layer>');
}
else if (ie||dom){
document.write('<div id="outer" style="position:absolute;top:0px;left:0px;z-index:30000;"><div style="position:relative">');
for (i=0; i < n; i++)
document.write('<div id="iemsg'+(dom&&!ie? i:'')+'" style="position:absolute;top:0px;left:0;height:'+a+'px;width:'+a+'px;text-align:center;font-weight:normal;cursor:default">'+props+msg[i]+'</font></div>');
document.write('</div></div>');
}
(ns)?window.captureEvents(Event.MOUSEMOVE):0;

function Mouse(evnt){

ymouse = (ns||(dom&&!ie))?evnt.pageY+20-(window.pageYOffset):event.y; // y-position
xmouse = (ns||(dom&&!ie))?evnt.pageX+20:event.x-20; // x-position
}

if (ns||ie||dom)

(ns)?window.onMouseMove=Mouse:document.onmousemove=Mouse;
var y=new Array();
var x=new Array();
var Y=new Array();
var X=new Array();
for (i=0; i < n; i++){
y[i]=0;
x[i]=0;
Y[i]=0;
X[i]=0;
}

var iecompattest=function(){

return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body;
}

var makecircle=function(){ // rotation properties

if (ie) outer.style.top=iecompattest().scrollTop+'px';
currStep-=rotation;
for (i=0; i < n; i++){ // makes the circle
var d=(ns)?document.layers['nsmsg'+i]:ie? iemsg[i].style:document.getElementById('iemsg'+i).style;
d.top=y[i]+a*Math.sin((currStep+i*1)/3.8)+window.pageYOffset-15+(ie||dom? 'px' : '');
d.left=x[i]+a*Math.cos((currStep+i*1)/3.8)*2+(ie||dom? 'px' : ''); // remove *2 for just a plain circle, not oval
}
}

var drag=function(){ // makes the resistance

y[0]=Math.round(Y[0]+=((ymouse)-Y[0])*speed);
x[0]=Math.round(X[0]+=((xmouse)-X[0])*speed);
for (var i=1; i < n; i++){
y[i]=Math.round(Y[i]+=(y[i-1]-Y[i])*speed);
x[i]=Math.round(X[i]+=(x[i-1]-X[i])*speed);

}

makecircle();
// not rotation speed, leave at zero
setTimeout(function(){drag();},10);
}
if (ns||ie||dom)
if ( typeof window.addEventListener != "undefined" )
window.addEventListener( "load", drag, false );
else if ( typeof window.attachEvent != "undefined" )
window.attachEvent( "onload", drag );
else {
if ( window.onload != null ) {
var oldOnload = window.onload;
window.onload = function ( e ) {
oldOnload( e );
drag();
};
}
else
window.onload = drag;
}

}

cursor_text_circle();

</script></em>

Posted By @Ucup_bulldog21.59

Cara Membuat Yahoo Massanger status

Filled under:

Tips ini untuk menampilkan status yahoo messengar kamu pada blog, jadi pengunjung dapat menghubungi kamu melalui YM. Itu memudahkan para pengunjung untuk bertanya atau sekedar chatting dengan kamu, pemubuatannya cukup sederhana. Kelamaan kayanya, yuk kita langsung ke Tkp



Contoh tampilan yahho messenger kamu seperti ini :


Bila offline


Posted Image



Bila online


Posted Image



gimana cara pembuatannya? copy paste code di bawah ini pada blog kamu



<a href="ymsgr:sendIM?alindro_kidz"> <img src="http://opi.yahoo.com/online?u=
alindro_kidz&m=g&t=2&l=us"/>
</a>


Untuk mengganti Gambar nya Ubah angka yang berwana ijau. ( 1-20)

Ganti kode berwarna merah dengan alamat yahoo messenger kamu...

selamat mencoba..

Posted By @Ucup_bulldog21.56

Rabu, 11 Januari 2012

Animasi Muncul Dan Sembunyi

Filled under:

Cara membuatnya

Dari Dashboard >> Design >> Edit HTML.


Penempatannya

dibawah ]]></b:skin>
........
diatas </head>
Hidden Content

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://pagenano.googlecode.com/files/Animasi%20Muncul%20dan%20Sembunyi.js"></script>

<script type="text/javascript">


animatedcollapse.addDiv('nano', 'fade=1,height=80px')

animatedcollapse.addDiv('david', 'fade=1,height=100px')
animatedcollapse.addDiv('michael', 'fade=1,height=120px')

animatedcollapse.addDiv('cat', 'fade=0,speed=700')

animatedcollapse.addDiv('dog', 'fade=0,speed=700,hide=1')
animatedcollapse.addDiv('rabbit', 'fade=0,speed=700,hide=1')

animatedcollapse.ontoggle=function($, divobj, state){

}

animatedcollapse.init()


</script>

Induk JQuery, jika sudah ada tidak perlu lagi !.


Penempatannya

dibawah <body>
........
diatas </body>
Hidden Content

<p><b>Contoh 1:</b></p>
<a href='javascript:animatedcollapse.toggle("nano")'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGzCVw8kowfodIU3U90DVNI3mQu0x-4vrOjsixJPdWSS2U6t-s0Ot0IMmoSMsPlhNdzhKi9bdWMElkUTPVA-UbR62C46NWdKfjERFN9kVkd3bnl8NxZ09IZ2MyNFjWgMVfK4fAx5gM5Zj/s1600/Toggle+-+Nano+Yulianto.jpg' border='0' /></a>

<div id="nano" style="width: 300px; background: #FFFFCC; display:none">

<p>Hanya Sekedar Contoh saja.....</p>
</div>

<p><b>Contoh 2:</b></p>

<a href='javascript:animatedcollapse.toggle("david")'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGzCVw8kowfodIU3U90DVNI3mQu0x-4vrOjsixJPdWSS2U6t-s0Ot0IMmoSMsPlhNdzhKi9bdWMElkUTPVA-UbR62C46NWdKfjERFN9kVkd3bnl8NxZ09IZ2MyNFjWgMVfK4fAx5gM5Zj/s1600/Toggle+-+Nano+Yulianto.jpg' border='0' /></a>

<div id="david" style="width: 300px; background: #000; display:none">

<p>Hanya Sekedar Contoh saja.....</p>
</div>

<p><b>Contoh 3:</b></p>

<a href='javascript:animatedcollapse.toggle("michael")'><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGGzCVw8kowfodIU3U90DVNI3mQu0x-4vrOjsixJPdWSS2U6t-s0Ot0IMmoSMsPlhNdzhKi9bdWMElkUTPVA-UbR62C46NWdKfjERFN9kVkd3bnl8NxZ09IZ2MyNFjWgMVfK4fAx5gM5Zj/s1600/Toggle+-+Nano+Yulianto.jpg" border="0" /></a>

<div id="michael" style="width: 300px; background: #E7FFCC; display:none">

<p>Terserah agan.....</p>
</div>

<p><b>Contoh 1:</b></p>

<a href="#" rel="toggle[cat]" data-openimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjp0chqri13A-Coa7lcc5ZW6NMCWEeFnzuiynHXdKuUXmqw_9zFrgyC9-h1I671RUihdQGaKQnmi9LZ5FwH_D7NnV8stHkSc8sV4akxY4nk0KybjEvZNvgVAInPVxDY1iWNmLmgedztzeHu/s1600/collapse-Nano+Yulianto.jpg" data-closedimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh062qebtROxxsIuUHngThQs23LwdWEyAnukUAw4N_OE4O83T8eQhSDTgdURf1XC_WxTaCpguH25LumwbYYMVN36AbMhPkr-rKMtPLe6FKMNqMLQ2d3W4m86HFDbhwPpvWiXt3VzZdr09Se/s1600/expand-Nano+Yulianto.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjp0chqri13A-Coa7lcc5ZW6NMCWEeFnzuiynHXdKuUXmqw_9zFrgyC9-h1I671RUihdQGaKQnmi9LZ5FwH_D7NnV8stHkSc8sV4akxY4nk0KybjEvZNvgVAInPVxDY1iWNmLmgedztzeHu/s1600/collapse-Nano+Yulianto.jpg" border="0" /></a>

<div id="cat" style="width: 400px; background: #BDF381;">

<p>Terserah agan.....</p>
</div>

<p><b>Contoh 2:</b></p>

<a href="#" rel="toggle[dog]" data-openimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjp0chqri13A-Coa7lcc5ZW6NMCWEeFnzuiynHXdKuUXmqw_9zFrgyC9-h1I671RUihdQGaKQnmi9LZ5FwH_D7NnV8stHkSc8sV4akxY4nk0KybjEvZNvgVAInPVxDY1iWNmLmgedztzeHu/s1600/collapse-Nano+Yulianto.jpg" data-closedimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh062qebtROxxsIuUHngThQs23LwdWEyAnukUAw4N_OE4O83T8eQhSDTgdURf1XC_WxTaCpguH25LumwbYYMVN36AbMhPkr-rKMtPLe6FKMNqMLQ2d3W4m86HFDbhwPpvWiXt3VzZdr09Se/s1600/expand-Nano+Yulianto.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjp0chqri13A-Coa7lcc5ZW6NMCWEeFnzuiynHXdKuUXmqw_9zFrgyC9-h1I671RUihdQGaKQnmi9LZ5FwH_D7NnV8stHkSc8sV4akxY4nk0KybjEvZNvgVAInPVxDY1iWNmLmgedztzeHu/s1600/collapse-Nano+Yulianto.jpg" border="0" /></a>

<div id="dog" style="width: 400px; background: #BDF381;">

<p>Terserah agan.....</p>
<p>Terserah agan.....</p>
</div>

<p><b>Contoh 3:</b></p>

<a href="#" rel="toggle[rabbit]" data-openimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjp0chqri13A-Coa7lcc5ZW6NMCWEeFnzuiynHXdKuUXmqw_9zFrgyC9-h1I671RUihdQGaKQnmi9LZ5FwH_D7NnV8stHkSc8sV4akxY4nk0KybjEvZNvgVAInPVxDY1iWNmLmgedztzeHu/s1600/collapse-Nano+Yulianto.jpg" data-closedimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh062qebtROxxsIuUHngThQs23LwdWEyAnukUAw4N_OE4O83T8eQhSDTgdURf1XC_WxTaCpguH25LumwbYYMVN36AbMhPkr-rKMtPLe6FKMNqMLQ2d3W4m86HFDbhwPpvWiXt3VzZdr09Se/s1600/expand-Nano+Yulianto.jpg"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjp0chqri13A-Coa7lcc5ZW6NMCWEeFnzuiynHXdKuUXmqw_9zFrgyC9-h1I671RUihdQGaKQnmi9LZ5FwH_D7NnV8stHkSc8sV4akxY4nk0KybjEvZNvgVAInPVxDY1iWNmLmgedztzeHu/s1600/collapse-Nano+Yulianto.jpg" border="0" /></a>

<div id="rabbit" style="width: 400px; background: #BDF381">

<p>Terserah agan.....</p>
<p>Terserah agan.....</p>
<p>Terserah agan.....</p>
</div>

Posted By @Ucup_bulldog04.22

Pasang BackGround Pada Followers

Filled under:

Background
Posted Image

langsung saja ke tutorialnya.
1.login blogger
2.Dashboard--> Design- ->Edit HTML
3.cari kode ]]></b:skin>
4. masukan kode dibawah SEBELUM kode ]]></b:skin>


#Followers1 h2 {background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgS3K_TXkljNrkSiiJ10siUR4jLI7HP2jtOFPMWnVNPzHod-XtKozqeBV1mv-L9VaykdBk0zPKU8nVhEaS_xa4icpWGrVJS9AtQZsUNyujfw9a0aN8PFEn8QQh1LbMhSJ37EYw5lPRq5qM/s1600/members2.png) no-repeat scroll left top;height:32px;margin-bottom:-5px;text-indent:-9999px;}
#Followers1-wrapper {
background-image: url(http:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1bjnlQobiHdceaKn8xF-TzcjzcR7nxEmGO1VqcLZkpo6q7iiZbkZaKuho_Sz0lvpalVr9zifYiTFOCFfJXLLwhFjexRv6GS_01BEKXVfzANUmDjm9TaTUvvidllErEhlCjMJXE4bBcpBM/s1600/fbg.png);
color:#555147;width: 290px;height: 320px;);}
.foot-block {
line-height: 14px; font-family: Arial, Helvetica, sans-serif !important; font-size: 13px !important; color: #5f5f5f !important;
width: 260px;height: 222px;padding: 17px;
-webkit-box-shadow:1px 1px 10px 1px rgba(0, 0, 0, 0.1);
-moz-box-shadow:1px 1px 10px 1px rgba(0, 0, 0, 0.1);}

5.save dan liat hasilnya

Posted By @Ucup_bulldog04.18

Kamis, 08 Desember 2011

Cara Membuat link Kedap Kedip

Filled under:

ikuti langkah-langkah berikut :
  • log in ke www.bloger.com
  • masuk ke design/rancangan
  • klick edit HTML
  • cari code <head>
  • pastekan code di bawah ini, tepat di bawah code <head>
  •  <script src='http://palangi.googlecode.com/files/pelangi.js'/> 
  • kemudian click save/simpan template
  • selesai 
  • coba lihat blog anda

Posted By @Ucup_bulldog00.29

Kumpulan Widget Indonesia

Filled under:

Cara - cara:
1. Login Ke blog > pada dasboard blog kamu pilih Design > Page Element > Add Gadget dan pilih JavaScript/HTML. Kemudian pastekan kode yang kamu pilih.
Silahkan pilih widget - widget dibawah ini:

Kumpulan Widget Blogger Indonesia
Style #1
Iskaruji dot com
Sudut Kiri atas
<script language="JavaScript" src="http://my-project-hujangede.googlecode.com/files/hujangede_Kiri_Atas.js" type="text/javascript"></script> <script language="JavaScript" type="text/javascript"> cot("http://lh4.ggpht.com/_55xfixw5xxA/TSQeqQkaV7I/AAAAAAAAAO0/kFJ7ZrLVy3s/Widget%20Blogger%20Indonesia.png") </script>
Style #2 
Iskaruji dot com
Sudut kanan atas
<script language="JavaScript" src="http://my-project-hujangede.googlecode.com/files/Hujangede_kanan_atass.js" type="text/javascript"></script> <script language="JavaScript" type="text/javascript"> cot("http://lh6.ggpht.com/_55xfixw5xxA/TSRAD5V-CeI/AAAAAAAAAPc/czrjhswKpVo/Widget%20Kanan%20Blogger%20Indonesia.png") </script>
Style #3 
Iskaruji dot com
Sudut Kiri bawah
<script language="JavaScript" src="http://my-project-hujangede.googlecode.com/files/hujangede_kiri_bawah.js" type="text/javascript"></script> <script language="JavaScript" type="text/javascript"> cot("http://2.bp.blogspot.com/-Y1dKjqpXvgA/Tb92aJRlKoI/AAAAAAAABYs/PLNETiLrfRQ/s1600/Blogger+Indonesia+Kiri.png") </script>
Style #4 
Iskaruji dot com
Sudut kanan bawah
<script language="JavaScript" src="http://my-project-hujangede.googlecode.com/files/Hujangede_kanan_Bawahh.js" type="text/javascript"></script> <script language="JavaScript" type="text/javascript"> cot("http://2.bp.blogspot.com/-Y1dKjqpXvgA/Tb92aJRlKoI/AAAAAAAABYs/PLNETiLrfRQ/s1600/Blogger+Indonesia+Kiri.png") </script>

  • Silahkan untuk texs warna merah untuk di ganti dengan gambar pilihan anda dengan format ukuran  100 X 100 Pixel . dan ukuran bisa berapa saja sesuka mu.
Note: Pada sebagian template, tampilan widget Blogger Indonesia ini tidak bisa tampil tepat pada sudut yang diinginkan, sehingga akan terlihat janggal jika memasang widget ini.
Dan Hujangede juga punya gambar - gambar blogger indonesia lagii. silahkan di pilih :
Iskaruji dot com

http://lh5.ggpht.com/_55xfixw5xxA/TSVHdy9MFxI/AAAAAAAAAP0/nfFe3OYf3E0/Blogger%20Indonesia.png
Iskaruji dot com
http://lh5.ggpht.com/_55xfixw5xxA/TSVKbIlXynI/AAAAAAAAAP4/zO6JhyIbaDI/Blogger%20Indonesia2.png
Iskaruji dot com
http://lh4.ggpht.com/_55xfixw5xxA/TSVQ9DjCCRI/AAAAAAAAAP8/hYT_tTq5KV0/Widget%20garuda.png
http://img834.imageshack.us/img834/6526/blogger12.png


Selamat Mencoba all 



yang mau copas silakan setakan credit

Posted By @Ucup_bulldog00.17

Selasa, 06 Desember 2011

Cara Agar Text & Gambar Bergerak

Filled under:

Cara Membuat Tulisan Berjalan

Bagaimana agar bisa membuat tulisan berjalan?


Seperti Ini ??



Bergerak kekanan !

Bergerak Kekiri !

Ke Kanan dan Kekiri ??

Ke Kanan dan Kekiri Dan Bisa Di stop??

Bergerak Ke Atas dan Ke bawah
   Oke ini kode nya :

Untuk Yang bergerak kekanan



Untuk Yang Bergerak kekiri ! : Tinggal ganti kata "right" menjadi "Left"



Untuk Yang Ke Kanan dan Kekiri




Untuk Yang Bergerak kekanan Perlahan : Note : nilai scrolldelay menentukan cepat atau lambatnya tulisan bergerak.Direction = menentukan arah bergerak




Untuk Yang Ke Kanan dan Kekiri Dan Bisa Di stop




Untuk Yang Bergerak Ke Atas




Untuk Yang Bergerak Ke Atas dan Ke bawah



Note : Anda bisa merubah warna tulisan dengan mengubah angka pada :

rgb(255,0,0)=menjadi merah
rgb(0,255,0)=menjadi Hijau
rgb(0,0,255)=menjadi Biru
Atau dikombinasi....Coba-coba aja ya....

Update 25 agustus 2009:

Karena ada pertanyaan soal bagaiamana cara agar gambar bisa bergerak kekanan atau kekiri, maka sy perlu tambahkan sedikit disini ...
caranya pertama anda bikin dulu image yang anda inginklan, lalu anda upload image tsb ke photobucket.com
Kemudian nanti dari photobucket anda akan mendapatkan URL dari image yg anda upload tsb.
Kemudian masukkan ke dalam scrip marque(Berjalan) seperti yg ada diatas.
Berikut contoh script utk image Photo saya yg bergeraK Kekanan;

<marquee direction="right"><img src="http://i1139.photobucket.com/albums/n555/aslang123/cooltext567921035.gif" /></marquee>
Nih Gan Contohnya kalau Ingin Gambar Bergerak Kanan Oke,.,.



ganti URL yang bergaris bawah >> http://i1139.photobucket.com/albums/n555/aslang123/cooltext567921035.gif  Dengan URL image milik anda
Attention :
  • Kalau Ingin Ada yang Di ganti Lihat Tanda koma atas ' " dan tanda kurung seperti Ini </> 
  • Sebar Luaskan Tentang Posting Ini yahh,,,,

Posted By @Ucup_bulldog07.00

Cara Agar Di Posting Ada Previous & Next Page

Filled under:

Selamat Sore semuanya, , nah yang satu ini juga akan membahas cara membuat Previous dan Next dibawah Halaman Post kamu. Sebelum membuat ini,  berharap agar kamu semua mendownload back up template-Nya dulu biar kalau rusak kan masih ada back –up nya. Nah yuk mari coretan rizal tuntun cara-caranya:

1. Kamu Login ke Blog kamu,
2. Terus kamu klik Dashboard,
3. Setelah itu kamu klik lagi itu deh Layout dan Edit Html,

4. Tolong jangan di Conteng kota kecil yang disebelah ‘Expand Widget Templates’

5. Sudah itu cari kode yang begini ]]></b:skin>
biar mudah kamu tekan ctrl + f itu sangat membantu pencarian
 ]]></b:skin>
Terus Letakkan Di atas kode-Nya dan dengan kode di bawah ini
.showpageArea a {
text-decoration:underline;

}

.showpageNum a {

text-decoration:none;

border: 1px solid #cccccc;

margin:0 3px;

padding:3px;

}

.showpageNum a:hover {

border: 1px solid #cccccc;

background-color:#cccccc;

}

.showpagePoint {

color:#333;

text-decoration:none;

border: 1px solid #cccccc;

background: #cccccc;

margin:0 3px;

padding:3px;

}

.showpageOf {

text-decoration:none;

padding:3px;

margin: 0 3px 0 0;

}

.showpage a {

text-decoration:none;

border: 1px solid #cccccc;

padding:3px;

}

.showpage a:hover {

text-decoration:none;

}

.showpageNum a:link,.showpage a:link {

text-decoration:none;

color:#333333;

}

]]></b:skin>
Contoh Sudah jadi Di atas :

Nah kalau sudah kamu cari lagi kode
</body> ini
</body>
Terus Letakkan Diatas kode-Nya dan dengan kode di bawah ini
<!--Page Navigation Starts-->
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord =&#39;Previous&#39;;
var downPageWord =&#39;Next&#39;;
</script>
<script src='http://blogergadgets.googlecode.com/files/blogger-page-navi.v1.js' type='text/javascript'/>
</b:if>
</b:if>
<!--Page Navigation Ends -->
</body>

Terus Jangan Lupa Save Setelah itu Lihat Blog anda…


var pageCount=5;

ini untuk menampilkan jumlah posting, dan bisa kamu rubah sesuka hati kamu


var displayPageNum=5;

ini untuk menampilkan jumlah angka, dan bisa kamu rubah sesuka hati kamu


var upPageWord ='Previous'; dan var downPageWord ='Next';

kode yang diatas atalah teks yang akan tampil pada halaman Previous dan Next


Contoh Gambar Jika Berhasil :
 
 
 
Good luck ( ^ ^,)

Posted By @Ucup_bulldog06.37

Gadget Metal Slug

Filled under:

Kali Ini Saya Akan Share Gadget Metalslug Buatan saya Seperti yang ada di bagian bawah blog saya,.,.

Tapi Sekarang Sudah di Hapuss.,.

oke jadi saatnya berbagi Ilmu,.,.



Copy Code di Bawah Ini,.

<marquee behavior="scroll" direction="up" scrollamount="3" width="490" height="360"><img src="http://i1139.photobucket.com/albums/n555/aslang123/Motorcycle_Slug.gif"/> <br /> <img src="http://i1139.photobucket.com/albums/n555/aslang123/games_metalSlug-prisonerRunning.gif"/><br /> <img src="http://i1139.photobucket.com/albums/n555/aslang123/RebelCooking.gif"/><br /> <img src="http://i1139.photobucket.com/albums/n555/aslang123/011as.gif"/><br />  <img src="http://i1139.photobucket.com/albums/n555/aslang123/Metalslug.gif"/><br /> <img src="http://i1139.photobucket.com/albums/n555/aslang123/0seziebr.gif"/><br /> <img src="http://i1139.photobucket.com/albums/n555/aslang123/Bigrocketlauncher.gif"/><br /> <img src="http://i1139.photobucket.com/albums/n555/aslang123/32344.gif"/><br />
</marquee>

Setelah Itu Buka rancangan > elemen laman > <tambah gadget> >html/javascript > paste

setelah itu simpan,.,. dan Lihat lah sekarang oke selamat mencoba,.,.

Contohnya sudah ada jadi silahkan coba,.,. kalau kurang mengerti silahkan comment yahh,.,.

Nih Contoh Jadinya









Posted By @Ucup_bulldog06.24

Gadget Ichigo & Naruto Berjalan Dengan Text

Filled under:

Sekarang Saya Akan Share Gadget Yang Ada Di Atas Blog Saya Yang Bergambar Naruto Dan Ichigo Berjalan
Dengan Text

Contoh :

Welcome To My Blogger Jangan Lupa Follow Please Comment Posting Saya Dan Jangan Lupa Kritik Dan Sarannya





Lalu Buat Gadget Dengan Langkah2

nih codenya

<marquee direction="right"><img src="
http://i1139.photobucket.com/albums/n555/aslang123/ichigorun.gif" /><span style="text-shadow: 2px 2px 6px #0000ff; color: rgb(255, 0, 0);
font-weight: bold;">Welcome To My Blogger Jangan Lupa Follow Please Comment Posting Saya Dan Jangan Lupa Kritik Dan Sarannya</span><img src="http://i418.photobucket.com/albums/pp269/debestof/ninja/OTK_Naruto_Run_by_scratch_the_hedgie.gif" /></marquee>


  • Text yang berwarna Hijau Itu Adalah Programnya 
  • Text Yang Berwarna Biru Itu Adalah Program Gambarnya
  • Text Yang Berwarna Merah Itu Adalah Text Yang Berjalan
  • Text Yang BErwarna Putih Itu Adalah Efek dan Ukuran dan Warna Dari Text
  1. Text Yang Berwarna Hijau jangan Anda Ganti, Silahkan Anda Ganti Text yang berwarna biru atau pun merah dan Putih pun juga bisa anda ganti dengan yang anda inginkan karna format yang saya share itu berwarna merah,.,. jadi silakan anda ganti sendiri ya., code warnanya,.,.
  2. Tambah Gadget >> Html/javascript >> masukan code diatas >> Simpan >> Lihat Blog >> Tara,.,.

Posted By @Ucup_bulldog06.21

Rabu, 30 November 2011

Membuat Text Shadow

Filled under:


Penggunaan efek shadow pada teks merupakan salah satu bagian trik yang bagus, selain teks lebih enak dibaca juga agar web ataupun blog tampil lebih menarik dan terkesan lebih elegan. Tapi tentu dalam pemberian efek shadow pada teks juga harus disesuaikan besar kecilnya ukuran font, gelap terangnya efek shadow yang tampil, dan lebar tidaknya efek blur yang muncul. Dan semua itu bisa kita atur nilainya agar teks yang kita buat menggunakan efek ini lebih enak dibaca dan tampil lebih indah.

Ada 2 cara dalam pembuatan text-shadow silahkan ikuti langkah-langkah dibawah ini :

1. Menggunakan kode html (xhtml)
Kita bisa secara langsung membuat Text Shadow pada area posting, dengan cara menambah kode html pada area html. Berikut adalah cara penulisan kode HTML :

<h3 style="color: #01022c; font-family: staccato222 BT; font-size: 2em; font-weight: 700; line-height: 1.2em; padding: 3px 10px; text-shadow: 0.1em 0.1em 0.2em rgb(119, 119, 119);">
Tuliskan Teks anda disini !!
</h3> 


2. Berikut Hasilnya : 

Tuliskan Teks di sini !! 


3. Menggunakan kode CSS.
Untuk cara yang ini anda harus menyisipkan kode Css pada Template, tepatnya anda bisa letakkan kode Css sebelum tag </head>. 

Berikut contoh teks shadow menggunakan kode Css :
<style type='text/css'>
.teks-shadow {
color: #01022c;
font-family: staccato222 BT;
font-size: 2em;
font-weight: 700;
line-height: 1.2em;
padding: 3px 10px;
text-shadow: 0.1em 0.1em 0.2em rgb(119, 119, 119)
}
</style> 

4. Kemudian untuk menampilkan text shadow kita tinggal menambah kode html pada widget atau area posting ataupun dimana anda akan menempatkan teks shadow sesuai kebutuhan anda. 
<div class="teks-shadow">
Tulis Text anda disini !!
</div> 


Berikut hasilnya :

Tulis Teks anda disini !! 


5. Semoga bermanfaat 

Posted By @Ucup_bulldog06.18