Seo Google

Cara membuat Like Facebook melayang dengan Timer

Posted by at 11:23 AM { 5 comments }
Cara membuat Like Facebook melayang dengan Timer
Kali ini saya akan share Cara membuat Like Facebook melayang dengan Timer. Dengan Like Facebook melayang ini diharapkan blog anda mempunyai banyak likers. Tutorial Like Facebook ini akan menampilkan widget facebook seperti pop up.
Tahap-tahap membuat widget Like Facebook melayang dengan Timer adalah:
1. Masuk ke dashboard blogger.
2. Klik edit template edit HTML.
3. Jangan lupa centang expand widget template.
4. Cari kode dibawah ini, agar mudah mencari tekan CTRL+F
</body>
5. Kemudian copy paste kode dibawah ini dibawah kode point 4 diatas.
<!-- Fans Page Pop Up SeoGoogleKu Code Start -->
<style>#fblikepop {
    background-color: #fff;
    display: none;
    position: fixed;
    top: 200px;
    _position: absolute;
 /* hack for IE 6*/
    width: 450px;
    border: 10px solid #6F6F6F;
    z-index: 200;
    -moz-border-radius: 9px;
    -webkit-border-radius: 9px;
    margin: 0pt;
    padding: 0pt;
    color: #333333;
    text-align: left;
    font-family: arial,sans-serif;
    font-size: 13px;
}

#fblikepop body {
    background: #fff none repeat scroll 0%;
    line-height: 1;
    margin: 0pt;
    height: 100%;
}

.fbflush {
    cursor: pointer;
    font-size: 11px !important;
    color: #FFF !important;
    text-decoration: none !important;
    border: 0 !important;
}

#fblikebg {
    display: none;
    position: fixed;
    _position: absolute;
 /* hack for IE 6*/
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background: #000000;
    z-index: 100;
}

#fblikepop #closeable {
    float: right;
    margin: 7px 15px 0 0;
}

#fblikepop h1 {
    background: #6D84B4 none repeat scroll 0 0;
    border-top: 1px solid #3B5998;
    border-left: 1px solid #3B5998;
    border-right: 1px solid #3B5998;
    color: #FFFFFF !important;
    font-size: 14px !important;
    font-weight: normal !important;
    padding: 5px !important;
    margin: 0 !important;
    font-family: &quot;Lucida Sans Unicode&quot;, &quot;Lucida Grande&quot;, sans-serif !important;
}

#fblikepop #actionHolder {
    height: 68px;
    overflow: hidden;
}

#fblikepop #buttonArea {
    background: #F2F2F2;
    border-top: 1px solid #CCCCCC;
    padding: 10px;
    min-height: 50px;
}

#fblikepop #buttonArea a {
    color: #999999 !important;
    text-decoration: none !important;
    border: 0 !important;
    font-size: 10px !important;
}

#fblikepop #buttonArea a:hover {
    color: #333 !important;
    text-decoration: none !important;
    border: 0 !important;
}

#fblikepop #popupMessage {
    font-size: 12px !important;
    font-weight: normal !important;
    line-height: 22px;
    padding: 8px;
    background: #fff !important;
}

#fblikepop #counter-display {
    float: right;
    font-size: 11px !important;
    font-weight: normal !important;
    margin: 5px 0 0 0;
    text-align: right;
    line-height: 16px;
}</style>
<script src='http://www.google.com/jsapi'/><script>google.load(&quot;jquery&quot;, &quot;1&quot;);</script>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
 kakinetworkdotcom01username="SeoGoogleKu",
 kakinetworkdotcom01title="Dapatkan informasi tips dan trik blogger di fanspage kami!",
 kakinetworkdotcom01skin="04",
 kakinetworkdotcom01time="20",
 kakinetworkdotcom01wait="0",
 kakinetworkdotcom01lang="en"
//]]>
</script>
<script src='https://adjifb.googlecode.com/files/pop-up-fans-fage-facebook-blogger-tutorial.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
 $(document).ready(function(){$().kakinetworkdotcom({ closeable: false });});
//]]>
</script>
<!-- Fans Page Pop Up SeoGoogleKu Code End -->
6. Untuk kode yang berwarna biru : ganti dengan nama fanspage anda.
    Untuk kode yang berwarna merah : ganti dengan tulisan agar orang mau mengklik fanspage anda
    Untuk kode yang berwarna orange : ganti dengan berapa lama widget fanspage tersebut muncul (dalam           hitungan detik)
7. Simpan/Save template anda.

Read more »

---
Labels: Tutorial Blog

Cara membuat Slider Label Blogger

Posted by at 12:15 PM { 1 comment }
Cara membuat Slider Label Blogger
Pada kesempatan ini saya akan bagikan Tutorial Cara membuat Slider Label Blogger. Anda bisa lihat contohnya dibawah ini.

Berikut langkah-langkah Cara membuat Slider Label Blogger :
1. Buka dashboard blogger
2. Buka template/rancang design
3. Jangan lupa centang Expand widget template
4. Cari kode dengan CTRL+F
]]></b:skin>
5. Letakkan kode script dibawah ini diatas kode point ke 4
#carousel{width:980px;height:125px;border-bottom:1px solid #ccc;position:relative;display:block;background:#5599e6;margin-bottom:8px}
#carousel h5{color:#555;margin:2px}
#carousel .container{position:absolute;left:24px;width:960px;height:125px;overflow:hidden}
#carousel .thumb{float:left;margin-right:5px;}
#carousel #previous_button{position:absolute;width:24px;height:125px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKFll0UizQzzi6aX89vhJsy-mSq-8Q3VDPvPyeD4UQB0FR8OuRCD3pL6am0tRNMCXS4sqHtlhEom1Q07kzDjEMm3-KQG2q_wvjD3nluQCEI7GHpUrwyAbN1CTxyxZgM7a-zuRwbTbhIyE/s1600/previous.png) center;z-index:100;cursor:pointer;}
#carousel #next_button{position:absolute;right:0;width:24px;height:125px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9jHfMWfnrvQd1PUHJmHlkf87lQirSDNumoNDdxGdvN5AlYmiNIWAttW1MM-JuiqevsHsPuZMVSjT0ultTwhM1Qg5zApx8d_wFkkD5BRMw7x5-SJ8-b0vUCRWZffmNi-Tzbx0t6gMoQDE/s1600/next.png) center;z-index:100;cursor:pointer;}
#carousel #next_button:hover,#carousel .thumb:hover,#carousel #previous_button:hover{filter:alpha(opacity=70);opacity:.7}
#carousel ul{width:100000px;position:relative;margin-top:10px}
#carousel ul li{background:#ebebeb;display:inline;float:left;text-align:left;font:bold 11px Arial;border:0px solid #ccc;width:212px;height:90px;margin:0 2px 20px 6px;padding:6px}
#carousel ul li a.slider_title{color:#222;display:block;margin-top:0;padding-top:0}
#carousel ul li a.slider_title:hover{color:#1b5d97}
#carousel a img{display:block;background:#fff;margin-top:0}
6. Lihat kode yang berwarna merah diatas, itu adalah lebar dari template, sesuaikan dengan lebar template yang anda pakai.
7. Kemudian cari kode script dibawah ini dengan CTRL+F
</head>
8. Letakkan kode dibawah ini tepat diatas kode point 7.

 <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>
<script src='http://kauman.googlecode.com/files/jcarousellite.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLqOXVve0pgiUtwrgNzPF3I2KdTo_DH_f_ZQVY-_FHuAPhSYSmnufLbQW6Q5X2VjFIYTe-7dTq0NtbfHEDB8I27HJiZD8CjKLfZH9ZcbRE9r35_lX2M70P0tbec0Zptc3jHactMv9oHA/s1600/no+image.jpg";
showRandomImg = true;
aBold = true;
summaryPost = 140;
summaryTitle = 25;
numposts1 = 12;
function removeHtmlTag(strx,chop){
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
s = s.join("");
s = s.substring(0,chop-1);
return s;
}
function showrecentposts(json) {
j = (showRandomImg) ? Math.floor((imgr.length+1)*Math.random()) : 0;
img = new Array();
document.write('<ul>');
for (var i = 0; i < numposts1; i++) {
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var pcm;
var posturl;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}
}
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'replies' && entry.link[k].type == 'text/html') {
pcm = entry.link[k].title.split(" ")[0];
break;
}
}
if ("content" in entry) {
var postcontent = entry.content.$t;}
else
if ("summary" in entry) {
var postcontent = entry.summary.$t;}
else var postcontent = "";
postdate = entry.published.$t;
if(j>imgr.length-1) j=0;
img[i] = imgr[j];
s = postcontent ; a = s.indexOf("<img"); b = s.indexOf("src=\"",a); c = s.indexOf("\"",b+5); d = s.substr(b+5,c-b-5);
if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")) img[i] = d;
//cmtext = (text != 'no') ? '<i><font color="'+acolor+'">('+pcm+' '+text+')</font></i>' : '';
var month = [1,2,3,4,5,6,7,8,9,10,11,12];
var month2 = ["January","February","March","April","May","June","July","August","September","October","November","December"];
var day = postdate.split("-")[2].substring(0,2);
var m = postdate.split("-")[1];
var y = postdate.split("-")[0];
for(var u2=0;u2<month.length;u2++){
if(parseInt(m)==month[u2]) {
m = month2[u2] ; break;
}
}
var daystr = day+ ' ' + m + ' ' + y ;
var trtd = '<li class="car"><div class="thumb"><a href="'+posturl+'"><img width="100" height="90" class="alignnone" src="'+img[i]+'"/></a></div><h5>'+daystr+'</h5><a class="slider_title" href="'+posturl+'">'+posttitle+'</a></li>';
document.write(trtd);
j++;
}
document.write('</ul>');
}
//]]>
</script>
9. Kemudian cari kode script dibawah ini dengan CTRL+F
<div id='main-wrapper'>
10. Letakkan kode dibawah ini

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div id='carousel'>
<div id='previous_button'/>
<div class='container'>
<script>
document.write(&quot;&lt;script src=\&quot;/feeds/posts/default/-/sport?max-results=&quot;+numposts1+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts\&quot;&gt;&lt;\/script&gt;&quot;);
</script>
<div class='clear'/>
</div>
<div id='next_button'/>
</div>
<script type='text/javascript'>
(function($) {     $(document).ready(function(){
$(&quot;#carousel .container&quot;).jCarouselLite({
    auto:4000,
    scroll: 1,
    speed: 800,
    visible: 5,
    start: 0,
    circular: true,
    btnPrev: &quot;#previous_button&quot;,
    btnNext: &quot;#next_button&quot;
    });
    })})(jQuery)
</script>
</b:if>
11. Save/Simpan template.

Read more »

---
Labels: Tutorial Blog

Cara Membuat Label Berputar di Blogger

Posted by at 10:20 AM { 2 comments }
Cara Membuat Label Berputar di Blogger
Kali ini saya akan share Cara Membuat Label Berputar di Blogger.
Silakan ikuti Tutorial Membuat Label Berputar di Blogger dibawah ini:
1. Buka Dashboard blogger anda.
2. Buka Template/Rancang design
3. Klik edit html dan centang expand template widget
4. Cari kode dibawah ini:
<b:section-contents id='sidebar-right-1'>
atau
<b:section class='sidebar' id='sidebar' preferred='yes'>
5.Jika telah ketemu copas kode script dibawah ini tepat dibawah kode diatas.
<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://sites.google.com/site/bloggerustemplatus/code/swfobject.js' type='text/javascript'/>
<div id='flashcontent'>Blogumulus by <a href='http://www.roytanck.com/'>Roy Tanck</a> and <a href='http://www.bloggerbuster.com'>Amanda Fazani</a></div>
<script type='text/javascript'>
var so = new SWFObject("http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf", "tagcloud", "300", "200", "7", "#ffffff");
// uncomment next line to enable transparency
//so.addParam("wmode", "transparent");
so.addVariable("tcolor", "0x333333");
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>
6. Untuk angka yang berwarna biru adalah lebar widget, bisa anda rubah sesuka hati anda.
7. Untuk angka yang berwarna merah adalah tinggi widget, bisa anda rubah sesuka hati anda.
8. Klik save/simpan template.

Read more »

---
Labels: Tutorial Blog

Tips Membuat Popular Post Berbentuk Kotak-Grid

Posted by at 8:37 PM { 6 comments }
Tips Membuat Popular Post Berbentuk Kotak-Grid.
Kali ini saya akan bagikan Tutorial Tips Membuat Popular Post Berbentuk Kotak-Grid pada blog berplatform blogspot. Contohnya bisa dilihat di gambar dibawah ini.
Tips Membuat Popular Post Berbentuk Kotak-Grid
Cara membuat Popular Post Berbentuk Kotak-Grid :
1. Buka dashbord blogger.
2. Buka Tata Letak
3. Tambahkan widget Popular Post/Entri Popular
4. Jangan lupa hilangkan tanda centang cuplikan dan simpan
5. Buka template dan jangan dicentang untuk expand widget
6. Cari kode dibawah ini (cara cepat klik CTRL+F)
]]></b:skin>
7. Tambahkan kode dibawah ini diatas kode point 6
.popular-posts .item-thumbnail{float:left;}
.popular-posts ul{padding-left:0px;}
.popular-posts ul li {list-style-image: none;list-style-type: none;display:inline;}
8. Kemudian cari script PopularPosts1 dengan CTRL+F dan nanti ketemu script dibawah ini
<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'/>
9. Ganti kode script diatas dengan kode dibawah ini

<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'>
<b:includable id='main'>
  <b:if cond='data:title'><h2><data:title/></h2></b:if>
  <div class='widget-content popular-posts'>
    <ul>
      <b:loop values='data:posts' var='post'>
      <li>
        <b:if cond='data:showThumbnails == "false"'>
          <b:if cond='data:showSnippets == "false"'>
            <!-- (1) No snippet/thumbnail -->
            <a expr:href='data:post.href'><data:post.title/></a>
          <b:else/>
            <!-- (2) Show only snippets -->
            <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
            <div class='item-snippet'><data:post.snippet/></div>
          </b:if>
        <b:else/>
          <b:if cond='data:showSnippets == "false"'>
            <!-- (3) Show only thumbnails -->
            <div class='item-thumbnail-only'>
         
                <div class='item-thumbnail'>
   <a expr:href='data:post.href' expr:title='data:post.title'>
    <b:if cond='data:post.thumbnail'>
                    <img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
       <b:else/>
      <img alt='' border='0' expr:height='data:thumbnailSize' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbXQmzHYbaWYX9hTUnvbmwA99Z8Q6-k7b_vwBulC5CGo703nUpTInY_exho4gv8mLuaLW0vo1bLOz9g_opD9CH009ucbt3Pgn9jmY9dy_ZnZVNW8Pg278UaWWdBjcAY3n_bZ-FV2s9xg/s72-c/default.png' expr:width='data:thumbnailSize'/>
       </b:if>
                  </a>
                </div>    
             </div>
            <b:else/>
            <!-- (4) Show snippets and thumbnails -->
            <div class='item-content'>
              <b:if cond='data:post.thumbnail'>
                <div class='item-thumbnail'>
                  <a expr:href='data:post.href' target='_blank'>
                    <img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
                  </a>
                </div>
              </b:if>
              <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
              <div class='item-snippet'><data:post.snippet/></div>
            </div>
            <div style='clear: both;'/>
          </b:if>
        </b:if>
      </li>
      </b:loop>
    </ul>
    <b:include name='quickedit'/>
  </div>
</b:includable>
</b:widget>
10. Simpan/save template.

Read more »

---
Labels: Tutorial Blog

Tutorial membuat Blog SEO Friendly

Posted by at 6:44 PM { 4 comments }
Tutorial membuat Blog SEO Friendly.
Membuat blog di blogspot, wordpress atau di platform lainnya memang salah satu tujuannya adalah saling membagikan informasi, tetapi sebagian besar blogger ingin blog mereka berada di urutan pertama di halaman pertama pada google searching. 
SEO Friendly bisa anda lihat penjelasannya di artikel kami di Definisi SEO Friendly
Untuk mencapai hal itu maka diperlukan berbagai hal yang menunjang.
Hal-hal tersebut adalah:
1. Template blog SEO Friendly
2. SEO On Page yang benar.
3. SEO Off Page atau backlink yang berkualitas.
4. Konten atau postingan yang terbaru/update.
5. Sistem atau cara penulisan postingan.
6. Kecepatan loading blog.
7. Rajin update postingan atau artikel.
Ketujuh kriteria diatas merupakan pengalaman saya di blog saya yang satunya di SAMEHADAKU.NET

Read more »

---
Labels: SEO Friendly

Definisi SEO Friendly

Posted by at 10:26 PM { No comments }
Definisi SEO Friendly
SEO adalah singkatan dari Search Engine Optimation. Yang bisa diartikan dengan proses pengoptimalan sebuah site atau blog dalam search engine agar site/blog tersebut bisa berada dalam urutan atau posisi teratas di search engine.
Search Engine Optimation (SEO) dibagi menjadi dua yaitu:
1. SEO On Page
2. SEO Off Page
SEO On Page adalah proses pengoptimalan sebuah blog/site yang dilakukan didalam blog itu sendiri tanpa melibatkan site/blog lain. SEO On Page contohnya : pembuatan meta tag, keyword, link internal, penulisan judul, dan lain-lain.
SEO Off Page adalah proses pengotimalan blog/site yang dilakukan dengan melibatkan blog/site lain dan ini bisa dikatakan dengan nama " BACKLINK ".
Begitulah Definisi atau pengertian dari SEO Friendly.

Read more »

---
Labels: SEO Friendly

Cara membuat Related Post di Blogger

Posted by at 11:23 AM { 5 comments }
Cara membuat Related Post di Blogger
Related Post adalah sebuah widget yang biasanya terdapat dibawah postingan dan mempunyai hubungan terkait antara satu postingan dengan postingan yang lainnya berdasarkan label atau kategori.
Related Post sangat berguna dikarenakan bisa meningkatkan pageviews suatu blog dan pengunjung bisa betah di blog anda.
Cara membuat Related Post di Blogger, tips blog, tutorial blogspot
Tutorial Cara membuat Related Post di Blogger:
1. Buka dashboard blogger.
2. Buka Template
3. Klik dulu "Expand Template Widget"
4. Cari kode </head> , agar mudah mencari gunakan CTRL+F
5. Masukkan kode script dibawah ini diatas </head>
<style> #related-posts { float : left; width : 540px; margin-top:20px; margin-left : 5px; margin-bottom:20px; font : 11px Verdana; margin-bottom:10px; } #related-posts .widget { list-style-type : none; margin : 5px 0 5px 0; padding : 0; } #related-posts .widget h2, #related-posts h2 { font-size : 20px; font-weight : normal; margin : 5px 7px 0; padding : 0 0 5px; } #related-posts a { text-decoration : none; } #related-posts a:hover { text-decoration : none; } #related-posts ul { border : medium none; margin : 10px; padding : 0; } #related-posts ul li { display : block; background : url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEij9zfI1uJXFEme0BkzxOfZJr-gcG_JQCdIOn6KKIYjhlucKXcO3AJXw-BoDcNYAetSpiYmO7ITshy5qbKnln-xirzKFLiApXskGSyNPBHrhJNosOi5AYjdBs3GC49LXKR4JeUAOBF92Q/") no-repeat 0 0; margin : 0; padding-top : 0; padding-right : 0; padding-bottom : 1px; padding-left : 21px; margin-bottom : 5px; line-height : 2em; border-bottom:1px dotted #cccccc; } </style> <script src='http://yudatfort.googlecode.com/files/related%20posts%20b-digg.js' type='text/javascript'/>
6. Letakkan kode script dibawah ini tepat dibawah <data:post.body/> atau <div class='post-body>

<b:if cond='data:blog.pageType == "item"'>
<div id="related-posts">
<font face='Arial' size='3'><b>Related Posts : </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if><b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=5&quot;' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div></b:if>
7. Simpan/save.

Read more »

---
Labels: Tutorial Blog
Subscribe to: Posts (Atom)

Search Form

Powered by Blogger