Tampilkan postingan dengan label Blogger Trick. Tampilkan semua postingan
Tampilkan postingan dengan label Blogger Trick. Tampilkan semua postingan

Senin, 13 November 2017

Menggunakan Teknik Ini
Satu cara ini mungkin bisa bermanfaat untuk anda, berikut ini cara agar postingan cepat terindex oleh Google, berikut tahap-tahap penerapanya :
  1. Sobat diharuskan login terlebih dahulu di google.
  2. Kunjungi Google Submit Url.
  3. Copy url artikel yang ingin anda submitkan.
  4. Kemudian, paste atau masukan ke kotak "URL" dan masukkan kode Captcha yang diberikan.
  5. Klik "Kirim Permintaan" / "Submit"

Minggu, 08 Juni 2014

Kenapa dibuat laman Contact Me di blog? Ini merupakan pertanyaan yang sederhana, akan tatapi setiap blogger mungkin punya jawaban masing-masing. Contact Me sendiri bertujuan untuk menghubungi si admin blog untuk menyampaikan pesan atau lainnya. Bagi sebagian blogger memiliki cara masing-masing untuk bisa berkomunikasi dengan dengan pengunjung blog, tapi disini kita akan membuat sebuah laman blog agar terlihat lebih sportif, cepat dan simple.


Widget ini sendiri sudah tersedia di blogger, tapi kita akan pindahkan ke sebuah laman kosong di blogger. Caranya cukup mudah dan simple, silakan perhatikan tips berikut:

Masuk ke akun blogger, pada dasbor blogger pilih Tata Letak
    Klik tambahkan Gadget dan pilih gadget lainnya kemudian tambahkan Formulir Kontak
      Contact Me
    Untuk menampilkan di laman blog, tambahkan laman baru lalu copy script berikut dan paste di laman kosong pada format HTML
    Klik disini untuk melihat script
    Sampai tahap ini Contact Me yang sudah kita buat ada 2, yaitu di sidebar blog dan di laman blog
      Untuk menyembunyikan Formulir Kontak yang di sidebar blog, copy script di bawah ini dan paste di lokasi CSS blog

      Contact Me

        #ContactForm1{display: none !important;}
      Terakhir simpan template dan lihat hasilnya
        Sebenarnya banyak website penyedia layanan yang seperti ini tapi ini lebih mudah, simple dan cepat.Selamat mencoba... :)

        Rabu, 08 Januari 2014
















        Tunggu sebentar Countdown Timer Redirect by TUTORIALWEB.NET

        Rabu, 24 Juli 2013

        Selamat malam sobat. Kali ini Saya mau berbagi trik memasang widget di dalam postingan blog. Widget ini bisa saja ditukar dengan widget lain, atau berupa iklan  gambar, video dan yang lain. Tapi di sini Saya akan membuat widget dari Feedburner yang menampilkan artikel apa saja yang baru diposting. Menurut Saya, widget ini cukup menarik, karena letaknya di dalam postingan, jadi lebih memudahkan pengunjung mengetahui artikel yang terakhir diposting tanpa lirik kiri kanan.

        Caranya tidak begitu rumit, jika sobat menggunakan trik ini yaitu memasang widget dari feedburner, tentunya sobat harus memiliki akun dari feedburner. Jika sobat tertarik, coba ikuti beberapa langkah berikut:

        1. Masuk ke akun Blogger
        2. Di laman dasbor, pilih Template => Edit HTML
        3. Cari kode <data:post.body/>
        Jika kode di atas ada yang lebih dari satu atau bahkan sampai tiga, kalau di blog Saya ada tiga. Letakkan kode di bawah ini di atas kode <data:post.body/>:

        <div style='clear: right; float: right; margin-bottom: 1em; margin-left: 1em;'>
        <style type='text/css'>
        #accordion{width:200px;margin:auto;border:0px solid white}
        #accordion h2{padding:5px 10px;background-color:#ccc;background-image: url(http://3.bp.blogspot.com/-tmvT594c400/UcQB43iw-QI/AAAAAAAAA-4/8FnxKQfICAM/s1600/SOME.png);background-repeat: no-repeat;background-position: right center;color:#000;font:normal 11px Tahoma;border-bottom:1px solid #FFF;cursor:pointer;}
        #accordion .content{font:normal 11px Arial;padding:5px 10px;background:transparent;}
        #accordion .content ul {list-style:none;margin:0 0 0;padding:0 0 0;}
        #accordion .content li {background-image: url(); background-repeat: no-repeat;background-position: left center;margin:0;padding:2px 0 3px 0;text-indent:0px;border-bottom:1px dotted #000000;line-height:1.3em;}
        #accordion .content li a:hover {text-decoration:none;color:#000;}
        #accordion h2.active{background-color:#bbb;background-image: url(http://3.bp.blogspot.com/-tmvT594c400/UcQB43iw-QI/AAAAAAAAA-4/8FnxKQfICAM/s1600/SOME.png);background-repeat: no-repeat;background-position: right center;font-weight:bold;}
        </style>
        <script src='http://yourjavascript.com/121511228073/accordion-menu.js' type='text/javascript'/>
        <script type='text/javascript'>
        $(function() {
        $(&#39;#accordion .content&#39;).hide();
        $(&#39;#accordion h2:first&#39;).addClass(&#39;active&#39;).next().slideDown(&#39;slow&#39;);
        $(&#39;#accordion h2&#39;).click(function() {
        if($(this).next().is(&#39;:hidden&#39;)) {
        $(&#39;#accordion h2&#39;).removeClass(&#39;active&#39;).next().slideUp(&#39;slow&#39;);
        $(this).toggleClass(&#39;active&#39;).next().slideDown(&#39;slow&#39;);
        }
        });
        });
        </script>
        <div id='accordion'>
          <h2><b>Menu 1</b></h2>
        <div class='content'>

        <script src="http://feeds.feedburner.com/se-cara?format=sigpro" type="text/javascript" ></script><noscript><p>Subscribe to RSS headline updates from: <a href="http://feeds.feedburner.com/se-cara"></a><br/>Powered by FeedBurner</p> </noscript>
         

        </div></div>
         </div>

        Keterangan: Kode berwarna biru bisa diganti dengan kode dengan kode widget akun feedburner sobat.
        Jika sobat ingin menambah menu tab, contohnya pada widget di atas, cukup dengan menambahkan kode:
        <div id='accordion'>
          <h2><b>Artikel Terbaru</b></h2>
        <div class='content'>

         Isi konten
        </div></div>
        di atas kode </div> yang terakhir, yang hasilnya seperti ini:
        <div id='accordion'>
          <h2><b>Menu 1</b></h2>
        <div class='content'>


        <script src="http://feeds.feedburner.com/se-cara?format=sigpro" type="text/javascript" ></script><noscript><p>Subscribe to RSS headline updates from: <a href="http://feeds.feedburner.com/se-cara"></a><br/>Powered by FeedBurner</p> </noscript>

        </div></div> 
        <div id='accordion'>
          <h2><b>Menu 2</b></h2>
        <div class='content'>

         Isi konten
        </div></div> 
        </div>

        4. Klik simpan template dan lihat hasilnya.

        Mungkin cukup sekian untuk postingan kali ini, untuk pertanyaan dapat di sampaikan lewat kotak komentar. Sekian

        Minggu, 23 Juni 2013

        Selamat pagi dan selamat beraktifitas kembali. Begitu juga halnya dengan kebiasaan Saya dengan menuliskan beberapa coretan di blog ini buat para Sahabat Blogger lainnya. Tutorial di pagi ini ialah tentang cara membuat sebuah laman contact form di blogger dengan memanfaatkan fasilitas dari Google yaitu  Google Drive. Google Drive ini juga menyediakan berbagai pilihan antara lain, membuat Folder, Dokumen, Presentasi,Spreadsheet, Formulir dan Gambar. Untuk membuat Contact Form ini kita pilih pada bagian Formulir.
        Adapun tujuan dari pembuatan sebuah laman Contact Form ini ialah sebagai tempat untuk menghubungi atau menyampaikan sesuatu kepada Admin blog. Tapi dengan membuat sebuah laman yang khusus untuk pengunjung ini akan membuat sedikit lebih sportif.
        Dengan membuat laman ini, data dari Si pengirim pesan dapat kita ketahui, dengan tujuan bahwa yang mengirim pesan ialah memang benar-benar memiliki tujuan, bukan untuk orang yang lagi iseng-iseng. Untuk melihat contohnya bisa lihat di sini

        Jika Anda tertarik membuat laman ini, simak keterangan di bawah ini:
        1. Login ke akun Google dan lanjutkan ke Google Drive di sini
        2. Pilih Buat Formulir, Anda bisa melihat gambarnya di bawah
        3. Selanjutnya tentukan Judul dan Tema
        4. Untuk pengisian pilihan lainnya, ikuti petunjuk gambar di bawah ini
        laman contact form
        Keterangan:
        1. Judul forum
        2. Keterangan tentang forum
        3. Judul pertanyaan. Contohnya nama lengkap Si pengirim pesan pada Contact Form
        - Teks Bantuan bisa Anda tulis dengan kalimat lain, misalnya: Silahkan tulis nama lengkap Anda
        4. Jenis Pertanyaan, pilih Teks
        5. Ini adalah pilihan pertanyaan, apakah Ia wajib diisi atau tidak
        6. Klik selesai.

        Satu kolom pertanyaan sudah selesai di buat, selanjutnya Anda bisa membuat beberapa pertanyaan lainnya pada menu Jenis Pertanyaan

        Jika Anda merasa semua kolom pertanyaan sudah lengkap, yang terakhir ialah membuat kotak Pesan. Caranya sama seperti yang di atas, hanya saja ganti pertanyaan pada menu Jenis Pertanyaan menjadi Teks Paragraf dan klik simpan. Untuk melihat hasilnya Anda bisa klik Lihat bentuk jadi.

        Untuk meletakkan Contact Form ini pada laman Blogger, silahkan masuk ke Blogger dan pilih Laman. Buat sebuah laman baru dengan pilihan Laman Kosong.
        contact form
        Untuk mengambil kode iFrame-nya, klik tombol Kirim formulir => Sematkan
        kontak forum
        Copy kode iFrame-nya dan sesuaikan ukuran lebar dan tingginya.
        Kemudian letakkan kode iFrame-nya pada Laman Kosong tadi pada menu HTML dan klik Pratinjau untuk percobaan. Kalau tidak ada lagi yang kurang, klik Publikasikan

        5. Selesai...

        Cukup mudah bukan...? Sekarang Anda bisa memanfaatkan fasilitas dari google untuk pengunjung Anda dengan Google Drive ini. Jika ada yang perlu ditanyakan tentang ini, langsung saja tulis pada kotak komentar biar lebih cepat. :)

        Sabtu, 22 Juni 2013

        Selamat malam dan selamat beristirahat. Buat yang masih asyik berselancar, silahkan lanjutkan membaca artikel ini. Tutorial kali ini Saya ingin berbagi trik menukar tujuan link aktif pada kotak komentar blog. Mengenai trik ini, seandainya pengunjung blog menulis komentar dengan mencantumkan link yang aktif, maka dengan cara ini Anda bisa mengganti tujuan link tersebut.
        Dengan cara ini juga bisa mengurangi spam yang ada di kotak komentar. Dengan kata lain jika ada yang ingin promosi produk atau promo lain yang disertai link aktif maka dengan secara otomatis tujuan dari link tersebut bisa diarahkan pada alamat blog lain. Contohnya lihat gambar di bawah ini.
        link aktif
        Komentar sebelum diPublish
        link aktif
        Komentar sesudah diPublish
        Caranya tidak begitu rumit, hanya perlu sedikit Edit HTML dan menambahkan Gadget JavaScript. Jika Anda tertarik, coba simak tulisan di bawah ini:
        1. Masuk ke Blogger
        2. Pilih Template pada laman dasbor
        3. Lanjutkan ke Edit HTML
        4. Cari kode </head> lalu letakkan kode di bawah ini di atasnya

        <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'/>
        <script type='text/javascript'> jQuery(document).ready(function(){ jQuery(&quot;#comments p a&quot;).attr(&quot;href&quot;, &quot;http://se-cara.blogspot.com/&quot;); }); </script>

        Keterangan: Yang berwarna biru, ganti dengan alamat blog Anda

        5. Selanjutnya Tambahkan Gadget pada menu Tata Letak dan pilih HTML/JavaScript
        6. Letakkan kode di bawah ini pada kotak Gadget HTML/JavaScript

        <script type='text/javascript'>
        jQuery(document).ready(function(){
         jQuery("#comments p a").attr("href", "http://se-cara.blogspot.com");
        });
        </script>


        Keterangan: Ganti yang berwarna biru dengan alamat blog Anda

        7. Terakhir, klik simpan dan silahkan tes dengan berkomentar disertai link aktif. Jika ada yang belum jelas, tanyakan lewat kotak komentar. Oke...?

        Kamis, 13 Juni 2013

        Kotak belangganan artikel adalah sebuah kotak yang digunakan oleh kebanyakan para blogger utnuk mempermudah pengunjungnya mendapatkan artikel terbaru setiap kali diposting oleh Admin blog. Kotak berlangganan artikel ini dilengkapi dengan empat logo tombol sosial media, antara lain Facebook, Twitter, Google+ dan RSS. Sebagai contohnya, lihat pada gambar di bawah.

        widget blogger

        Adapun cara membuatnya pada blog sangat mudah dan simpel, antara lain:
        1.Login ke Blogger
        2. Pilih Template lalu Edit HTML


        4. Cari kode </head>, kemudian letakkan kode di bawah ini tepat di atasnya

        <style type='text/css'>
        .sub-box{
        width: 282px;
        background: #fff;
        padding: 2px 5px 7px 7px;
        border: 2px solid #000;
        border-radius: 15px;
        }
        .sub-box:hover{
        border-style:dashed; 2px solid: #389af2;
        }
        .followlinks h1{
        font-family:Cabin Condensed;
        font-weight: bold;
        color: #000;
        padding: 0px 0px 2px 40px;;
        font-size:17px;
        }
        .followlinks ul{
        font-family:Cabin Condensed;
        font-weight: bold;
        }
        .followlinks ul li{
        float:left;
        width:90px;
        padding-left:40px;
        margin:0 0 0 5px !important;
        line-height:35px !important;
        }
        .followlinks ul li a{
        font-size:20px !important;
        text-decoration:none;
        font-weight:normal;
        }
        .followlinks ul li.otrss{
        background:url(http://3.bp.blogspot.com/-xOwt1EX4VX4/TteO7sxzSxI/AAAAAAAABFk/RNFj1bsukpQ/s1600/rss-ot.png) no-repeat scroll left center transparent;
        }
        .followlinks ul li.otgoogleplus{
        background:url(http://3.bp.blogspot.com/-GW70c2ukQsI/TteO6ikOudI/AAAAAAAABFc/Cjqxp-ZVbX4/s1600/googleplus-ot.png) no-repeat scroll left center transparent;
        }
        .followlinks ul li.ottwitter{
        background:url(http://1.bp.blogspot.com/-LTDd7jrc55s/TteO8nMa6uI/AAAAAAAABFs/r6aMf7ApC6Q/s1600/twitter-ot.png) no-repeat scroll left center transparent;
        }
        .followlinks ul li.otfacebook{
        background:url(http://4.bp.blogspot.com/-RtDc-xIqgtg/TteO56LVTgI/AAAAAAAABFU/iWhsfa01wEo/s1600/facebook-ot.png) no-repeat scroll left center transparent;
        }
        form.emailform{
        margin:5px 0 0;
        display:block;
        clear:both;
        }
        .emailtext{
        background:url(http://4.bp.blogspot.com/-DMrSxx8BJqo/TteQx1ijO2I/AAAAAAAABF0/Qd1ROb_8oeA/s1600/ot-mail.png) no-repeat scroll 4px center transparent;
        padding:7px 15px 7px 35px;
        color:#444;
        font-weight:bold;
        text-decoration:none;
        border:1px solid #D3D3D3;
        -moz-border-radius: 4px;
        -webkit-border-radius: 4px;
        border-radius: 4px;
        -moz-box-shadow: 1px 1px 2px #CCC inset;
        -webkit-box-shadow: 1px 1px 2px #CCC inset;
        box-shadow: 1px 1px 2px #CCC inset;
        width: 142px;
        }
        .emailtext:focus{
        outline: none;
        }
        .sub-button{
        color:#444;
        font-weight:bold;
        text-decoration:none;
        padding:6px 10px;
        border:1px solid #D3D3D3;
        cursor: pointer;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        -goog-ms-border-radius: 5px;
        border-radius: 5px;
        background: #fbfbfb;
        background: -moz-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fbfbfb), color-stop(100%,#f4f4f4));
        background: -webkit-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
        background: -o-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
        background: -ms-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FBFBFB', endColorstr='#F4F4F4',GradientType=0 );
        background: linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
        }
        .sub-button:hover{
        background: -moz-linear-gradient(top, #e7e7e7 0%, #f4f4f4 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e7e7e7), color-stop(100%,#f4f4f4));
        background: -webkit-linear-gradient(top, #e7e7e7 0%,#f4f4f4 100%);
        background: -o-linear-gradient(top, #e7e7e7 0%,#f4f4f4 100%);
        background: -ms-linear-gradient(top, #e7e7e7 0%,#f4f4f4 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e7e7e7', endColorstr='#F4F4F4',GradientType=0 );
        background: linear-gradient(top, #e7e7e7 0%,#f4f4f4 100%);
        }</style>
        <script type="text/javascript">
          WebFontConfig = {
            google: { families: [ 'Cabin+Condensed::latin' ] }
          };
          (function() {
            var wf = document.createElement('script');
            wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
              '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
            wf.type = 'text/javascript';
            wf.async = 'true';
            var s = document.getElementsByTagName('script')[0];
            s.parentNode.insertBefore(wf, s);
          })(); </script>


        Ket: Untuk ukuran, warna, logo dan yang lain jika ingin mengganti silahkan sesuaikan dengan keinginan Anda

        5. Klik Simpan Template
        6. Selanjutnya, pilih Tata Letak dan Tambahkan Gadget
        7. Tambahkan gadget HTML/JavaScript lalu letakkan kode di bawah ini pada kotak gadget tadi

        <div class='sub-box'>
        <div class='followlinks'>
        <h1>Get Free Email Upadtes</h1>
        <ul>
        <li class='otrss'><a target='_blank' href='http://feeds.feedburner.com/ID ANDA'>RSS</a></li>
        <li class='otgoogleplus'><a target='_blank' href='http://plus.google.com/ID ANDA'>Google+</a></li>
        <li class='ottwitter'><a target='_blank' href='http://twitter.com/ID ANDA'>Twitter</a></li>
        <li class='otfacebook'><a target='_blank' href='https://www.facebook.com/ID ANDA'>Facebook</a></li>
        </ul>
        </div>
        <br />
        <div style="text-align: left; display: inline-block;">
        <form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=ID ANDA', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" class="emailform">

        <input type="hidden" value="onlinetrick" name="uri" />
        <input type="hidden" name="loc" value="en_US" />
        <input type="text" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}" onfocus="if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}" value="Enter your email..." name="email" class="emailtext" />
        <input type="submit" class="sub-button" value="SignUp" title='' alt='' />
        </form>
        </div>
        </div>


        Ket: Ganti yang dicetak tebal dengan ID sosial media Anda

        8. Terakhir, klik Simpan.

        Rabu, 12 Juni 2013

        Sebelumnya Saya sudah posting tentang widget recent comment simpel, dan sekarang Saya mau posting lagi tentang widget blogger yaitu widget recent post terbaru dengan thumbnail. Thumbnail itu sendiri dapat dipahami dengan sebuah gambar yang berukuran lebih kecil dari yang aslinya. Contohnya saja dalam widget, dalam posting anda ada gambar berukuran besar. Dengan widget ini , gambar ersebut akan ditampilkan lebih kecil dari ukuran sebelumnya. Untuk lebih jelasnya Anda bisa lihat pada gambar di atas.
        Bentuk thumbnail ini biasanya banyak digunakan oleh para webmaste/blogger yang mempunyai sebuah web dengan tampilan gambar yang banyak dan untuk sebuah web toko online, agar gambar yang di posting dapat terlihat dengan berbagai variasi.

        Jika Anda tertaring ingin mencoba widget ini, silahkan simak ulasan di awah ini:
        1. Login ke Blogger
        2. Pada laman dasbor, pilih Tata Letak => Tambahkan Gadget
        3. Tambahkan Gadget dari HTML/JavaScript
        4. Lalu copy kode di bawah ini kedalam kotak gadget tadi

        <style type="text/css">
        #post-gallery {
          width:280px;
          margin:0px auto;
          font:normal 11px Arial,Sans-Serif;
          color:#494848;
          padding:8px;
          background-color:#ffffff;
          -webkit-box-shadow:0px 10px 30px rgba(0, 0, 0, 0.4);
          -moz-box-shadow:0px 10px 30px rgba(0, 0, 0, 0.4);
          box-shadow:0px 10px 30px rgba(0, 0, 0, 0.4);
          -webkit-border-radius:4px;
          -moz-border-radius:4px;
          border-radius:4px;
        }
        #post-gallery h2 {
          font:20px Arial,Sans-Serif;
          color:white;
          text-shadow:0px 3px 2px black;
          text-transform:uppercase;
          margin:2px 2px 2px;
          padding:7px 14px;
          background-color:#48D;
          text-align: center;
        }
        #post-gallery .rp-item {
          float:left;
          display:inline;
          position:relative;
          margin:2px;
          padding:0px 0px;
          background:#fff url('https://fbstatic-a.akamaihd.net/rsrc.php/v2/yb/r/GsNJNwuI-UM.gif') no-repeat 50% 50%;
          width:52px;
          height:52px;
        }
        #post-gallery .rp-item img {
          width:52px;
          height:52px;
          border:none !important;
          margin:0px 0px !important;
          padding:0px 0px !important;
          background:transparent !important;
          display:none;
        }
        #post-gallery .rp-item .rp-child {
          position:relative;
          top:10%!important;
          left:10%!important;
          z-index:1000;
          width:200px;
          background-color:white;
          border-top:5px solid #FA7C19;
          -webkit-box-shadow:5px 5px 10px rgba(0, 0, 0, 0.7);
          -moz-box-shadow:5px 5px 10px rgba(0, 0, 0, 0.7);
          box-shadow:5px 5px 10px rgba(0, 0, 0, 0.7);
          padding:10px 15px;
          overflow:hidden;
          word-wrap:break-word;
          display:none;
          opacity: 0.9;
        }
        #post-gallery .rp-item .rp-child h4 {
          font-size:12px;
          margin:0px 0px 5px;
          color:#FA7C19;
        }
        #post-gallery .rp-item:hover .hidden {display:block;}
        </style>

        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
        <script type="text/javascript">
        var rpTitle     = "Se-cara Blog",       // Widget Title
            numposts    = 20,      // The number of thumbnail / posts to display
            numchar     = 200,      // Number of characters in the description tooltip
            rcFadeSpeed = 600,      // Speed of the effect. fadeIn () tooltip appears
            pBlank      = "http://4.bp.blogspot.com/-egx5hydZZuI/UVrLlsxhX8I/AAAAAAAAAdI/SSH7CWqiwls/s175/SOME.png",      // Image that show up if the post doesn't have a image
            blogURL     = "http://se-cara.blogspot.com/";       // Your Blog Address
        </script>
        <script src="http://yourjavascript.com/01201910631/se-carablog.js" type="text/javascript"></script>

        <span id=rcw-cr><a href='http://goo.gl/8BkeX' onmouseover='window.location=this.href'>Dapatkan Widgetnya di Sini</a></span><style type=text/css> .rcw-comments a {text-transform: capitalize;} .rcw-comments {border-bottom: 1px dotted; padding-top: 2px!important; padding-bottom: 2px!important;} #rcw-cr {font-family: Arial,Tahoma;font-size:2px;padding-top:2px;display:block;} </style>

        Ket: Ganti kode yang berwarna biru di atas dengan alamat blog Anda. Untuk warna, ukurannya dan lainnya silahkan edit sendiri!

        5. Langkah terakhir, klik simpan pada gedget javascript tadi dan lihat hasilnya.

        Cukup sekian untuk tutorial kali ini, sekarang Anda dapat mengkreasikan artikel Anda dengan widget ini. Selamat mencoba... :)
        Selamat datang kembali di Se-cara Blog. Tutorial kali ini Saya akan membahas sedikit tips dan trik blogging dengan membuat sebuah widget Recent Comment dengan bentuk klasik dan simple. Widget ini dirancang dengan menggunakan javascript agar lebih mudah digunakan. Untuk contohnya Anda bisa lihat gambar di atas. Karena dengan membuat widget komentar ini, Anda dapat mengetahui langsung siapa saja yang baru mengomentari artikel blog Anda tanpa membuka laman lain. Dalam widget ini terdapat nama yang berkomentar, judul artikel yang dikomentari dan isi komentarnya, dengan begitu Anda dapat mengetahui Artikel mana yang dikomentari oleh si pengunjung.

        blogger widget
        Cara cukup mudah dan tidak begitu rumit, hanya meletakkan kode script di bawah ini pada gadget javascript pada laman dasbor blogger, untuk lebih jelasnya, silahkan ikuti langkah-langkah berikut:

        1. Login ke akun Blogger
        2. Di laman dasbor, pilih Tata Letak dan Tambahkan Gadget
        3. Selanjutnya, pilih Gadget HTML/JavaScript
        4. Copy kode di bawah ini ke dalam kotak gadget tersebut


        <script style=text/javascript src="http://yourjavascript.com/1931215169/commentse-cara.js"></script><script style=text/javascript >var a_rc=5;var m_rc=false;var n_rc=true;var o_rc=100;</script><script src=http://se-cara.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments ></script><span id=rcw-cr><a href=http://se-cara.blogspot.com/2013/06/widget-simple-recent-comment-for.html>Recent Comments Widget</a></span><style type=text/css> .rcw-comments a {text-transform: capitalize;} .rcw-comments {border-bottom: 1px dotted; padding-top: 7px!important; padding-bottom: 7px!important;} #rcw-cr {font-family: Arial,Tahoma;font-size:9px;padding-top:7px;display:block;} </style>

        Keterangan: Anda perlu melakukan pengeditan pada kode di atas yaitu kode yang berwarna biru
        untuk ukuran dan warna font silahkan edit sendiri sesuai kebijakan yang berlaku dalam keinginan masing-masing. wkwkwk :D

        5. Terakhir, klik simpan dan lihat hasilnya.

        Cukup sekian, sekarang Anda dapat mengetahui komentar terbaru dari blog Anda. Terimaksih sudah bersedia mampir di blog in, kalau ada pertanyaan, berkomentarlah dengan sopan!!! Salam Se-cara Blog :)

        Senin, 10 Juni 2013

        widget bloggerTerima kasih sudah bersedia mampir di blog yang sederhana ini. Di sini kembali dengan kebiasaan lama Saya, yaitu saling berbagi antar sesama. Pada postingan kali ini, Saya ingin berbagi dengan Sobat tentang cara membuat tombol follow dari situs-situs jejaring sosial, seperti Facebook, Twitter, Google plus dan lainnya. Cara kerja widget ini menurut Saya cukup keren, hanya dengan mengarahkan kursor ke salah satu tombol tersebut, maka dengan secara otomatis tombol yang tadinya berwarna kabur akan berubah dengan warna yang sudah ditentukan.

         Caranya cukup mudah, hanya dengan meletakkan kode script di bawah ini pada gadget HTML/JavaScript pada Blogger. Untuk lebih jelasnya, simak ulasan di bawah ini:

        1. Masuk ke akun Blogger
        2. Di halaman dasbor, pilih Tata Letak
        3. Seterusnya, Tambahkan Gadget dan pilih HTML/JavaScript
        4. Copy kode di bawah ini dan letakkan pada widget HTML/JavaScript

         <style> 
        #tbisose{list-style:none; text-decoration:none; font-size:0.9em; font-family:trebuchet ms,sans-serif;}
        #tbisose a{text-decoration:none; font-family:trebuchet ms,sans-serif;}
        #tbisose li{position:relative; height:38px; cursor:pointer; padding: 0 !important;}
        #tbisose .facebook, .googleplus, .pinterest, .rss, .twitter{position:relative; z-index:5; display:block; float:none; margin:10px 0 0; width:210px; height:38px; border-radius:5px; background:url(https://lh4.googleusercontent.com/-l0EYSSxxuc8/UFd37FdwjzI/AAAAAAAAG2E/CDbmwPO4haA/s800/sprites.png) no-repeat; background-color:rgba(217,30,118,.42); -webkit-box-shadow:rgba(0,0,0,.28) 0 2px 3px; -moz-box-shadow:rgba(0,0,0,.28) 0 2px 3px; box-shadow:rgba(0,0,0,.28) 0 2px 3px; color:#141414; text-align:left; text-indent:50px; text-shadow:#333 0 1px 0; white-space:nowrap; line-height:32px; -webkit-transition:width .25s ease-in-out,background-color .25s ease-in-out; -moz-transition:width .25s ease-in-out,background-color .25s ease-in-out; -ms-transition:width .25s ease-in-out,background-color .25s ease-in-out; -o-transition:width .25s ease-in-out,background-color .25s ease-in-out; transition:width .25s ease-in-out,background-color .25s ease-in-out; -o-box-shadow:rgba(0,0,0,.28) 0 2px 3px;}
        #tbisose li:after{position:absolute; top:0; left:50px; z-index:2; display:block; height:38px; color:#141414; content:attr(data-alt); line-height:32px;}
        #tbisose .icon{overflow:hidden; color:#fafafa;}
        #tbisose .facebook{width:32px; height:32px; background-color:rgba(59,89,152,0.42); background-position:0 0;}
        #tbisose .twitter{width:32px; height:32px; background-color:rgba(64,153,255,0.42); background-position:0 -33px;}
        #tbisose .googleplus{width:32px; height:32px; background-color:rgba(228,69,36,0.42); background-position:-3px -66px;}
        #tbisose .pinterest{width:32px; height:32px; background-color:rgba(174,45,39,0.42); background-position:0 -95px;}
        #tbisose .rss{ width:32px; height:32px; background-color:rgba(255,102,0,0.42); background-position:-3px -126px;}
        #tbisose li:hover .icon,
        .touch #tbisose li .icon{width:210px;}
        .touch #tbisose li .facebook, #tbisose li:hover .facebook{background-color:rgba(59,89,152,1);}
        .touch #tbisose li .twitter, #tbisose li:hover .twitter{background-color:rgba(64,153,255,1);}
        .touch #tbisose li .googleplus, #tbisose li:hover .googleplus{background-color:rgba(228,69,36,1);}
        .touch #tbisose li .pinterest, #tbisose li:hover .pinterest{background-color:rgba(174,45,39,1);}
        .touch #tbisose li .rss, #tbisose li:hover .rss{background-color:rgba(255,102,0,1);}
        </style>
        <ul id="tbisose">
        <li data-alt="Follow us on Facebook"><a class="icon facebook" href="#">Follow us on Facebook</a></li>
        <li data-alt="Follow us on Twitter"><a class="icon twitter" href="#">Follow us on Twitter</a></li>
        <li data-alt="Follow us on Google+"><a class="icon googleplus" href="#">Follow us on Google+</a></li>
        <li data-alt="Follow us on Pinterest"><a class="icon pinterest" href="#">Follow us on Pinterest</a></li>
        <li data-alt="Subscribe with RSS"><a class="icon rss" href="#">Subscribe with RSS</a></li>
        </ul>
        <small><div style="font-size:80%; text-align:right; text-shadow:2px 2px 2px #adadad;"><a href="
        http://se-cara.blogspot.com/2013/06/cara-pasang-tombol-follow-social-media.html" target="_blank" title="Klik di sini untuk memasang widget di blog Anda">Pasang Widget</a></div></small>

         Keterangan:  Untuk yang berwarna biru ganti dengan URL jejaring sosial Sobat
                                 Yang berwarna merah bisa Sobat ganti dengan kalimat lain

        5. Terakhir klik simpan dan lihat hasilnya

        Cukup sekian cara membuat widget tombol jejaring sosial di blog. Terima kasih sudah meluangkna waktunya untuk membaca artikel ini, dan jangan lupan komentarnya...! :)

        Senin, 13 Mei 2013

        widget jejaring sosialse-cara.blogspot.com - Sosial bookmark merupakan sarana yang cocok buat promosi artikel dengan mudah dan simpel. Di sini Saya ingin berbagi sedikit trik membuat widget sosial bookmark menempel pada scroll PC. Buat Sobat yang halaman blognya penuh diisi dengan artikel atau widget lain, maka widget ini salah satu jalan keluar untuk mengurangi kepadatan halaman, atau lebih tepatnya menghemat halaman blog. Untuk widget kali ini, Saya menggunakan efek Easing dengan kode jquery, karena dengan cara ini, ketika kursor diletakkan pada salah satu sosial bookmark, maka akan secara otomatis muncul dengan perlahan.

        Perlu Sobat ketahui, sebelumnya Saya sudah posting juga mengenai widget sosial bookmark, Sobat bisa membacanya di sini, tapi pada widget kali ada dua pertambahan yaitu, youtube dan pinterest yang memungkinkan menambah kecantikan widget ini.
        Baiklah, buat Sobat yang tertarik untuk membuat widget ini, silahkan ikuti langkah-langkah berikut:

        1. Untuk yang pertama ini, masuk ke akun blogger
        2. Di halaman dasbor, pilih template => Edit HTML
        3. Selanjutnya, copy kode di bawah ini dan paste-kan tepat di atas kode:  ]]></b:skin>

        Kode Script.social-buttons { position: fixed; top: 130px; width: 45px; z-index: 9999; } .button-left { left: 0; } .button-right { right: 0; } .social-buttons #twitter-btn .social-icon, .social-buttons #facebook-btn .social-icon, .social-buttons #google-btn .social-icon, .social-buttons #rss-btn .social-icon, .social-buttons #pinterest-btn .social-icon, .social-buttons #youtube-btn .social-icon { background-color: #33353B; background-image: url(http://1.bp.blogspot.com/-KOzIiYFlBAk/UUmLwwZSs-I/AAAAAAAAAnA/h6G772N3cpI/s1600/mas-icons.png); } .button-left #facebook-btn span { background-position: right 10px; } .button-left #twitter-btn span { background-position: right -35px; } .button-left #google-btn span { background-position: right -127px; } .button-left #rss-btn span { background-position: right -80px; } .button-left #pinterest-btn span { background-position: 11px -177px; } .button-left #youtube-btn span { background-position: 11px -223px; } .button-right #facebook-btn span { background-position: 12px 10px; } .button-right #twitter-btn span { background-position: 11px -35px; } .button-right #google-btn span { background-position: 10px -127px; } .button-right #rss-btn span { background-position: 11px -80px; } .button-right #pinterest-btn span { background-position: 11px -177px; } .button-right #youtube-btn span { background-position: 11px -223px; } .social-buttons #facebook-btn:hover .social-icon { background-color: #3B5998; } .social-buttons #twitter-btn:hover .social-icon { background-color: #62BDB2; } .social-buttons #google-btn:hover .social-icon { background-color: #DB4A39; } .social-buttons #rss-btn:hover .social-icon { background-color: #FF8B0F; } .social-buttons #pinterest-btn:hover .social-icon { background-color: #D43638; } .social-buttons #youtube-btn:hover .social-icon { background-color: #C4302B; } .social-buttons a:hover .social-text { display: block; } .button-left .social-icon { -moz-transition: background-color 0.4s ease-in 0s; -webkit-transition: background-color 0.4s ease-in 0s; background-repeat: no-repeat; display: block; float: left; height: 43px; margin-bottom: 2px; width: 43px; } .button-left .social-text { display: none; float: right; font-size: 1em; font-weight: bold; margin: 11px 40px 11px 0px; white-space: nowrap; } .button-right .social-icon { -moz-transition: background-color 0.4s ease-in 0s; -webkit-transition: background-color 0.4s ease-in 0s; background-repeat: no-repeat; display: block; float: right; height: 43px; margin-bottom: 2px; width: 43px; } .button-right .social-text { display: none; float: left; font-size: 80%; font-weight: bold; margin: 11px 0 11px 40px; white-space: nowrap; } .social-buttons .social-text { color: #FFFFFF; }

        4. Untuk meletakkan kode jquery-nya, copy kode di bawah ini dan paste di atas kode: </head>
        _____________________
        <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'/>
        <script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js' type='text/javascript'/>
        <script>
            $(window).load(function(){
                $(&#39;.social-buttons .social-icon&#39;).mouseenter(function(){
                    $(this).stop();
                    $(this).animate({width:&#39;160&#39;}, 500, &#39;easeOutBounce&#39;,function(){});
                });
                $(&#39;.social-buttons .social-icon&#39;).mouseleave(function(){
                    $(this).stop();
                    $(this).animate({width:&#39;43&#39;}, 500, &#39;easeOutBounce&#39;,function(){});
                });
            });
        </script>

        _____________________
        Ket: Kode yang berwarna biru, jika pada template Sobat sudah ada, maka kodenya bisa dihapus

        5. Untuk menampilkan widgetnya, letakkan kode di bawah sebelum kode: </body>

        <div class='social-buttons button-right hidden-phone hidden-tablet'>
        <a class='itemsocial' href='https://www.facebook.com/your FB' id='facebook-btn' target='_blank'><span class='social-icon'><span class='social-text'>Follow via Facebook</span></span></a>
        <a class='itemsocial' href='https://twitter.com/your twitter' id='twitter-btn' target='_blank'><span class='social-icon'><span class='social-text'>Follow via Twitter</span></span></a>
        <a class='itemsocial' href='https://plus.google.com/your G+' id='google-btn' target='_blank'><span class='social-icon'><span class='social-text'>Follow via Google</span></span></a>
        <a class='itemsocial' href='http://pinterest.com/your ID' id='pinterest-btn' target='_blank'><span class='social-icon'>
        <span class='social-text'>Follow via Pinterest</span></span></a>
        <a class='itemsocial' href='https://www.youtube.com/user/your ID' id='youtube-btn' target='_blank'><span class='social-icon'><span class='social-text'>Follow via Youtube</span></span></a>
        <a class='itemsocial' href='http://feeds.feedburner.com/your feed' id='rss-btn' target='_blank'><span class='social-icon'><span class='social-text'>Follow via RSS</span></span></a>
        </div>


        Untuk kode yang berwarna merah, ganti dengan id sosial bookmark Sobat.

        6. Terakhir, simpan templatenya.

        Cukup sekian cara memasang widget sosial bookmark di blog, kode script di atas Saya ambil dari blognya maskolis, Sobat bisa mengunjunginya di sini untuk lebih jelasnya. Dan yang tak kalah pentingnya adalah komentar dari Sobat tentang artikel di atas.
        trik seoMempunyai blog yang benar-benar search engine optimization (seo) merupakan impian setiap pecintanya. Dalam hal ini, untuk mencapai target seo, menurut yang Saya alami tidaklah semudah yang Saya bayangkan sebelumnya. Walaupun mempunyai blog yang seo tidak begitu mudah bagi blog pemula seperti Saya, tapi dengan melakukan usaha dengan trik-trik yang ada, semua itu bisa terjadi karena apabila diusahai segala sesuatu itu bisa terjadi.

        Sebagai contoh dengan judul yang Saya maksud di atas adalah, apabila kursor di arahkan ke judul artikel, maka dengan secara otomatis title link tersebut akan muncul. Untuk lebih jelasnya, Sobat bisa lihat gambar di atas.

        Buat Sobat semua, pada malam hari ini, Saya ingin berbagi sedikit trik mengoptimalkan seo dengan title pada link judul postingan. Walaupun dengan trik ini belum sepenuhnya mendapatkan soe terbaik, tapi dalam proses cek seo blog pada situs-situs cek seo, www.chkme.com contohnya. Jika Sobat melakukan cek seo pada situs di atas, maka kesalahan link pada blog akan ditampilkan termasuk link judul postingan apabila diaktifkan.

        Perlu Sobat ketahui, trik ini hanya untuk blog yang disertakan link aktif pada judul postingan. Buat yang ingin menggunakan trik ini, coba simak ulasan di bawah ini:

        1. Seperti biasanya, msuk ke akun blogger
        2. Pada dasbor, pilih template => Edit HTML
        3. Setelah halaman edit hrml sudah tersedia, silahkan cari kode berikut:

        <a expr:href='data:post.link'><data:post.title/></a>

        Setelah ditemukan, ganti dengan kode berikut:

        <a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a>

        4. Selanjutnya cari kode berikut:

        <a expr:href='data:post.url'><data:post.title/></a>

        Lalu ganti dengan kode berikut:

        <a expr:href='data:post.url' expr:title='data:post.title'><data:post.title/></a>

        Keterangan: Perlu digaris bawahi, kode no.3 dan 4 mempunyai teman yang sama alias kode yang sama. Tapi Sobat tidak perlu khawatir, Sobat hanya tinggal mencari tag yang dijadikan untuk judul postigan, apakah ia tag H1, H2 atau H3. Jika Sobat bingung yang mana tag yang dijadikan untuk judul blog, biasanya kode di atas terdapat setelah kode tag H1, H2 atau H3. Jika pada tag yang pertama belum berhasil, coba pada tag yang selanjutnya. Karena setiap template, susunan kode script maupun tata letaknya tidak sama (berbeda).

        5. Langkah terakhir, simpan templatenya dan lihat hasilnya.

        Mungkin cukup sekian cara membuat seo menjadi lebih baik dengan menggunakan title otomatis pada judul postingan blog. Selamat mencoba, semoga sukses dalam dunia blogging. :) Satu lagi, jangan lupa tinggalkan jejak di kotak komentar, dengan alasan agar Saya bisa mengunjungi blog Sobat kembali.

        Kamis, 09 Mei 2013

        Menambahkan tombol donasi Paypal ke blog/website Sobat, bisa memungkinkan memberi kepada pengunjung/pembaca setia Sobat yang berbaik hati satu kesempatan untuk mendukung (mendorong) Sobat dengan menyumbang beberapa dolar. Hal ini tergantung kepada admin blog/website, bagaimana menarik perhatian pengunjung dengan sejumlah artikel, aksesoris, widget dan jasa-jasa yang tersedia di blog tersebut. Misalkan saja dengan menulis pesan "Demi kelangsungan blog/website ini, para pengunjung/sahabat yang berbaik hati, sudilah kiranya memberikan sedikit sumbangan".

        Jika Sobat  belum memiliki account paypal, Sobat bisa mengunjungi situs webnya atau lebih cepat klik di sini, dan dapatkan akun paypal gratis.

        Jadi, untuk meletakkan tombol donasi di blog Sobat, mari kita simak sedikit trik ini:

        1. Untuk yang pertama ini, login ke akun paypal Sobat
        2. Kemudian klik tombol Merchant Services

        klik menu merchant services
        klik merchant services
        3. Selanjutnya klik tombol Donations

        klik tombol donations
        klik donations
         4. Sekarang, Sobat akan melihat beberapa pilihan seperti nama Donasi / jasa, id donasi, dll. Silahkan isi datanya dengan benar
        5. Selanjutnya, klik Create Button
        6. Trik terakhir, Sobat copas kode scriptnya dan letakkan di JavaScript pada gadget blogger atau terserah di mana yang Sobat inginkan.

        Tombol donasi selesai dipasang, sekarang tinggal menunggu sumbangan dari rekan-rekan yang berbaik hati.

        Jumat, 03 Mei 2013

        Media sosial merupakan salah satu cara yang dimanfaat oleh para blogger maupun webmaster lainnya untuk mempromosikan blog/website. Di samping itu, beberapa situs jejaring sosial tersebut sangat berperan dalam halnya trafik maupun Search Engine Optimization (SEO). Mungkin Sobat pernah atau lebih tepatnya sering, melihat tombol maupun widget jejaring sosial yang dipasang pada blog/website.

        Tapi, pada malam hari ini, Saya ingin berbagi dengan Sobat untuk membuat artikel otomatis terposting ke situs sejaring sosial. Saya juga menggunakan trik ini untuk membantu mempublikasikannya ke beberapa situs jejaring sosial.

        Jika Sobat tertarik dengan cara ini, silahkan menyimak ulasan berikut:

        1. Silahkan kunjungi situs ini => dlvr.it
        2. Lanjut ke pendaftaran dengan mengisi alamat email dan password, kemudian klik Sign up
        3. Selanjutnya dengan mengisi kotak yang disediakan dengan URL Feed lalu klik next
        4. Kemudian hubungkan dengan jejaring sosial

        Blogger Trick, SEO, Widget

        5. Jika Sobat ingin memasang widget dari dlvr.it, klik widget, kemudian sesuaikan warnanya dan ukurannya lalu klik get code. Kodenya bisa Sobat letakkan di HTML/JavaScript pada gadget blogger.
        6. Selesai

        Itulah sekilas tentang cara membuat artikel auto posting ke jejaring sosial.

        Rabu, 01 Mei 2013

        Blogger Trick, Design Mengganti latar belakang atau background blog memang sering dilakukan oleh para blogger. Dengan begitu kita dapat menikmati keidahan background bog apabila ia berbentuk gambar pemandangan ataupun yang lain. Tidak hanya gambar, background blog bisa saja terdiri dari warna, gambar ataupun animasi, itu tergantung dengan keinginan pemilik blog. Tapi di sini Saya hanya membahas trik mengganti latar belakang blog dengan gambar kecil maupun besar. Silahkan ikuti trik berikut:

        1. Seperti biasanya, login ke blogger
        2. Pilih Template => Edit HTML
        3. Selanjutnya, cari kode: body{background:

        untuk template blog yang backgroundnya hanya warna, biasanya kode seperti di atas di sambung dengan #ffffff sehingga menjadi body{background:#ffffff;  kode #ffffff merupakan kode warna background template blog. Jika Sobat ingin mengganti backgroundnya dengan gambar berukuran besar, letakkan kode di bawah ini di bawah kode warna blog sobat, tepatnya sebelum tanda titik koma.
        Ini kodenya: url('letakkan link gambar di sini') repeat-x fixed top center
        Sehingga menjadi: body{background:#ffffff 
        url('letakkan link gambar di sini') repeat-x fixed top center;
         Kode repeat-x fixed top center berfungsi supaya gambar bisa tetap saat scroll digulung ke bawah dan ini untuk gambar berukuran besar.

        Jika Sobat menggunakan gambar berukuran kecil letakkan kode di bawah ini, posisinya pas seperti yang di atas.
        Ini kodenya: url('letakkan link gambar di sini') repeat fixed
        Kode repeat fixed fungsinya sama dengan yang di atas, hanya saja kode ini untuk gambar berukuran kecil.

        4. Klik simpan template.

        Cukup sekian Trik  Mengganti Latar Belakang atau Background Blog. Perlu digaris bawahi, trik di atas Saya coba dengan template blog ini. Jadi, kalau trik di atas tidak berfungsi di template Sobat, silahkan disesuaikan, karena setiap template tata letak maupun kodenya tidak sama.

        Jumat, 26 April 2013

        Blogger Trick
        Klik gambar untuk mendownload
        Sesuai judul di atas link download berbentuk gambar ialah menggabungkan link gambar dengan link download dengan kode script yang apabila gambar tersebut di klik, maka akan muncul dialog untuk mendownload, dan di sini Saya akan berbagi sedikit trik cara membuatnya.

        Dengan trik ini, kita bisa mengalihkan perhatian pengunjung dengan menghiasi link tersebut dengan gambar. Sebenarnya link download bisa saja berbentuk teks, gambar, animasi, video, dan masih banyak lagi yang bisa dikaitkan dengan link download. Ini semua menurut Saya hanya untuk mengalihkan perhatian si pengunjung blog/website.

        Untuk melihat contohnya, Sobat bisa klik gambar di atas.

        Buat Sobat yang ingin membuat  link download berbentuk gambar, silahkan simak ulasan berikut:

        1. Sobat siapkan link download dan link gambarnya
        2. Selanjutnya, perhatikan kode script berikut:

        <div class="separator" style="clear: both; text-align: center;">
        <a href="letakkan link download di sini" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;" target="_blank"><img border="0" height="184" src="letakkan link gambar di sini" width="320" /></a></div>


        Ket: warna merah adalah tempat atau lokasi gambar, misalnya di tengah, kiri, kanan.
                 warna hijau adalah link download dan link gambar
                 warna biru adalah ukuran gambar

        Untuk lebih mudah, bagi Sobat yang memiliki akun blogger.

        1. Login ke akun blogger
        2. Pada dasbor blogger, pilih buat entri baru
        3. Panduan di halaman entri, silahkan liaht gambar di bawah ini:

        Blogger Trick

        Pada gambar di atas, klik logo gambar pada nomor 1 untuk mengunggah gambar (upload gambar), kemudian block gambar pada nomor 2, klik tulisan link pada nomor 3 dan letakkan link download di kotak yang di sediakan, setelah itu, klik HTML pada nomor 4 lalu ambil kode scriptnya.

        5. Selesai...

        Mungkin, cukup sekian Cara Membuat Link Download Berbentuk Gambar. Ada pertanyaan silahkan sampaikan melalui kotak komentar.
        Dengan mendaftarkan blog ke google analytics, ini merupakan salah satu pengoptimalan cara kerja mesin telusur (Search Engine). Karena di sini juga kita bisa mengetahui data yang terdeteksi oleh si Mbah Google seperti link yang terindex dan jumlahnya, kata kunci yang kita gunakan, lalu lintas tentang situs web/blog dan masih banyak lagi informasi yang bisa diperoleh dari google analytics tentang blog kita.

        Di sini Saya tidak bisa menjelaskan lebih banyak lagi, karena masih banyak para webmaster yang lebih tau/mengerti/paham masalah google analytics karena Saya juga masih baru di dunia blogging.

        Untuk Cara Mendapatkan Kode Pelacakan Dari Google Analytics, silahkan ikuti beberapa langkah berikut:

        1. Kunjungi situs web resmi google analytics klik di sini
        2. Di halaman tersebut akan muncul analisi sebuah web kelas perusahaan, klik buat akun untuk mendaftar
        3. Jika Sobat sebelumnya sudah pernah mendaftar dengan akun google/gmail yang sama, di halaman ini akan ditampilkan beberapa situs web/blog yang sudah didaftarkan, untuk buat akun baru, silahkan klik Admin

        lebih jelasnya coba perhatikan gambar di bawah ini:

        Blogger Trick, SEO
        Gambar 1

        Blogger Trick, SEO
        Gambar 2
        4. Halaman selanjutnya pilih situs web lalu isi data situs web/blog dan zona waktu. Dalam metode pelacakan ini, ada 2 pilihan yang disediakan google analytics pilih salah satu sesuai situs web/blog atau keinginan Sobat

        5. Selanjutnya klik Dapatkan ID Pelacakan
        6. Kemudian copy kode script ID pelacakan pada blog Sobat di bawah kode <head> atau di meta tag Sobat atau petunjuknya juga ada di atas kode ID pelacakan google analytics "Ini adalah kode pelacakan Anda. Salin dan tempel kode ini ke dalam kode dari setiap laman yang ingin Anda lacak."
        7. Selesai

        Cukup sekian yang dapat Saya sampaikan kalau ada trik di atas yang kurang atau belum sempurna silahkan dilengkapi buat para webmaster.

        Kamis, 25 April 2013

        Contact Forum atau Contact Us adalah sebuah laman yang disediakan untuk menghubungi Admin suatu blog/website. Di sini, pengunjung blog/website bisa menyampaikan beberapa kritik, saran atau pertanyaan yang berkaitan dengan blog/website tersebut. Para blogger lain banyak yang mengisi halaman ini cukup simpel yaitu dengan menulis sedikit deskripsi lalu menyertakan link akun jejaring sosila mereka seperti Facebook, Twitter, Google+ dan lain sebagainya.

        Tapi di sini Saya akan buat sebuah laman Contact Forum atau Contact Us dengan menyediakan pengisian data pribadi dan jenis kiriman.

        Untuk melihat contohnya, klik di sini!

        Jika Sobat tertarik, silahkan ikuti langkah berikut:

        1. Daftar akun di 123contactform klik di sini
        2. Isi data dengan benar atau login dengan pihak lain. Lihat gambar di bawah:

         3. Setelelah pendaftaran  sukses, pilih menu DASHBOARD => Create New Form => Contact Form
        4. Buat judul Forum lalu klik OK
        5. Selanjutnya Sobat bisa edit tampilan, jenis yang ditampilkan dan sebagainya lalu klik Continue
        6. Sesuaikan pengaturan Contact Us Sobat lalu klik Continue
        7. Di halaman publish form pilih menu Blogger. Lebih jelasnya lihat gbr di bawah:

        Blogger Trick, Widget

        Sesuai gambar di atas, Sobat juga bisa melihat hasilnya sebelum laman tersebut diletakkan di laman blog dengan mengklik Live Demo.

        8. Copy kode script di atas dan paste ke laman blogger Sobat.
        9. Klik publikasikan dan lihat hasilnya.

        Untuk meletakkan kode script tersebut ke laman blogger, ikuti langkah berikut:

        1. Login ke blogger
        2. Pada dashboard, pilih laman dan buat sebuah laman kosong
        3. Pada laman kosong tersebut pilih HTML dan pastekan kode script di atas lalu klik publikasikan
        5. Selesai dan lihat hasilnya. 

        Ket: Untuk mengetahui kiriman yang masuk, silahkan masuk ke akun 123contactform. Pilih Menu My Forms lalu pilih Submissions.

        Cukup sekian, pengunjung blog Sobat sekarang bisa mengajukan kritik, saran maupun pertanyaan melalui laman khusus yang tersedia. Dengan cara ini pengunjung blog bisa lebih sportif  menghubungi Admin.

        Rabu, 24 April 2013

        Sebelum Saya berangkat ujian, Saya sempatkan menulis sebuah artikel tentang Cara Membuat Akun Atau ID Feedburner. Adapun Feedburner itu ialah sebuah layanan dari google yang bisa digunakan untuk belangganan artikel, widget artikel dan masih banyak lagi, itu semua ada di menu Feedburner.  Buat Sobat yang belum tau cara daftarnya silahkan ikuti langkah berikut.

        1. Login ke akun Google atau Blogger
        2. Login ke akun Feedburner layann dari google, untuk lebih mudah klik di sini
        3. Langkah selanjutnya, silahkan ikuti panduan gambar di bawah ini:

        url blog
        Gambar 1



         Pada halaman gambar 1, isi URL blog Sobat lalu klik Next.

        pilih salah satu
        Gambar 2
        Untuk gambar yang ke 2 ini silahkan pilih yang sobat inginkan lalu klik Next

        id feedburner
        Gambar 3
         Pada gambar ini, ID Feedburner Sobat adalah yang ditunjukkan tanda panah. Klik Next

        link feedburner
        Gambar 4
         Gambar 4 ini yang ditunjukkan tanda panah adalah link Feedburner. Klik Next

        centang kotak hitam jika diperlukan
        Gambar 5
        Pada gambar ini, silahkan pilih pada kotak hitam lalu klik Next

        id feedburner sukses dibuat
        Gambar 6

        Pada gambar 6 ini halaman dialog dari Feedburner bahwa pendaftaran sukses. Dan di sini Sobat bisa menambahkan widge Feedburner ke blog Sobat yang ada pada menu Feedburner.

        4. Pendaftaran Feedburner selesai

        Cukup sekian yang dapat Saya posting tentang Cara Membuat Akun Atau ID Feedburner , soalnya Saya mau berangkat ujian. Ada pertanyaan? Kotak komentar masih tersedia di bawah, silahkan tulis komentar Sobat...!

        Selasa, 23 April 2013

        menu tab slider
        Image : www.se-cara.blogspot.com
        Untuk artikel  kali ini Saya akan posting mengenai Cara Membuat Menu Tab Slider di Sidebar Blog. Di sini saya tidak menjelaskan lebih rinci apa itu Menu Tab Slider, tapi Sobat bisa lihat contohnya di sidebar Saya atau gambar di atas. Kode script ini Saya ambil dari www.maskolis.com. Silahkan ikuti langkah berikut jika Sobat tertarik dengan widget ini:

        1. Login ke akun Blogger
        2. Pilih Tata Letak => Tambahkan Gadget
        3. Pilih HTML/JavaScript
        4. Copy kode di bawah ini:

        <style type="text/css">
        #accordion{width:100%;margin:auto;border:0px solid white}
        #accordion h2{padding:5px 10px;background-color:#ccc;background-image: url(http://1.bp.blogspot.com/-qtI_UsPdZwc/Tmzg5K8eADI/AAAAAAAABrU/ScrT9X8fBBY/s1600/arrow_right.gif);background-repeat: no-repeat;background-position: right center;color:#000;font:normal 11px Tahoma;border-bottom:1px solid #FFF;cursor:pointer;}
        #accordion .content{font:normal 11px Arial;padding:5px 10px;background:#eee;}
        #accordion .content ul {list-style:none;margin:0 0 0;padding:0 0 0;}
        #accordion .content li {background-image: url(); background-repeat: no-repeat;background-position: left center;margin:0;padding:2px 0 3px 0;text-indent:0px;border-bottom:1px dotted #ccc;line-height:1.3em;}
        #accordion .content li a:hover {text-decoration:none;color:#000;}
        #accordion h2.active{background-color:#bbb;background-image: url(http://2.bp.blogspot.com/-9If6SXYDklM/Tmzg4W8YwuI/AAAAAAAABrQ/XlCiTeVqtq0/s1600/arrow_down.gif);background-repeat: no-repeat;background-position: right center;font-weight:bold;}
        </style>
        <script type="text/javascript" src="http://yourjavascript.com/121511228073/accordion-menu.js"></script>
        <script type='text/javascript'>
        $(function() {
        $('#accordion .content').hide();
        $('#accordion h2:first').addClass('active').next().slideDown('slow');
        $('#accordion h2').click(function() {
        if($(this).next().is(':hidden')) {
        $('#accordion h2').removeClass('active').next().slideUp('slow');
        $(this).toggleClass('active').next().slideDown('slow');
        }
        });
        });
        </script>
        <div id="accordion">
        <h2>Judul Tab 1</h2>
        <div class="content">


        Isi konten di sini


        </div>
        <div id="accordion">
        <h2>
        Judul Tab 2</h2>
        <div class="content">


        Isi kontendi sini


        </div>
        <div id="accordion">
        <h2>
        Judul Tab 3</h2>
        <div class="content">


        Isi konten di sini


        </div>
        <div id="accordion">
        <h2>
        Judul Tab 4</h2>
        <div class="content">


        Isi kontendi sini


        </div>
        <div id="accordion">
        <h2>
        Judul Tab 5</h2>
        <div class="content">


        Isi kontendi sini


        </div>
        </div></div></div></div></div>


        Ket: Yang berwarna hijau silahkan ganti dengan judul tab dan isi konten Sobat. Isi konten misalnya: kode script iklan, script artikel, komentar atau script widget lainnya.
        Untuk warna dan ukuran pixelnya  bisa di sesuaikan dengan keinginan Sobat.

        5. Klik simpan.

        Sekian.