cara pasang share button di blog

Dibawah ini ada 3 script untuk membuat tombol/button share artikel berikut preview gambarnya :

1.       Kode script button share style-1:

<!-- AddThis Button BEGIN -->

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<div class="addthis_toolbox addthis_default_style ">

<a class="addthis_button_preferred_1"></a>

<a class="addthis_button_preferred_2"></a>

<a class="addthis_button_preferred_3"></a>

<a class="addthis_button_preferred_4"></a>

<a class="addthis_button_compact"></a>

<a class="addthis_counter addthis_bubble_style"></a>

</div></b:if>

<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4e71feed783c3890"></script>

<!-- AddThis Button END -->

2.       Kode script button share style-2:

<!-- AddThis Button BEGIN -->

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<div class="addthis_toolbox addthis_default_style addthis_32x32_style">

<a class="addthis_button_preferred_1"></a>

<a class="addthis_button_preferred_2"></a>

<a class="addthis_button_preferred_3"></a>

<a class="addthis_button_preferred_4"></a>

<a class="addthis_button_compact"></a>

<a class="addthis_counter addthis_bubble_style"></a>

</div></b:if>

<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4e71ff8750bee738"></script>

<!-- AddThis Button END -->

3.       Kode script button share style-3:

<!-- AddThis Button BEGIN -->

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<div class="addthis_toolbox addthis_default_style ">

<a class="addthis_button_facebook_like" fb:like:layout="button_count"></a>

<a class="addthis_button_tweet"></a>

<a class="addthis_button_google_plusone" g:plusone:size="medium"></a>

<a class="addthis_counter addthis_pill_style"></a>

</div></b:if>

<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4e71fdea5bff8d67"></script>

<!-- AddThis Button END -->

Nah dari 3 style button share social bookmark yang ada diatas, tinggal sobat pilih aja mau menggunakan yang mana. Adapun cara pemasangannya pada template, ikuti langkah-langkah dibawah ini :

1.       Login ke dashboard blogger anda.

2.       Pilih Rancangan > Edit HTML, centang Expand widget template.

3.       Cari kode <data:post.body/>  atau kode <div class='post-header-line-1'/>  pada template anda ( salah satunya saja ! ) dan letakkan script button sharenya diatas kode tadi.

4.       Save template dan lihat hasilnya.

cara memasang widget alexa di blog

Setelah kurang lebih 1 bulan tidak update di Blog ini. Pada postingan kali ini saya akan sharing mengenai Cara Memasang Widget Alexa dan Memverifikasinya.

cara membuat submenu di blog

    Ikuti langkah-langkah berikut ini untuk membuat menu navigasi slide horizontal blogspot :

    1. Login ke Blogger, masuk ke bagian design, lalu edit html dan berikan tanda centang pada expand widget template

    2. Cari kode <div id='content-wrapper'> dan tambahkan kode berikut ini diatasnya. Jika anda tidak menukan kode ini, usahakan anda taruh kode berikut ini diatas blogpost anda. Ini karena template tiap blog berbeda, dan tergantung template yang dipakai.

    <div id='Menumainwrapx'>
    <b:section id='NavbarMenux'>
    <b:widget id='HTML50' locked='false' title='MembuatMenu' type='HTML'>
    <b:includable id='main'>
    <!-- only display title if it's non-empty -->
    <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'></h2>
    </b:if>
    <div class='widget-content'>
    <data:content/>
    </div>
    </b:includable>
    </b:widget>
    </b:section>
    </div> <!-- End Menumainwrapx -->
    <div class='clear'/>


     3. Lalu tambahkan juga kode berikut di atas kode ]]></b:skin>

    #Menumainwrapx {
    background:url(http://farm2.static.flickr.com/1046/5118494385_6bed6df208_t.jpg) repeat-x scroll 0 0 #222222;
    border-bottom:1px solid #CCCCCC;
    height:42px;
    margin:0;
    padding:0;
    }
    #NavbarMenux {
    width: 950px;
    height: 41px;
    font-size: 13px;
    color:#333333;
    margin: 0px;
    padding: 0;
    font-weight:bold;
    font-family:arial;
    margin: 0 auto;
    }
    #NavbarMenuleftx {
    width: 950px;
    margin: 0;float:left;}
    #navx { margin: 0;
    padding: 0; }
    #navx ul {
    float: left;
    list-style: none;
    margin: 0;
    padding: 0; }
    #navx li {
    list-style: none;
    margin: 0px;
    padding: 0; }
    #navx li a,
    #navx li a:link,
    #navx li a:visited {
    height: 22px;
    color: #333333;
    display: block;
    font-size: 13px;
    text-decoration: none;
    margin: 0;
    padding:10px 13px 9px 13px;
    border-right: 1px solid #CFCFCF; }
    #navx li a:hover,
    #navx li a:active {
    color: #333;
    margin: 0;
    text-decoration: none;
    background:#F0F0F0;
    }
    #navx li li a, #nav li li a:link,
    #navx li li a:visited {
    background:url(http://farm2.static.flickr.com/1190/5119105082_e113afd892_t.jpg) repeat-x scroll 0 0 #f5f5f5;
    min-width: 150px;
    color: #333333;
    font-size: 14px;
    font-weight: normal;
    float: none; margin: 0;
    padding: 5px 10px;
    font-weight:bold;
    font-family:arial;
    box-shadow: 0px 3px 3px rgba(0,0,0,0.8);
    -moz-box-shadow: 0px 3px 3px rgba(0,0,0,0.8);
    -webkit-box-shadow: 0px 3px 3px rgba(0,0,0,0.8);
    text-align:left;}
    #navx li li a:hover,
    #navx li li a:active {
    background: #F5F5F5;
    color: #333;
    }
    #navx li {
    float: left;
    padding: 0; }
    #navx li ul {
    z-index: 9999;
    position: absolute;
    left: -999em;
    height: auto;
    width: 170px;
    margin:0;
    padding: 0;
    border-top:1px solid #242424;
    }
    #navx li ul a {
    width: 140px; }
    #navx li ul ul {
    margin: -41.5px 0 0 176px;
    border:none;}
    #navx li:hover ul ul,
    #navx li:hover ul ul ul, #navx li.sfhover ul ul,
    #navx li.sfhover ul ul ul {
    left: -999em; }
    #navx li:hover ul,
    #navx li li:hover ul,
    #navx li li li:hover ul,
    #navx li.sfhover ul,
    #navx li li.sfhover ul,
    #navx li li li.sfhover ul {
    left: auto; }
    #navx li:hover,
    #navx li.sfhover {
    position: static; }

Simpan template anda dahulu.


    4. Buka page element cari gadget dengan nama ‘MembuatMenu’ yang berada di atas
        gadget posting blog, lalu klik edit dan masukkan kode berikut pada kotak content.

    <div id='navbarmenuleftx'>
    <ul id='navx'>

    <li><a href='/'>Home</a></li>
    <li><a href='#yourlink'>Menu 1</a>
    <ul>
    <li><a href='#yourlink'>Menu 1.1</a>
    <ul>
    <li><a href='#yourlink'>Menu 1.1.1</a></li>
    <li><a href='#yourlink'>Menu 1.1.2</a></li>
    <li><a href='#yourlink'>Menu 1.1.3</a></li>
    <li><a href='#yourlink'>Menu 1.1.4</a></li>
    </ul>
    </li>

    <li><a href='#yourlink'>Menu 1.2</a>
    <ul>
    <li><a href='#yourlink'>Menu 1.2.1</a></li>
    <li><a href='#yourlink'>Menu 1.2.2</a></li>
    <li><a href='#yourlink'>Menu 1.2.3</a></li>
    <li><a href='#yourlink'>Menu 1.2.4</a></li>
    </ul>
    </li>

    <li><a href='#yourlink'>Menu 1.3</a>
    <ul>
    <li><a href='#yourlink'>Menu 1.3.1</a></li>
    <li><a href='#yourlink'>Menu 1.3.2</a></li>
    <li><a href='#yourlink'>Menu 1.3.3</a></li>
    <li><a href='#yourlink'>Menu 1.3.4</a></li>
    </ul>
    </li>
    </ul>
    </li>

    </ul>  
    </div>

   Sesuaikan dengan link dan menu yang akan anda buat dengan mengedit tulisan yang berwarna merah diatas. Misal
   #yourlink, bisa anda ganti dengan http://namablogmu.blogspot.com/search/label/NamaLabelBlogmu
Menu, anda ganti dengan judul tampilan yang muncul

    Simpan dan anda lihat hasilnya. Anda sekarang berhasil membuat menu navigasi slide horizontal blogspot. Selamat

cara mendaftarkan blog ke google

Cara Menghilangkan Tanda Obeng dan Tang di Blog

1. login ke akun blogger kamu

2. masuk ke rancangan--> edit html --> centang kolom expand widget template

3. cari kode ini

]]></b:skin>

4. copy dan paste kode dibawah ini tepat diatas kode nomer 3 tersebut

.quickedit{
display:none;
}

 

5. Klik tombol Simpan Template dan lihat hasilnya .

6. Selesai.

tutorial membuat blog