Test Footer 1

Test Footer

Health

Test midle sidebar

Test Footer 2

.....:::::Di blog oketrik banyak trik yang sangat menarik dan gampang untuk di pelajari, apabila ada kesulitan tanyakan saja pada oketrik . Terima kasih::::....

Minggu, 28 Juli 2013

Cara Membuat Kolom Komentar Facebook di Blog

1 komentar


Cara Membuat Kolom Komentar Facebook di Blog yang saya tulis ini adalah sekian cara yang telah ada dan dibahas oleh teman-teman blogger tanah air dan mungkin cara yang saya buat ini adalah cara termudah dalam membuat kolom komentar facebook di blog. Kenapa saya bilang mudah? Karena hanya sedikit kode-kode yang perlu ditambahkan kedalam halaman pengeditan template blog anda. Cara membuat kolom komentar Facebook di blog ini telah saya terapkan kedalam blog saya sendiri tapi bukan di blog ini karena sudah banyak kode-kode yang telah saya pasang untuk blog ini.

Cara Membuat Kolom Komentar Facebook di Blog

Sebelum melanjutkan pembahasan mengenai cara membuat kolom komentar Facebook di blog ini, sedikit perlu saya jelaskan manfaat adanya kolom komentar Facebook di blog yaitu akan meningkatkan jumlah pengunjung blog anda melalui Facebook. Kok bisa? Karena setiap anda berkomentar maka komentar anda akan tampil di halaman beranda (biasanya ada di sidebar sebelah kanan Facebook) facebookers yang lain dan jika facebookers tersebut membaca update-an komentar anda dan mengkilk tautan komentar tersebut maka secara langsung facebookers tersebut akan diarahkan ke blog anda. Tapi ingat! kolom komentar Facebook di blog ini akan berfungsi maksimal jika yang berkomentar sedang dalam keadaan aktif dengan akun facebooknya atau tidak mencentang Post to Facebook yang ada didalam kolom komentar.

Okey, dan berikut cara membuat kolom komentar Facebook di blog
  1. Buatlah sebuah aplikasi yang akan mengintegrasikan blog anda dengan Facebook. Untuk membuatnya, silahkan baca Cara membuat aplikasi Facebook
  2. Jika sudah selesai membuat aplikasi facebooknya, buka akun blogger anda
  3. Pilih menu Template >> Edit Html >> centang Expand Template Widget >> tekan tombol Ctrl+F di keyboard
  4. Cari kode <b:skin><![CDATA[ dan tambahkan kode berikut sebelum atau diatas <b:skin><![CDATA[
    <meta content='profil.sriwahyuni' property='fb:admins'/>
    <meta content='259054834227698' property='fb:app_id'/>
    <script src='http://code.jquery.com/jquery-latest.js'/>
    <script src='http://panduan-template-blog-id.googlecode.com/files/CommentPages.js'/>
    <script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
    Cara Membuat Kolom Komentar Facebook di Blog
      Keterangan
    • Ganti profil.sriwahyuni dengan nama akun Facebook anda
    • Ganti 259054834227698 dengan ID Aplikasi Facebook anda yang telah anda buat
  5. Cari kode <div class='post-footer-line post-footer-line-3'/> dan tambahkan kode berikut tepat dibawah <div class='post-footer-line post-footer-line-3'/>
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <div class='fb-comments' data-num-posts='10' data-width='550' expr:data-href='data:post.url'/>
    </b:if>
    Cara Membuat Kolom Komentar Facebook di Blog
      Keterangan
    • data-num-posts='10' merupakan jumlah komentar yang tampil. Silahkan anda ganti jika ingin menampilkannya lebih banyak
    • data-width='550' merupakan lebar kolom komentar. Silahkan diganti dengan menyesuaikan lebar area postingan blog. Bukan lebar blog
  6. Selesai dan simpan Template blog anda. Lihat hasilnya di bagian bawah artikel atau diatas kolom komentar Blogspot
Itulah cara termudah dalam menampilkan atau membuat kolom komentar Facebook di blog. Jika ada yang pertanyaan, mari kita diskusikan bersama dengan meninggalkan komentar untuk artikel ini, Cara Membuat Kolom Komentar Facebook di Blog
Read More

Kamis, 20 Juni 2013

Cara Membuat Share Button Melayang di Blog

5 komentar

Cara Membuat Share Button Melayang


  • Share button dari AddThis, favorit gw gan. Cara pasangnya loe masuk ke Blogger trus klik Layout dan add gadget, scroll ke bawah pilih HTML/JavaScript. Setelah muncul pop up copy kode dibawah gan lalu pastein disana dan save. Beres gan sekarang blog loe udah ada share button melayangnya. Tinggal loe atur aja posisinya sesuai selera gan. Caranya edit aja angka yang ada distyle="left:50px;top:50px;">

 Kode buat yang kayak gambar disebelah gan.



    Kode buat yang kayak gambar disebelah gan.


    
    

    Kalo kalian pengen model yang lain dan nambah tombol biar banyak cek langsung di AddThis.






      • Yang ini share button melayang dari ShareThis gan. Langsung aja di copas kodenya di bawah ini gan, langkahnya sama kayak di atas.
                 
                 

        Kalo yang ini loe juga harus nambahin kode lain gan. Copy kode diwah, terus loe masuk ke Template lalu Edit HTML gan. Cari <head/> terus loe pastein kode tadi di atasnya. Sebelum ngesave preview dulu gan. Kalo mau nambah tombolnya lansung aja meluncur ke ShareThis gan.






        • Yang terakhir gan share button melayang dari Lockerz Share, yang satu ini keren gan simple tapi mantap cuma sayang bentuknya horisontal gan. Oke langsung aja copy kodenya trus paste di gadget / widget blog loe gan and save.


        Tampilan gambar di sebelah setelah share buttonya di klik gan, jadi tampilan standarnya cuma bar yang di atas doank. Mau model lain cek aja di Lockerz Share gan.










        Note : Jangan takut copy kodenya gan, coz semua kode gak gw tambahin link dari blog SEO Ciyus kok aman.

        Sekian tips dari gw semoga bermanfaat buat kalian yang pengen pasang share button melayang di blog.  Silahkan berkomentar gratis gan...
        Read More

        Senin, 17 Juni 2013

        Cara Memasang Tombol Share dan Like di Bawah Postingan Blogspot

        0 komentar
        Kali ini blitari.blogspot.com akan sharing tentang bagaimana cara memasang tombol share dan like ke facebook pada postingan blog,
        Memasang Tombol Share
        Tombol share berguna untuk memudahkan pengunjung blog yang ingin membagikan artikel yang telah dibacanya ke jaringan mereka, seperti Facebook Like, Twitter Tweet, Google +1, dan lain-lain.

        Berikut Cara Memasang Tombol Share Dibawah Postingan :
        1. Login ke Blogger, Klik Design/Rancangan > Edit HTML.
          Memasang Tombol Share
        2. Beri tanda centang pada Expand Template Widget.
          Memasang Tombol Share
          Tips : Biasakan mendownload template untuk membackup template sebelum di edit.
        3. Cari kode <data:post.body/>, Tekan Ctrl + F pada keyboard untuk menggunakan fasilitas pencarian browser, lalu ketikkan kode yang dicari, pilih kode <data:post.body/> yang nomor dua.
        4. Jika sudah ketemu Copy script di bawah ini dan paste di dibawah kode <data:post.body/> yang ke dua. (kalau masih nggak jadi, pilih yang partama)
          <!-- AddThis Button BEGIN -->
          <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>
          <script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4e8062ca66617053"></script>
          <!-- AddThis Button END -->
        5. Terakhir klik SIMPAN / SAVE TEMPLATE.
          Memasang Tombol Share
        Sekian Tutorial tentang Memasang Tombol Share Dibawah Postingan.
        Semoga artikel saya ini dapat bermanfaat..Komentnya jangan lupa kawan..
        Trimakasih..
        Title : Cara Memasang Tombol Share dan Like di Bawah Postingan Blogspot
        Description : Kali ini blitari.blogspot.com akan sharing tentang bagaimana cara memasang tombol share dan like k...


        Read More

        Sabtu, 08 Juni 2013

        Script SEO Smart Link

        3 komentar

        Bagaimana cara kerja script Smart Link Itu?

             Oke pada pembahasan sebelumnya saya sudah berbagi tips seputar cara meningkatkan pageview dengan fakepageview dan cara meringankan berat blog dan pada kesempatan kali ini sekaligus tanda berliburnya dari online pc kesayanganku, karena sesuatu pekerjaan yang harus menyebrangi pulau jawa sampai ke pulau sumatera, mungkin dalam beberapa minggu saya selaku admin blog ini tidak bakalan bisa update artikel, mungkin saya akan berselancar dan berkunjung ke blog-blog sobat hanya bisa menggunakan hp kesayanganku saja, sebagai tanda terima kasih saya buat rekan-rekan blogger semua jika tidak ada kalian saya pun tidak ada. oke pada artikel ini saya akan mengungkap sebuah script super seo, kenapa disebut script seo smart link? Smart dalam artian pintar dan cerdas jadi js smart-link adalah sebuah link pintar dalam keseluruhan blog.

                Bagaimana cara kerja script seo smart link, ya script ini bekerja secara otomatis pada blog, inilah rahasia saya, rahasia pada blog saya. menurut saya pribadi script ini berada pada posisi pertama dari segala macam script seo onpage, kenapa bisa begitu? ya karena dari awal pertama bikin artikel hingga artikel ini diterbikan script ini memberikan dampak yang positif pada blog ini, script seo blogspot ini akan membaca setiap kata pada postingan kita, misalnya jika kita menentukan keyword 'SEO', maka setiap kata dari 'SEO' dipostingan kita akan menjadi sebuah link, atau kita menentukan keyword 'BLOG' maka setiap kata dari 'BLOG' pada postingan kita akan menjadi sebuah link otomatis, sudah mengerti belum maksudnya? biar lebih jelasnya silahkan perhatikan dari keseluruhan artikel pada blog saya ini jika anda menemukan kata 'SEO' dan 'BLOG' maka kata tersebut akan menjadi sebuah link aktif, kata 'BLOG' saya arahkan menuju Homepage blog ini dan kata 'SEO' saya arahkan menuju sitemap/daftar isi blog ini.         

                 Bagaimana anda mau menentukan sebuah kata untuk blog anda dalam menggunakan script smart link ini, anda boleh menggunakan kata 'SAYA' misalnya untuk menentukannya, anda lihat dulu dari awal pembuatan artikel hingga akhir kata apa yang anda sering gunakan karena kata tersebut bisa anda jadikan sebuah link aktif nantinya. jika anda mau mengkuti jejak saya, coba anda perhatikan pada rich snippet di blog, tau kan rich snipet? itu tuh yang pada akhir setiap postingan selalu menampilkan poto saya dan keterangannya, nah anda perhatikan disana dengan kata 'BLOG' yang bertanda agak merah jika diklik maka akan terbuka sebuah link, nah karena saya memasangnya pada rich snipet jadi secara otomatis jikapun kita lupa membuat sebuah link dalam setiap artikel yang diarahkan ke homepage maka kata 'BLOG' tersebut sudah menjadi penggantinya, anda bisa perhatikan sendiri dari artikel ini saja kata 'SEO' dan 'BLOG' sudah kebanyakan, jika terlalu banyak ini sebenarnya kurang bagus, tapi gapalah ini sekaligus oleh-oleh buat teman-teman semua dalam mengungkap tabir rahasia pada blog kesayangan ketiga saya ini.

                Oke tanpa panjang lebar lagi saya akan bagikan scriptnya, dan cara pemasangannya pun super gampang banget,. silahkan copy paste script smart link dibawah ini:


        <b:if cond='data:blog.url != data:blog.homepageUrl'>
        <script type='text/javascript'>
        function autoLink(){
            this.keywdHref = new Object();
            this.add = function(keyword, href){
                if(keyword.substr(0,1) != &quot; &quot;){keyword = &quot; &quot; + keyword;}
                this.keywdHref[keyword] =  href;
            }
            this.createAnchor = function(){
                var objs = document.getElementsByTagName(&quot;div&quot;);
                for(var i=0; i&lt;objs.length; i++){
                    var obj = objs[i];
                    if(obj.className.indexOf(&quot;post-body&quot;)&gt;-1){
                        var content = obj.innerHTML;
                        for(var keyword in this.keywdHref){
                            var href = this.keywdHref[keyword];
                            var newstr = content.replace(keyword, &quot;&lt;a href=&#39;&quot;+href+&quot;&#39;&gt;&quot;+keyword+&quot;&lt;/a&gt;&quot;, &quot;gi&quot;);
                            obj.innerHTML = newstr;
                            content = newstr;
                        }
                    }
                }
            }
            this.startScript = function(){
                var onLoad = window.onload;
                window.onload = function(){
                    if(onLoad){onLoad();}
                    setTimeout(&quot;f.createAnchor()&quot;, 100);
                }
            }
        }
        </script>
        <script type='text/javascript'>
        var f = new autoLink();
        f.add(&quot;BLOG(keyword ke 1&quot;, &quot;http://tyrexcom.blogspot.com/(url pertama)&quot;);
        f.add(&quot;SEO(keyword ke 2)&quot;, &quot;http://tyrexcom.blogspot.com/2013/02/site-map.html (url kedua)&quot;);
        f.startScript();
        </script>
        </b:if>

           Silahkan ganti keyword ke 1 dan ke 2 dengan keyword yang anda inginkan, mesti di ingat satu kata saja cukup misal saya,aku,dia,cinta,cara,bikin,lari dll, kemudian url ganti dengan url yang sobat inginkan, nah jika anda sudah beres mengisinya anda tinggal menaruh kodenya diatas kode </head> jangan lupa ceklis expand widget template klik pratinjau jika tidak error klik simpan, beres dech.. sekarang anda perhatiakn pada setiap post artikel pada blog anda, apakah kata yang sudah anda masukan dalam smart-link bekerja atau tidaknya jika bekerja berarti keyword yang sobat target sudah menjadi sebuah link aktif, bagaimana mudah bukan/

             Oke itulah tips kenang-kenangan dari saya semoga script seo smart link ini bisa bermanfaat buat semuanya, akhirul kalam atas perhatiannya saya mengucapkan beribu, berjuta terima kasih.
        Read More

        Selasa, 04 Juni 2013

        Kode Border Dengan Scroll

        0 komentar
        Kode border lengkap dengan scrollnya copy kode dibawah dalam posisi edit html


        <div style="overflow:auto; width:auto; height:1000px; padding:5px; border:1px solid #e6e4e3;">

        ---konten anda disini----

        </div>

        tambahan: untuk sudut border:
        -moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px

        Kalo kurang bundar tinggal gedein angka 4px nya, misalnya jadi 10pxketerangan height adalah tinggi border dan width adalah lebar
        sekian
        post ini hanya sebagai catatan saya. Thank'S

        untuk pertanyaan silakan komentar dibawah
        Read More

        Cara Membuat Halaman Arsip untuk Blog Blogspot - Blogger Archive Page

        0 komentar
        Cara Membuat Halaman Arsip untuk Blog Blogspot - Blogger Archive Page. Mungkin sobat-sobat Blogger sudah tidak asing lagi dengan gadget bawaan Blogger yang bernama "Blog Archive"/"Arsip Blog"? Yapz...betul sekali, widget arsip blog berfungsi untuk menampilkan seluruh arsip tulisan-tulisan atau artikel-artikel kita yang ada di blog kita. Yang namanya juga gadget bawaan Blogger pasti bisanya cuma ditampilkan di bagian yang tersentuh oleh elemen "Add gadget", dengan kata lain hanya bisa ditampilkan di bagian sidebar, header, footer, dll...yang jelas nggak bisa ditampilkan di dalam halaman postingan kita. Nah, di postingan ini sebenarnya kita akan membahas cara menampilkan arsip blog Blogger di dalam postingan Blog Blogspot kita, jadi bagi sobat2 blogger yang tertarik, maka bisa langsung praktek :D



        Bagaimana? Jika sobat tertarik dengan widget tersebut, untuk memasang di blog sobat silakan untuk mengikuti langkah-langkah berikut:

        1. Login ke akun Blogger sobat
        2. Klik tombol "new post"

        3. Dan Beri judul post baru anda "Arsip blog ini" atau apa saja yang menurut anda cocok, "daftar isi" juga boleh....

        4. Selanjutnya di kolom post, paste-kan kode berikut:

        <div id="bp_toc">
        Sedang membuka arsip. SILAHKAN TUNGGU SEBENTAR....</div>
        <script src="http://t4belajarblogger.googlecode.com/files/arsip-t4belajarblogger.js" type="text/javascript"></script> <script src="/feeds/posts/summary?alt=json-in-script&max-results=500&callback=loadtoc" type="text/javascript"></script>

        5. Klik "Publish" untuk mempublikasi postingan "arsip blog" anda....

        Selesai.... :D Bagaimana, gampang bukan?

        Tags: Arsip dalam postingan, arsip blogger post, agar arsip blog dalam post










        Bagikan informasi ini ke teman-teman sobat
        Read More

        Senin, 03 Juni 2013

        Cara mudah mengetahui ID Facebook anda

        0 komentar
        Cara mudah mengetahui ID Facebook anda - Id Facebook ini penting anda ketahui, karena sewaktu-waktu anda akan membutuhkannya. Contohnya jika anda akan memasang Script yang berhubungan dengan Facebook yang biasanya perlu di intergrasikan dengan blog anda, maka diantaranya ada yang memerlukan ID Facebook anda. Jika memang anda memerlukannya dengan segera, maka ikuti saja caranya berikut ini :

        Cara ini adalah metode yang paling mudah. Dan sampai sekarang  masih valid.

        1. Copy link berikut atau klik : https://graph.facebook.com/username
        2. Ganti username dengan username facebook anda. Contoh facebook.com/xbugis
         3. Copy/paste ke browser anda -> Klik Enter.
        4. Nomor yang paling atas adalah nomor id fb anda. Lihat gambar seperti diatas.

        Sebaiknya id facebook anda simpan baik-baik jika suatu saat diperlukan, semoga bermanfaat.
        Read More

        Cara membuat kotak komentar facebook berdampingan dengan kotak komentar blogger

        6 komentar
        Cara membuat kotak komentar facebook berdampingan dengan kotak komentar blogger - Jika anda ingin kotak komentar blog-nya mau ditambahin dengan kotak komentar facebook yang bentuknya berdampingan dengan komentar blogger, anda tinggalmodifikasi saja pada template blog anda. Berikut tutorial cara membuat kotak komentar facebook berdampingan dengan kotak komentar blogger, penasaran ikuti saja caranya.

        1.    Seperti biasa Login Ke Akun Blogger anda.
        2.    Pada Dasbor Pilih Rancangan Design Kemudian Pilih Edit HTML dan jangan lupa untuk mencentang   kolom expand template widget.
        3.    Copas kode berikut tepat dibawah kode <div class='comments' id='comments'> pada template anda.

        Keterangan : apabila terdapat 2 kode <div class='comments' id='comments'> yg sama, silahkan anda pastekan ke kode yg kedua.

        <div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle(&quot;#fb-comments&quot;);' title='Comments made with Facebook'>
        <img class='comments-tab-icon' src='http://static.ak.fbcdn.net/rsrc.php/v1/yH/r/eIpbnVKI9lR.png'/>
        <fb:comments-count expr:href='data:post.url'/> Comments
        </div>
        <div class='comments-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle(&quot;#blogger-comments&quot;);' title='Comments from Blogger'>
        <img class='comments-tab-icon' src='http://www.blogger.com/img/icon_logo32.gif'/> <data:post.numComments/> Comments
        </div><div class='clear'/>
        </div>
        <div class='comments-page' id='fb-comments-page'>
        <b:if cond='data:blog.pageType == &quot;item&quot;'>
        <div id='fb-root'/>
        <fb:comments expr:href='data:post.url' num_posts='2' width='400'/>
        </b:if>
        </div>
        <div class='comments comments-page' id='blogger-comments-page'>

        <script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
        <script src='http://code.jquery.com/jquery-latest.js'/>
        <meta content='Masukan ID Fb anda disini' property='fb:admins'/>
        <script type='text/javascript'>
        function commentToggle(selectTab) {
        $(".comments-tab").addClass("inactive-select-tab");
        $(selectTab).removeClass("inactive-select-tab");
        $(".comments-page").hide();
        $(selectTab + "-page").show();
        }
        </script>
        <style>.comments-page { background-color: #f2f2f2;}
        #blogger-comments-page { padding: 0px 5px; display: none;}
        .comments-tab { float: left; padding: 5px; margin-right: 3px; cursor: pointer; background-color: #f2f2f2;}
        .comments-tab-icon { height: 14px; width: auto; margin-right: 3px;}
        .comments-tab:hover { background-color: #eeeeee;}
        .inactive-select-tab { background-color: #d1d1d1;}</style>


        4 . Simpan Templatenya dan lihat hasilnya.
        Untuk mengetahui secara cepat ID Facebook anda, Klik Disini.

        Demikianlah tutorial Cara menggabungkan kotak komentar facebook dengan kotak komentar blogger semoga bermanfaat buat anda.
        Read More

        Membuat Drop Cap (Huruf Besar) Pada Awal Postingan

        1 komentar

         Drop Cap (Huruf Besar)
        Beberapa waktu yang lalu saya telah membuat drop cap atau huruf besar pada awal postingan seperti halnya pada awal postingan halaman ini. Saya mendapat trik ini dari Maskolis, seorang master blogger pembuat template gratis yang baik hati.

        Nah bagi Anda yang kebetulan nyasar ke sini dan sedang mencari cara Membuat Drop Cap (Huruf Besar) Pada Awal Postingan, kini saya akan share caranya. Caranya cukup mudah, hanya menambahkan kode CSS pada edit HTML template blog. Langsung saja silahkan Anda masuk ke Dashboard blog Anda >> Template >> klik Edit HTML >> centang kotak kecil pada Expand Widget Template. 

        Kemudian cari kode ]]></b:skin> (gunakan CTRL + F untuk memudahkan pencarian). Setelah ketemu silahkan copy kode di bawah ini dan paste DI ATAS / SEBELUM kode tadi.

        .awal{float:left;color:#000;background:#fff;line-height:30px;padding-top:1px;padding-right:5px;font-family:times;font-size:50px;}

        Angka 50 yang berwarna merah adalah ukuran besarnya huruf, silahkan ganti sesuai dengan selera anda. Apabila hurufnya kurang besar, silahkan ganti angkanya misalnya 100. 

        Sekarang tinggal SAVE template Anda. Nah untuk menerapkan drop cap ini, ketika Anda sedang membuat postingan alihkan dulu postingan Compose Anda menjadi postingan HTML kemudian tambahkan kode di bawah ini:

        <span class="awal">huruf awal</span> 

        Kata huruf awal, silahkan ganti dengan huruf pertama atau hurup awal postingan kamu. Misalnya seperti ini:

         <span class="awal">B</span>

        Sehingga postingan kamu menjadi seperti di bawah ini:

        <span class="awal">B</span>eberapa waktu yang lalu saya telah membuat drop cap.......

        Setelah itu silahkan balikan lagi postingan HTML menjadi postingan Compose lagi dan lanjutkan postingan Anda.

        Demikian saja postingan Membuat Drop Cap (Huruf Besar) Pada Awal Postingan ini semoga dapat dimengerti dan bermanfaat...

        Selamat mencoba ....
        Read More

        Minggu, 02 Juni 2013

        Cara Membuat Satu Kolom Widget Diatas Header

        1 komentar
        Cara Membuat Satu Kolom Widget Diatas Header seperti yang terlihat pada gambar dibawah (panah merah) telah saya buat khusus untuk anda dengan cara yang mudah, anda bisa membuat satu kolom widget diatas header blog anda dengan mengikuti panduan cara membuat satu kolom widget diatas header. Dengan adanya tambahan satu kolom widget diatas header akan memberikan tambahan ruang dalam blog anda yang nantinya bisa anda gunakan untuk memasukkan konten-konten diluar topik blog anda atau dari dalam topik blog anda sendiri. Apalagi jika di area header blog ditambahkan lagi dua kolomatau tiga kolom widget maka anda akan lebih leluasa dalam memasukkan atau memasang konten-konten yang anda sukai.Berikut Cara Membuat Satu Kolom Widget Diatas Header

        1. Masuk ke akun blogger anda
        2. Klik menu Template >> Edit Html >> tekan Ctrl+F pada keyboard anda
        3. Cari Kode ]]></b:skin>
        4. Letakkan kode berikut diatas kode ]]></b:skin>
          #oneupperheader{margin:10px 0;padding:1%;width:100%;}
        5. Cari kode berikut ini
          <div id='header-wrapper'>
          <b:section class='header' id='header' maxwidget="1" showaddelement="no">
          <b:widget id='Header1' locked='true' title='test (Header)' type='Header'/>
          </b:section>
          </div>
        6. Letakkan kode berikut ini tepat dibawah <div id='header-wrapper'>
          <b:section class='header' id='oneupperheader' preferred='yes'/>
          Sehingga hasilnya seperti berikut ini
          <div id='header-wrapper'>
          <b:section class='header' id='oneupperheader' preferred='yes'/>
          <b:section class='header' id='header' maxwidget="1" showaddelement="no">
          <b:widget id='Header1' locked='true' title='test (Header)' type='Header'/>
          </b:section>
          </div>
        7. Klik Pratinjau terlebih dahulu untuk melihat hasilnya, jika tidak ada error silahkan Simpan Template anda
        Penting: Setiap template memiliki kode-kode css atau id html yang berbeda jadi sesuaikan setiap kode yang anda miliki dengan setiap panduan yang anda dapatkan atau sesuaikan setiap kode panduan dengan kode yang ada ditemplate anda




        SUMBER: panduan template.blogspot.com
        Read More
         
        Powered by Blogger | Alien Black Blogger Template by Good trik | dkwny2031