Blog Jawa

You are here: » Home » All posts

CARA MEMBUAT TAG AWAN (CLOUDCULUMUS)

19.01 Unknown

Untuk blog yang ingin menggunakan gadget atau widget label Culumus, widget culumus ini biasa digunakan di WordPress, tetapi Gadget tersebut bisa diterapkan untuk Gadget Blogger, asalkan Anda tahu cara mengedit HTML untuk menerapkan widget ini. Gratis untuk menyalin contoh kode HTML berikut di Bawah ini, jangan lupa untuk mencari kode serupa, ingat sebelum Anda menerapkan widget ini, sebelum Sobat mengedit HTML, centang Expand Widget Templates agar tidak ada kesalahan. Untuk mencari kode yang dimaksud di bawah, tekan tombol (Ctrl + F) agar

mudah dalam pencarian.

Cari kode yang sama seperti di bawah

<b:section id=’sidebar’ preferred=’yes’>

atau

<b:section class=’sidebar’ id=’sidebar’ preferred=’yes’>

Setelah Anda copy dan paste kode di bawah seperti ini,

<b:section class=’sidebar’ id=’sidebar’ preferred=’yes’>

atau kode seperti ini,

<b:section id=’sidebar’ preferred=’yes’>

<b:widget id=’Label99′ locked=’false‘ title=’Labels‘ type=’Label‘>
<b:includable id=’main’>
<b:if cond=’data:title’>
<h2><data:title/></h2>
</b:if>
<div class=’widget-content’>
<script src=’http://halotemplates.s3.amazonaws.com/wp-cumulus-example/swfobject.js’ type=’text/javascript’/>
<div id=’flashcontent’>Blogumulus by <a href=’http://www.roytanck.com/’>Roy Tanck</a> and <a href=’http://create-freeblogs-n-widgets.blogspot.com/’>free widgets for blogs
</a></div>
<script type=’text/javascript’>
var so = new SWFObject("http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");
// uncomment next line to enable transparency
//so.addParam("wmode", "transparent");
so.addVariable("tcolor", "0×333333");
so.addVariable("mode", "tags");
so.addVariable("distr", "true");
so.addVariable("tspeed", "100");
so.addVariable("tagcloud", "<tags><b:loop values=’data:labels’ var=’label’><a expr:href=’data:label.url’ style=’12′><data:label.name/></a></b:loop></tags>");so.addParam("allowScriptAccess", "always");
so.write("flashcontent");
</script>
<b:include name=’quickedit’/>
</div>
</b:includable>
</b:widget>

Ini hanya contoh saja, tidak masalah jika Sobat ingin bereksperimen silakan. Semoga widget ini bisa aktif, jika tidak aktif silakan Anda pergi ke halaman berikutnya untuk mendownload Tag CloudCulumus

[Read More...]

Cara Membuat Smooth Back To Top dengan jQuery

18.57 Unknown

Scroll to top, Istilah lain dalam blogger yang artinya sama dengan Back to Top yaitu, Sebuah Link yang menuju ke bagian atas halaman atau blog atau website. dan di kesempatan kali ini saya akan memberikan sebuah tutorial tentang membuat Smooth Back to top atau Scroll to top dengan menggunakan jQuery. seperti yang kita ketahui, jika kita membuat back to top dengan kode HTML biasa, seperti contoh, Klik disini jika ingin melihat hasil back top top biasa. dan bedakan dengan back to top yang akan kita buat nanti.

Langkahnya sangat mudah,
1. Masuk ke blogger, Rancangan, Edit HTML Template.
2. Cari kode </head>
3. Paste Kode berikut tepat diatasnya

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

<script src='//myhavies.jw.lt/js/ke_atas.js' type='text/javascript'/>

4. Cek, apakah kode yang berwarna merah ada dalam template sobat, jika ada tidak perlu ditambahkan lagi kode berwarna merah tersebut.
5. Simpan Template, dan lihat hasilnya

[Read More...]

Cara membuat like fan page facebook melayang pada blog

16.33 Unknown

Contoh like fan page facebook melayang seperti gambar di atas.

Di sertai tombol close.

Jika sobat ingin membuatnya,

Berikut ini caranya:

1. login blog

2. rancangan

3. Add gadget "html/javascript"

4. Copast kode b erikut

<style type="text/css">
#topbar{
position:absolute;
padding-top:120px;
padding-left:330px;
background-color: transparancy;
width: 292px;
visibility: hidden;
z-index: 100;
}
</style>
<script type="text/javascript">
var persistclose=0 //set to 0 or 1. 1 means once the bar is manually closed, it will remain closed for browser session
var startX = 30 //set x offset of bar in pixels
var startY = 5 //set y offset of bar in pixels
var verticalpos="fromtop" //enter "fromtop" or "frombottom"
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
function closebar(){
if (persistclose)
document.cookie="remainclosed=1"
document.getElementById("topbar").style.visibility="hidden"
}
function staticbar(){
barheight=document.getElementById("topbar").offsetHeight
var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
var d = document;
function ml(id){
  var el=d.getElementById(id);
  if (!persistclose || persistclose && get_cookie("remainclosed")=="")
  el.style.visibility="visible"
  if(d.layers)el.style=el;
  el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};
  el.x = startX;
  if (verticalpos=="fromtop")
  el.y = startY;
  else{
  el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
  el.y -= startY;
  }
  return el;
}
window.stayTopLeft=function(){
  if (verticalpos=="fromtop"){
  var pY = ns ? pageYOffset : iecompattest().scrollTop;
  ftlObj.y += (pY + startY - ftlObj.y)/8;
  }
  else{
  var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
  ftlObj.y += (pY - startY - ftlObj.y)/8;
  }
  ftlObj.sP(ftlObj.x, ftlObj.y);
  setTimeout("stayTopLeft()", 10);
}
ftlObj = ml("topbar");
stayTopLeft();
}
if (window.addEventListener)
window.addEventListener("load", staticbar, false)
else if (window.attachEvent)
window.attachEvent("onload", staticbar)
else if (document.getElementById)
window.onload=staticbar
</script>
<br />
<div class="clear">
</div>
<div id="topbar">
<div style="text-align: center;">
<a href="" onclick="closebar(); return false"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjS-UJY5FRBsW6QtDS1VensX28-eJcKsoGYnjq1Cwrw6zNR6eShfaovuK75QPb7Z1XnvDEqQOrdY9SiR0eqPb2DMH7K-Y99gm6_PS5SBCVEZChqRCY8QCG_zF-IULc7V7VsciBRZG3SQnCU/s1600/Close+Button.gif" /></a></div>
<center>
<div style="background: #000;">
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2FTutorial-Blog-Zona-Mig33-internet%2F327653677253564&width=300&height=300&colorscheme=dark&show_faces=true&border_color=ff0000&stream=false&header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:190px; height:300px;" allowtransparency="true"></iframe>
</div>
</center>
</div>

Kode warna kuning adalah kode like fan page facebook.

Ganti dengan kode sobat atau dapat di ganti dengan widget yang lain.

Semoga tutorial cara membuat like fan page facebook melayang pada blog nya bermanfaat.

~~http://www.cybermig.com/2012/02/cara-membuat-like-fan-page-facebook.html?showComment=1335337093261#c7626908758808364880~~

[Read More...]

Cara membuat iklan melayang dengan 1x klik untuk close

16.31 Unknown

Seperti pada aturan iklan kumpulblogger.com yaitu dapat menggunakan

iklan melayang tetapi dengan tombol close 1x klik.

Berikut kode yang harus di tambahkan pada script iklan:

<style type="text/css">
#gb{
position:fixed;
top:10px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbcontent{
float:right;
background:transparant;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir-100;
gb.style.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>
<div id="gb">
<div class="gbtab" onclick="showHideGB()"> </div>
<div class="gbcontent">
<div style="text-align:left">
<a href="javascript:showHideGB()">
[Close]
</a>
</div>
<center>

KODE SCRIPT IKLAN
</center>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.center = (20-gb.offsetWidth).toString() + "px";
</script></div></div>

Letakkan di rancangan add gadget "html/javascript" blog sobat

Jangan lupa simpan ..

Selamat mencoba.

[Read More...]

Cara Memasang kotak admin di bawah postingan blog

16.18 Unknown

Apabila sobat sepert apa kotak admin di bawah postingan blog,

Contoh gambar berada di atas tuh.

So bagaimana cara membuatnya?

Begini:

1. Login blog

2. Rancangan

3. Edit html dan centang expand widget template

4. Letakkan kode berikut di atas ]]></b:skin>

.admin-tulisan{
display:block;
width:auto;
background:#1E1E1F;
border:2px solid #333;
box-shadow:0 1px 3px #000;-moz-box-shadow: 0px 0px 10px #292929;
-webkit-box-shadow: 0px 0px 10px #292929;
box-shadow: 0px 0px 10px #292929;;
padding:0;
margin:30px 0 10px 0;
font:normal 12px Arial, Sans-Serif;
color:#D9D9D9;
}
.admin-tulisan .kontainer{padding:5px;}
.admin-tulisan h4{
background:#4733FF;
border:none;
border-bottom:1px solid #699019;
color:#fff;
text-transform:normal;
text-shadow:0 1px 0 rgba(0, 0, 0, 0.4);
font:bold 12px Arial,Sans-Serif;
padding:5px 10px;
margin:0 0 0 0;
display:block;
}
.admin-tulisan h4 a{color:#FEEA83;}
.admin-tulisan img{
width:70px;
height:70px;
margin:0 10px 0 0;
float:left;
border:1px solid #954B02;
padding:2px;
background:#2E2E2E;
box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none;
}

Ganti warna kotak admin sesuai keinginan

5. Letakkan kode berikut di bawah <data:post.body>

<b:if cond='data:blog.pageType == "item"'>
<div class='admin-tulisan'>
<h4>Ditulis Oleh : <a expr:href='data:blog.homepageUrl'><data:post.author/></a> ~ www.cybermig.com</h4>
<div class='kontainer'>
<img src='http://dl3.glitter-graphics.net/pub/1246/1246493ere9f5q4uj.gif'/>
Artikel <a expr:href='data:post.url'><data:post.title/></a> ini diposting oleh <data:post.author/> pada hari <data:post.dateHeader/>. Terimakasih atas kunjungan Anda serta kesediaan Anda membaca artikel ini. Kritik dan saran dapat anda sampaikan melalui kotak komentar.
<div style='clear:both;'/>
</div>
</div>
</b:if>

Ganti kode berwarna merah dengan gambar dan url sobat

6. Simpan template

Demikian cara membuat kotak admin di bawah postingan blog.

Semoga tutorialnya bermanfaat.

~~sumber:http://www.cybermig.com/2012/01/cara-membuat-kotak-admin-di-bawah.html~~

[Read More...]

Cara memasang sharing is sexy pada blog

16.13 Unknown

Memasang Social Bookmark adalah salah satu cara yang cukup mudah,
sebagai salah satu cara untuk melakukan promosi blog.
Bookmark sosial adalah metode untuk pengguna internet untuk berbagi, mengatur, mencari, dan penanda suatu web atau blog.
So bagaimana cara membuat share social bookmark sharing is sexy?
Simak langkah2nya:

1. Login blog
2. Rancangan
3. Edit html dan centang:expand widget template"
4. Letakkan kode di atas ]]></b:skin>

div.beauty-bookmarks {
height:54px;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpmVrndovIej9knoIhRd08MLj6bMIZtJVY41ifGadDOtuVDnaOlW1soXIlo2YwXd7WiQijS6IbZMRAiiCCF1ifqW5rmof0luMIPhKoPOZY5A5ZvDObPbpMft4CdMoIro5HjCVma98oI-52/') no-repeat left bottom;
position:relative;
width:455px;
}
div.beauty-bookmarks span.beauty-rightside {
width:17px;
height:54px;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpmVrndovIej9knoIhRd08MLj6bMIZtJVY41ifGadDOtuVDnaOlW1soXIlo2YwXd7WiQijS6IbZMRAiiCCF1ifqW5rmof0luMIPhKoPOZY5A5ZvDObPbpMft4CdMoIro5HjCVma98oI-52/') no-repeat right bottom;
position:absolute;
right:-17px;
}
div.beauty-bookmarks ul.socials {
margin:0 !important;
padding:0 !important;
position:absolute;
bottom:0;
left:10px;
}
div.beauty-bookmarks ul.socials li {
display:inline-block !important;
float:left !important;
list-style-type:none !important;
margin:0 !important;
height:29px !important;
width:48px !important;
cursor:pointer !important;
padding:0 !important;
}
div.beauty-bookmarks ul.socials a {
display:block !important;
width:48px !important;
height:29px !important;
font-size:0 !important;
color:transparent !important;
}
.beauty-furl, .beauty-furl:hover, .beauty-digg, .beauty-digg:hover, .beauty-reddit, .beauty-reddit:hover, .beauty-stumble, .beauty-stumble:hover, .beauty-delicious, .beauty-delicious:hover, .beauty-technorati, .beauty-technorati:hover, .beauty-facebook, .beauty-facebook:hover, .beauty-twitter, .beauty-twitter:hover, .beauty-script-style, .beauty-script-style:hover, .beauty-designfloat, .beauty-designfloat:hover {
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsdqiHFbSFDP6ihB0Zl5wpf7vz5Ov7bcnWQ0c_pyql_NxPnMjlHU94onIqB-Ho8w4XhikK9p8CcKkdoEX77pp3RyA9Vp45EwoCBERcSA_xvloPjSL-QQPeHV-RlI7AW351IBeFWQzuFuKP/') no-repeat !important;
}
.beauty-furl {
background-position:-300px top !important;
}
.beauty-furl:hover {
background-position:-300px bottom !important;
}
.beauty-digg {
background-position:-500px top !important;
}
.beauty-digg:hover {
background-position:-500px bottom !important;
}
.beauty-reddit {
background-position:-100px top !important;
}
.beauty-reddit:hover {
background-position:-100px bottom !important;
}
.beauty-stumble {
background-position:-50px top !important;
}
.beauty-stumble:hover {
background-position:-50px bottom !important;
}
.beauty-delicious {
background-position:left top !important;
}
.beauty-delicious:hover {
background-position:left bottom !important;
}
.beauty-technorati {
background-position:-700px top !important;
}
.beauty-technorati:hover {
background-position:-700px bottom !important;
}
.beauty-twitter {
background-position:-350px top !important;
}
.beauty-twitter:hover {
background-position:-350px bottom !important;
}
.beauty-facebook {
background-position:-450px top !important;
}
.beauty-facebook:hover {
background-position:-450px bottom !important;
}
.beauty-script-style {
background-position:-400px top !important;
}
.beauty-script-style:hover {
background-position:-400px bottom !important;
}
.beauty-designfloat {
background-position:-550px top !important;
}
.beauty-designfloat:hover {
background-position:-550px bottom !important;
}

5. Letakkan kode berikut di bawah <data:post.body> yang ke2

<b:if cond='data:blog.pageType == "item"'>
<div class='beauty-bookmarks'>
<ul class='socials'>

<li class='beauty-delicious'><a expr:href='"http://del.icio.us/post?url=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>


<li class='beauty-digg'><a expr:href='" http://digg.com/submit?url=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>


<li class='beauty-technorati'><a expr:href='" http://technorati.com/faves?add=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>


<li class='beauty-reddit'><a expr:href='" http://www.reddit.com/submit?url=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>


<li class='beauty-stumble'><a expr:href='" http://www.stumbleupon.com/submit?url=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>


<li class='beauty-designfloat'><a expr:href='"http://www.designfloat.com/submit.php?url=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>


<li class='beauty-facebook'><a expr:href='" http://www.facebook.com/sharer.php?u=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>


<li class='beauty-twitter'><a expr:href='"http://twitter.com/home/?status=Chk Out-" + data:post.title + " " + data:post.url' target='_blank'/></li>


<li class='beauty-furl'><a expr:href='" http://www.furl.net/storeIt.jsp?u=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>

</ul>
<span class='beauty-rightside'/>
</div>
</b:if>

6. Simpan template

[Read More...]

Cara memasang emoticon girl sexy di atas kotak komentar blog

16.11 Unknown

:a: :b: :c: :d: :e: :f: :g: :h: :i: :j: :k: :l:

Yang satu ini beda dari emoticon yang lain sob...
Jika sobat ingin tahu cara membuatnya,
simak tutorialnya baik2 yak...

1. Login blog
2. Rancangan
3. Edit html
4. Letakkan kode di atas </body>

<script src='http://elmubarok.googlecode.com/files/sexyemotion.js' type='text/javascript'/>

5. Letakkan kode berikut di atas <b:if cond='data:post.embedCommentForm'>
atau di bawah <p class='comment-footer'>

<b><img height='50' src='http://i881.photobucket.com/albums/ac17/elmubarok/ce10.gif' width='50'/>
:a:
<img height='50' src='http://i881.photobucket.com/albums/ac17/elmubarok/ce11.gif' width='50'/>
:b:
<img height='50' src='http://i881.photobucket.com/albums/ac17/elmubarok/ce12.gif' width='50'/>
:c:
<img height='50' src='http://i881.photobucket.com/albums/ac17/elmubarok/ce6.gif' width='50'/>
:d:
<img height='50' src='http://i881.photobucket.com/albums/ac17/elmubarok/ce7.gif' width='50'/>
:e:
<img height='50' src='http://i881.photobucket.com/albums/ac17/elmubarok/ce8.gif' width='50'/>
:f:
<img height='50' src='http://i881.photobucket.com/albums/ac17/elmubarok/ce9.gif' width='50'/>
:g:
<img height='50' src='http://i881.photobucket.com/albums/ac17/elmubarok/cesexy1.gif' width='50'/>
:h:
<img height='50' src='http://i881.photobucket.com/albums/ac17/elmubarok/cesexy2.gif' width='50'/>
:i:
<img height='50' src='http://i881.photobucket.com/albums/ac17/elmubarok/cesexy3.gif' width='50'/>
:j:
<img height='50' src='http://i881.photobucket.com/albums/ac17/elmubarok/cesexy4.gif' width='50'/>
:k:
<img height='50' src='http://i881.photobucket.com/albums/ac17/elmubarok/cesexy5.gif' width='50'/>
:l:
</b>