BloggerMates

FOLLOWERS

[ Categories ]

[ Followers ]

Image

[ Partner Link ]

[ Recent Comments ]

Arnoldi-Technology

[ Advertiser ]

Code HTML/Isi Widget kalian
Diberdayakan oleh Blogger.
Tampilkan postingan dengan label Tips Blog. Tampilkan semua postingan
Tampilkan postingan dengan label Tips Blog. Tampilkan semua postingan

Membuat Rondom Banner (Rotasi) Otomatis Di Blog

Membuat Banner Rotation Otomatis atau Random Banner di Blog (Membuat Banner Iklan Tampil Secara Acak) di Blogger ini merupakan trik yang sederhana karena akan bermanfaat bagi para blogger yang banyak memasang Iklan Banner.


Dengan script ini banner diblog kita akan berotasi (berganti-ganti) setiap melakukan reload atau berganti halaman (pageview). sehingga space di blog anda lebih lapang dan tidak keliatan kumuh. Untuk membuatnya sangat mudah


1. Login ke Blogger » Pilih Rancangan » Tambah Widget (Add Widget) » Pilih HTML/Javascript
2.Masukkan script dibawah ini :
<SCRIPT LANGUAGE="JavaScript">
<!--
Begin
var jumlah_iklan = 3;
var waktu_sekarang =
new Date()
var detik = waktu_sekarang.getSeconds()
var
pasang_iklan = detik % jumlah_iklan;
pasang_iklan +=1;
if
(pasang_iklan==1) {
txt="Tulis Title";
url="Alamat URL";
alt="Alamat URL";
banner="Alamat URL Gambar";
width="468";
height="60";
}
if
(pasang_iklan==2) {
txt="Tulis Title";
url="Alamat URL";
alt="Alamat URL";
banner="Alamat URL Gambar";
width="468";
height="60";
}
if
(pasang_iklan==3) {
txt="Tulis Title";
url="Alamat URL";
alt="Alamat URL";
banner="Alamat URL Gambar";
width="468";
height="60";
}
document.write('<center>');
document.write('<a
href=\"' + url + '\" target=\"_top\">');
document.write('<img
src=\"' + banner + '\" width=')
document.write(width + ' height=' +
height + ' ');
document.write('alt=\"' + alt + '\"
border=0><br>');
document.write('<small>' + txt +
'</small></a>');
document.write('</center>');
//
End -->
</SCRIPT>

Keterangan :
Ubah tulisan yang sudah saya tebalkan di atas, sesuai dengan kebutuhan anda.

Sumber

Cara Blogwalking Cepat , Tanpa Ribet


cara blogwalking cepat
blogwalking cepat


Salah satu tuntutan kita untuk memperlancar seo adalah kita harus melakukan blogwalking , atau dalam bahasa sederhana nya jalan-jalan ke blog lain .. namun dalam kita melakukan aktifitas blogwalking sering kali memakan waktu lama , biasanya permasalahannya ada pada blog yang kita kunjungi mempunyai loading yang lama , atau pun persoalan lain nya .bayangkan apabila kita mengunjungi berpuluh-puluh atau beratus-ratus blog tidak terbayang akan memakan waktu yang lama.
Sering kali karena berbagai kendala membuat kita malas melakukan blogwalking , namun jangan patah semangat karena saya mempunyai tips dan trick cara blogwalking cepat

Cara Blogwalking Cepat

Sebenarnya ada beberapa cara cepat blogwalking , saya akan berikan 2 tips blogwalking cepatdengan menggunakan layanan shoutmix dan cbox , cara nya sangat sederhana , saya akan terangkan satu persatu

Cara cepat blogwalking menggunakan layanan shoutmix 
1. Anda masuk ke search engine google
2. Lalu ketik keyword berikut ini untuk mengetahui kode shoutmix blog lain :
http://www.shoutmix.com/?
http://www2.shoutmix.com/?
http://www3.shoutmix.com/?  dan seterusnya anda tinggal tambahkan setelah "www" dengan menggunakan angka.
3. Maka akan muncul setelah tanda "?" nama id shoutmix nya , maka akan seperti ini : http://www2.shoutmix.com/?id pengguna shoutmix
4. Anda tinggal copy kode shoutmix yang tadi berikut id penggunanya dan paste pada browser anda .
5. Silahkan menikmati blogwalking cepat

Cara blogwalking cepat menggunakan layanan cbox
1. Ulangi proses yang telah saya terangkan diatas , masuk ke search engine google
2. Anda masukan keyword berikut ini :
http://cbox.ws/?n= 
3. Maka akan muncul beberapa kode , anda tinggal copy paste pada browser anda .

Itu lah cara blogwalking yang cepat , jangan lupa untuk komentar dan follow blog ini , bagi anda yang ingin mengcopy artikel ini harap menyertakan link asli nya yaitu link pada posting blog ini untuk saling menghargai antara sesama blogger.




Sumber

Cara membuat Trigger Hover jQuery / Vertical Sliding Panel

Langkah cara membuat Trigger Hover jQuery / Vertical Sliding Panel mengggunakan jQuery ini sobat bisa lakukan langkah -langkah berikut:

Pertama,pilih Dashboard lalu pilih Tata Letak / Rancangan(1) kemudian pilih tab Edit HTML(2),lalu seperti biasa contreng tulisan Exspand Widget Templates(3).
Lihat Gambar ya :D


Cara membuat Sexy Vertical Sliding Panel mengggunakan jQuery.
(1)


javascript - Combine hover and click functions (jQuery) ?.
(2)


Membuat Vertical Sliding Info Panel With JQuery.
(3)


Nah,selanjutnya cari kode ]]></b:skin> (gunakan Ctrl+F di keyboard sob),setelah ketemu tinggal letakkan kode CSS berikut tepat diatas kode ]]></b:skin> tersebut.

#container {
clear: both;
margin: 0;
padding: 0;
}

#container a{
float: right;
background: #9FC54E;
border: 1px solid #9FC54E;
-moz-border-radius-topright: 20px;
-webkit-border-top-right-radius: 20px;
-moz-border-radius-bottomleft: 20px;
-webkit-border-bottom-left-radius: 20px;
text-decoration: none;
font-size: 16px;
letter-spacing:-1px;
font-family: verdana, helvetica, arial, sans-serif;
color:#fff;
padding: 20px;
font-weight: 700;
}

#container a:hover{
float: right;
background: #a0a0a0;
border: 1px solid #cccccc;
-moz-border-radius-topright: 20px;
-webkit-border-top-right-radius: 20px;
-moz-border-radius-bottomleft: 20px;
-webkit-border-bottom-left-radius: 20px;
text-decoration: none;
font-size: 16px;
letter-spacing:-1px;
font-family: verdana, helvetica, arial, sans-serif;
color:#fff;
padding: 20px;
font-weight: 700;
}

.content {
font-style:normal;
font-family:helvetica, arial, verdana, sans-serif;
color:#ffffff;
background:#333333;
border:1px solid #444444;
-moz-border-radius-topright: 20px;
-webkit-border-top-right-radius: 20px;
-moz-border-radius-bottomleft: 20px;
-webkit-border-bottom-left-radius: 20px;
margin: 30px 0 50px;
padding: 15px 0;
}

.content p {
margin: 10px 0;
padding: 15px 20px;
}

.panel {
position: absolute;
top: 250px;
left: 0;
display: none;
background: #000000;
border:1px solid #111111;
-moz-border-radius-topright: 20px;
-webkit-border-top-right-radius: 20px;
-moz-border-radius-bottomright: 20px;
-webkit-border-bottom-right-radius: 20px;
width: 330px;
height: auto;
padding: 30px 30px 30px 130px;
filter: alpha(opacity=85);
opacity: .85;
}

.panel p{
margin: 0 0 15px 0;
padding: 0;
color: #cccccc;
}

.panel a, .panel a:visited{
margin: 0;
padding: 0;
color: #9FC54E;
text-decoration: none;
border-bottom: 1px solid #9FC54E;
}

.panel a:hover, .panel a:visited:hover{
margin: 0;
padding: 0;
color: #ffffff;
text-decoration: none;
border-bottom: 1px solid #ffffff;
}

a.trigger{
position: absolute;
text-decoration: none;
top: 250px; left: 0;
font-size: 16px;
letter-spacing:-1px;
font-family: verdana, helvetica, arial, sans-serif;
color:#fff;
padding: 20px 40px 20px 15px;
font-weight: 700;
background:#333333 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhg4Qwgzmp98LW3k19pULdMxPqeJ6LwT3UuFYED4foGoRFhMMNjkvqDze2zdMnuaSGohJuLb9vcpRIj5y83t8KdUceOr4L5aBgnm9_wNgrAXMVMmtWK8Oqc807KboC0qhrbp5rDXGslai4/s320/plus.png) 85% 55% no-repeat;
border:1px solid #444444;
-moz-border-radius-topright: 20px;
-webkit-border-top-right-radius: 20px;
-moz-border-radius-bottomright: 20px;
-webkit-border-bottom-right-radius: 20px;
-moz-border-radius-bottomleft: 0px;
-webkit-border-bottom-left-radius: 0px;
display: block;
}

a.trigger:hover{
position: absolute;
text-decoration: none;
top: 250px; left: 0;
font-size: 16px;
letter-spacing:-1px;
font-family: verdana, helvetica, arial, sans-serif;
color:#fff;
padding: 20px 40px 20px 20px;
font-weight: 700;
background:#222222 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhg4Qwgzmp98LW3k19pULdMxPqeJ6LwT3UuFYED4foGoRFhMMNjkvqDze2zdMnuaSGohJuLb9vcpRIj5y83t8KdUceOr4L5aBgnm9_wNgrAXMVMmtWK8Oqc807KboC0qhrbp5rDXGslai4/s320/plus.png) 85% 55% no-repeat;
border:1px solid #444444;
-moz-border-radius-topright: 20px;
-webkit-border-top-right-radius: 20px;
-moz-border-radius-bottomright: 20px;
-webkit-border-bottom-right-radius: 20px;
-moz-border-radius-bottomleft: 0px;
-webkit-border-bottom-left-radius: 0px;
display: block;
}

a.active.trigger {
background:#222222 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhis77bjPRFByxCeyP4VN2-53Mt2dG4Ls_AYrGP4zkZWwtiJGk3na87PVjcmb7ZMn1cKAd3UlJWIh0KOGSpLNfjm0nB2FBU8LqOIn6woPsD6BQHy3fqy_1w1Y8wllnBRgajjYU2UWkZeM4/s320/minus.png) 85% 55% no-repeat;
}

.columns{
clear: both;
width: 330px;
padding: 0 0 20px 0;
line-height: 22px;
}

.colleft{
float: left;
width: 130px;
line-height: 22px;
}

.colright{
float: right;
width: 130px;
line-height: 22px;
}

ul{
padding: 0;
margin: 0;
list-style-type: none;
}

ul li{
padding: 0;
margin: 0;
list-style-type: none;
}


Setelah itu,carilah kode </head>,setelah ketemu tepat diatasnya letakkan kode javascript dan jQuery berikut:

<script src='https://sites.google.com/site/pujiantoroinc/Home/jquery-1.3.2.js' type='text/javascript'/>

<script type='text/javascript'>
$(document).ready(function(){
$(&quot;.trigger&quot;).click(function(){
$(&quot;.panel&quot;).toggle(&quot;fast&quot;);
$(this).toggleClass(&quot;active&quot;);
return false;
});
});
</script>


Lalu simpan templates.
Nah,untuk menampilkannya pada widget coba pilih Tata Letak / Rancangan seperti gambar no (1),dan klik tulisan Add New Widget atau Tambah Gadget,lihat Gambar no (4)

googlecode.com/files/jquery-1.3.2.js.
(4)

javascript - Jquery 1.3.2 error on Internet Explorer.
(5)


Selanjutnya pilih HTML/Javascript lihat Gb(5)kemudian letakkan kode berikut:

<div class="panel">

<h2>Silakan pilih kategori:</h2>
<div style="clear:both;"></div>
<div class="columns">
<div class="colleft">
<h3>Bisnis Online</h3>
<ul>
<li><a href="http://marshaaruan.blogspot.com/" title="Bisnis Gratis">Bisnis Gratis</a></li>
<li><a href="http://marshaaruan.blogspot.com/" title="Domain Gratis">Domain Gratis</a></li>
<li><a href="http://marshaaruan.blogspot.com/" title="Pasang Iklan Gratis">Pasang Iklan Gratis</a></li>
<li><a href="http://marshaaruan.blogspot.com/" title="Bisnis Tanpa Modal">Bisnis Tanpa Modal</a></li>
<li><a href="http://marshaaruan.blogspot.com/" title="Uang Gratis Free!">Uang Gratis Free!</a></li>
</ul>
</div>

<div class="colright">
<h3>Ngemis Dollar Internet</h3>
<ul>
<li><a href="http://marshaaruan.blogspot.com/" title="Bisnis Gratis">Bisnis Gratisan (Baru)</a></li>
<li><a href="http://marshaaruan.blogspot.com/" title="Domain Gratis">Baru! Domain Gratis</a></li>
<li><a href="http://marshaaruan.blogspot.com/" title="Pasang Iklan Langsung!">Pasang Iklan Langsung!</a></li>
<li><a href="http://marshaaruan.blogspot.com/" title="Bisnis di Rumah">Bisnis di Rumah</a></li>
<li><a href="http://marshaaruan.blogspot.com/" title="Gratis Uang Jajan">Gratis Uang Jajan</a></li>
</ul>
</div>
</div>
<div style="clear:both;"></div>
</div>
<a class="trigger" href="#">Surf!</a>


Sumber