Showing posts with label blooger. Show all posts
Showing posts with label blooger. Show all posts

Thursday, March 16, 2017

Cara Membuat Widget Sosial Share Melayang Di Sebelah Kiri Blooger

Cara Membuat Widget Sosial Share Melayang Di Sebelah Kiri Blooger


Ini Adalah Totorial Cara Membuat Widget Sosial Share Melayang Di Sebelah Kiri Blooger Dengan Mudah Dan Gampang . Jika Sobat Penasaran Seperti Apa Bisa Lihat Gambar nyaDi Bawah ini .


Sedikit Penjelasan Untuk Apa Tombol Share Itu Sebenar nya, Tombol Share Sanga Lah Penting Utuk Para Pupbliser Blooger , Kenapa Penting nya tombol share itu Karena Dengan Tombol Share itu kita bisa Share posting kita di banyak sosial media terutama Facebook Dan Tweeter Dengan Men Share kan Posting kita di sosial media kita Akan Banyak Mendapat Trafick Pengunjung Dari Sana , Itulah Sebab nya tombol share sosial itu penting . Ok Langsung Saja Cara nya gimana Sobat Bisa Lihat Di Bawah .


Langkah-Langkah Membuat Tombol Share Melayang Di Blooger

1-Loging Blooger
2-Pilih Tata Letak
3-Tambah Gadget
4-Pilih HTML/Javascript
5-Judul Kosong kan Pada Box KontenMasukan Kode Script Di Bawah ini  Dan Langkah Terakhir Save Dan Lihat Hasil nya.

<style>
#seocipssharebtn {position:fixed; bottom:20%; left:10px; float:left; background-color:#fff;padding:0 0 2px
0;z-index:10;box-shadow:0 2px 2px #666;-webkit-box-shadow:0 2px 2px #666;border-radius:4px;-webkit-border-radius:4px;border: 1px solid #ddd;moz-animation:bawah 7s;-webkit-animation:bawah 7s;animation:bawah 7s;}
#seocipssharebtn .sbutton {float:left;clear:both;margin:5px 5px 0 5px;}
.fb_share_count_top {width:48px !important;}
.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}
@media screen and (max-width:480px){#seocipssharebtn{display:none;}}
@-webkit-keyframes bawah{
from{transform:translate(0px, 2000px)}
to{transform:translate(0px,0px)}
}
@keyframes bawah{
from{transform:translate(0px, 2000px)}
to{transform:translate(0px,0px)}
}
</style>
<div id=seocipssharebtn title="Share This With Your Friends">
<div class=sbutton id=gb><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like layout="box_count" show_faces="false" font=""></fb:like></div>
<div class=sbutton id=gplusone><script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script><g:plusone size="tall"></g:plusone></div>
<div class=sbutton id=su><script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script></div>
<script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>
</div>

Trimakasih Sudah Di Blog Saya Rantau021 ini , Semuga Apa yang Saya Bagikan Di blog Sederhan Dan Gratis ini Bisa Bermanfaat Bagi Kita Dan Banyak Orang , Mohon Maaf Jika Ada Kesalahan Yang Di Sengaja Ataupun Tidak Semuga Berhasil Salam Rantau021 Download Gratis .


Englis Version


It is Totorial How to Make Social Widget Share Float On Left Blogger With Easy And Easy .
Slightly Explanation For What Button Share It Right as his , Button Share Sanga Lah Important Utuk The Pupbliser Blogger , Why Important him a share button that Due to the Share Button that we can Share our post on many social media , especially Facebook and Tweeter With Men Share the post we in social media we ll Many trafick visitor Got From There , it is because of its important social share buttons . Ok its Direct Only way how Buddy Can See Below .


Steps to Make Button Share Float On Blogger

1 - loging Blogger
2 - Select Layout
3 - Add a Gadget
4 - Select HTML / Javascript
5 - Title Empty the In Box KontenMasukan Script Under this Code and Last Step Save and View Results her .
<style>
#seocipssharebtn {position:fixed; bottom:20%; left:10px; float:left; background-color:#fff;padding:0 0 2px
0;z-index:10;box-shadow:0 2px 2px #666;-webkit-box-shadow:0 2px 2px #666;border-radius:4px;-webkit-border-radius:4px;border: 1px solid #ddd;moz-animation:bawah 7s;-webkit-animation:bawah 7s;animation:bawah 7s;}
#seocipssharebtn .sbutton {float:left;clear:both;margin:5px 5px 0 5px;}
.fb_share_count_top {width:48px !important;}
.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}
@media screen and (max-width:480px){#seocipssharebtn{display:none;}}
@-webkit-keyframes bawah{
from{transform:translate(0px, 2000px)}
to{transform:translate(0px,0px)}
}
@keyframes bawah{
from{transform:translate(0px, 2000px)}
to{transform:translate(0px,0px)}
}
</style>
<div id=seocipssharebtn title="Share This With Your Friends">
<div class=sbutton id=gb><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like layout="box_count" show_faces="false" font=""></fb:like></div>
<div class=sbutton id=gplusone><script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script><g:plusone size="tall"></g:plusone></div>
<div class=sbutton id=su><script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script></div>
<script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>
</div>
Thank you Already this Blog I Rantau021 , Semuga What I Share In blog sederhan And Free This Be Useful for Us And Many People , Sorry If There Mistakes In Intentionally Or Not Semuga Successfully Salam Rantau021 Free Download .
HTML Blooger
  1. Cara Membuat Menu Navigasi di Blog seperti Evo Magz - New!
  2. Cara Membuat Widget Sosial Share Melayang Di Sebelah Kiri Blooger - New!
  3. Totorial Mengganti Link Newer Post dan Older Post Menjadi Judul Posting Degan Mudah Dan Jelas - New!


    Available link for download

    Read more »

    Saturday, February 25, 2017

    Cara Mengganti Order Post Blooger Menjadi Angka

    Cara Mengganti Order Post Blooger Menjadi Angka


    Ini Adalah Totorial Cara Mengganti Order Post Blooger Menjadi Angka Mudah Dan Cepat .
    Untuk Contoh Hasil nya Anda Bisa Lihat Seperti Gambar Di Bawah Ini .


    Bagaimana Anda Tertarik Untuk Mencuba nya Di Situs ?
    Untuk Totorial nya Anda Bisa Lihat Langkah-Langkah nya Di Bawah Ini .

    Langkah-Langkah:

    1-Masuk Ke Blooger Anda

    2-Pilih Template
    3-Edit HTML
    4-Cari Kode ]]></b:skin> Untuk  Lebih Mudah Mencari Kode nya Bisa Menekan Tombol Contol + F  Dan Masukan Kode ]]></b:skin> Pada Kotak Pencarian Terus Klik Enter .
    Jika Sudah Ketemu Copy Dan Paste Kode Di Bawah ini  Di Atas Kode ]]></b:skin>.
    .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;
    }


    3. setelah itu cari kode ini </body> kemudian taruh script dibawah ini sebelum kode tersebut.
    <!--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://bloggergadgets.googlecode.com/files/blogger_pagenavi_min.js type=text/javascript/>
    </b:if> </b:if>
    <!--Page Navigation Ends -->
    5-Masih Di Dalam HTML Kemudian Cari Kode </body> Jika Sudah Ketemu Copy Dan Paste Kode Di Bawah ini  Di Atas Kode </body> .
    <!--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://bloggergadgets.googlecode.com/files/blogger_pagenavi_min.js type=text/javascript/> 
    </b:if> </b:if> 
    <!--Page Navigation Ends -->
    6-Save Template , Dan Lihat Hasil nya .
    Yaa..! Berikut Di atas Adalah Totorial Cara Mengganti Order Post Blooger Menjadi Angka Semuga Artikel ini Bermanfaat untuk kita semua Dan Apa Bila Terdapat Kesalahan Mohon Di Maafkan Lahir Dan Batin nya , Trimakasih Anda Sudah Ber Kunjung Di Blogs Rantau021 ini Semuga Apa Pun Yang Saya Bagikan Di Situs Ini Bisa Berguna Banyak Orang Trimakasih Salam Rantau021 .

    Englis Version

    How do you interested to try out its On Site ?
    For his Totorial You Could See Her Steps Below this .

    Steps :

    1 - Go To Your Blogger
    2 - Select Template
    3 - Edit HTML
    4 - Find code ] ] > < / b : skin> For Easier for its Code Could Push the Button Contol + F And Enter the code ] ] > < / b : skin> On the Search Box Continues Click Enter.
    .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;
    }


    3. setelah itu cari kode ini </body> kemudian taruh script dibawah ini sebelum kode tersebut.
    <!--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://bloggergadgets.googlecode.com/files/blogger_pagenavi_min.js type=text/javascript/>
    </b:if> </b:if>
    <!--Page Navigation Ends -->
    5 - Still In The Later s HTML code < / body> If Already Meet Copy And Paste The Code Below Above Code < / body>
    <!--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://bloggergadgets.googlecode.com/files/blogger_pagenavi_min.js type=text/javascript/> 
    </b:if> </b:if> 
    <!--Page Navigation Ends -->
    6-Save Template , And See his results .
    Yaa .. ! Here above is Totorial How to Change Order Post Blogger Being Figures Hopefully, this article is useful to us all And What If There Error Please Di Forgive Born Dan Batin her , Thank you for visiting the Blogs Rantau021 hopefully Anything That I Share This site Can Be Useful Many People Thank regards Rantau021
    HTML Blooger
    1. Cara Membuat Menu Navigasi di Blog seperti Evo Magz - New!
    2. Cara Membuat Widget Sosial Share Melayang Di Sebelah Kiri Blooger - New!
    3. Totorial Mengganti Link Newer Post dan Older Post Menjadi Judul Posting Degan Mudah Dan Jelas - New!

    Available link for download

    Read more »