Rabu, 10 November 2010

Cara Memasang Menu dan Submenu Di Blog

Dalam posting [kali] ini saya akan share Cara Memasang Menu dan Submenu Di Blog. Saya akan mencoba berbagi pengalaman kepada sobat blogger.

Dan ini juga termaksud salah satu cara mempercantik/memperindah blog sobat blogger dengan modifikasi-modifikasi menggunakan Trik-Trik Blogger. Mungkin bagi sobat yang sudah lama menggunakan blogger sudah tidak asing lagi dengan apa yang akan saya share [kali] ini, tapi mungkin bagi blogger pemula seperti saya ini masih perlu mempelajari hal yang seperti ini.

Oky..., Jika sobat blogger ingin mengetahui bagaimana Cara Memasang Menu dan Submenu Di Blog, lebih tepatnya cara pasang Menu dan Submenu Di Blog (Menu Horizontal di blog kita).


Ikuti langkah-langkah berikut : 
  • Pertama silahkan kunjungi website berikut : http://www.mycssmenu.com/ .

  • Di halaman utama web tersebut akan kita temui berbagai macam variasi betuk menu horizontal maupun yang vertical. Kita tinggal pilih yang mana yang akan sobat gunakan. 
  • Perhatikan pada gambar berikut ini, saya ambil satu contoh saja. 
  • Untuk mengambil kode dan mengatur tampilan Menu Horizontal silahkan [kali] customize.

  • Setelah di [kali] akan muncul jendela baru.
    Maka akan terlihat tampilan seperti berikut :

  • Double [kali] satu per satu menu atau sub menu untuk menentukan target pencaharian. 
    Seperti contoh  tampilan berikut :
    • Mohon Di isi pada kotak dialog bagian "URL" misalnya http://www.blogger.com/post-title.g?blog=2564568286445614 untuk menuju ke alamat tersebut. Sedangkan untuk kotak target dan title text (Boleh tidak diisi/kosong).

    • Setelah semua [link] menu dan submenu selesai dibuat (di [link] kan) dan sebaiknya semua [link] harus sudah ter [link] supaya proses peng-copyan Kode HTML atau CSS hanya dilakukan satu kali saja.

    • Proses selanjutnya klik pada tab HTML . Copy kode HTMLnya .

    • Log in ke Blogger anda. => Blogger.com

    • Pilih Rancangan.

    • Pilih Tambah Gadget.

    • Paste kode yang sobat Copy tadi.

    • Kemudian Save. Lihat Hasilnya dech....!!

      Semoga Bermanfaat.....!!


      EnaL Rhay SyahRinggan Next..>>
      READ MORE - Cara Memasang Menu dan Submenu Di Blog

      Selasa, 02 November 2010

      Memasang Emoticon Smiley Untuk Komentar Blog

      Semakin meningkatknya para komentator di blogger dan semakin meningkatnya pula keinginan sobat blogger untuk mengubah tampilan di area komentar atau menambah pernak-pernik lainya. Maka dari itu saya juga ingin membuat pernak-pernik komentar di blogger dengan Emoticon Smiley sehingga para komentator bisa mengexpresikan ucapanya dengan sebuah gambar Emoticon Smiley.


      Nach.. posting saya kali ini yaitu cara memodifikasi Blogspot sobat Blogger agar tampak menarik, tapi kali ini saya akan share tentang cara Memasang Emoticon Smiley Untuk Komentar Blog.

      Lihat gambar dibawah ini :

      :)):)];));;):D;):p:((:):(:X=((:-o:-/:-*
      :|8-}~x(:-tb-(:-Lx(=))


      Gambarnya kurang lebih seperti diatas, teks atau tulisan yang disamping kanan gambar adalah symbol yang jika ditulis di kotak komentar akan berubah menjadi gambar yang ada disamping kirinya.

      Okey....capeg juga low cerita panjang lebar..!! Hufttttt....... :D
      Jika sobat blogger tertarik untuk memasangnya silahkan ikuti langkah-langkah berikut :
      • Seperti biasa Log in ke Blogger anda. => Blogger.com
      • Pilih Tata Letak/Edit HTML.
      • Jangan lupa centang pada Expand Widget Templates
      • Cari Kode </body> (Gunakan saja pencarian cepat => Ctrl + F) 
      • Copy paste kode Script di bawah ini. Taruh kode Script di bawah ini tepat di atas kode </body>

      <script src='http://sites.google.com/site/anasceria/smiley.js' type='text/javascript'/>

      • Kalau sudah, sobat cari kode seperti di bawah ini :

      <p class='comment-footer'>
      <b:if cond='data:post.embedCommentForm'>
      <b:if cond='data:post.allowNewComments'>
      <b:include data='post' name='comment-form'/>
      <b:else/>
      <data:post.noNewCommentsText/>

      • Kemudian selipkan kode Skript di bawah ini diantara kode berwarna biru dan orange atau tepatnya di bawah kode <p class='comment-footer'>

      <b><img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/21.gif'/>
      :))
      <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/100.gif'/>
      :)]
      <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/71.gif'/>
      ;))
      <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/5.gif'/>
      ;;)
      <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/4.gif'/>
      :D
      <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/3.gif'/>
      ;)
      <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/10.gif'/>
      :p
      <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/20.gif'/>
      :((
      <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/1.gif'/>
      :)
      <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/2.gif'/>
      :(
      <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/8.gif'/>
      :X
      <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/12.gif'/>
      =((
      <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/13.gif'/>
      :-o
      <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/7.gif'/>
      :-/
      <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/11.gif'/>
      :-*
      <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/22.gif'/>
      :|
      <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/35.gif'/>
      8-}
      <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/102.gif'/>
      ~x(
      <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/104.gif'/>
      :-t
      <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/66.gif'/>
      b-(
      <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/62.gif'/>
      :-L
      <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/14.gif'/>
      x(
      <img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif'/>
      =))</b>


      • Nah...kalou sudah, Simpan hasil kerja sobat...dan lihat hasilnya.

      EnaL Rhay SyahRinggan Next..>>
      READ MORE - Memasang Emoticon Smiley Untuk Komentar Blog

      Jumat, 29 Oktober 2010

      Cara Membuat Daftar Isi Blog


      Cara Membuat Daftar Isi Blog

      Okey....salam jumpa lagi sobat blogger. Pembahasan kali ini adalah bagaimana Cara Membuat Daftar Isi Blog pada Blogspot. Ini juga termaksud salah satu cara memodifikasi blogspot sobat dengan Trik-Trik Blogger.




      Dalam posting kali ini saya akan membagi pengetahuan dan sekaligus share Cara Membuat Daftar Isi Blog pada blogspot. Dengan demikian pengunjung blogspot dapat melihat keseluruhan dari posting-posting yang telah anda publikasikan. Cara Membuat Daftar Isi Blog kali ini gak sulit kog'...dan jika sobat tertarik untuk memasangnya di Blog sobat, silahkan sobat ikuti langkah-langkahnya.

      Langka-langkah yang harus anda lakukan..:
      • Log in ke Blogger Anda.
      • Pilih Tata Letak/Rancangan.
      • Pilih Edit HTML.
      • Download Full Template, untuk membackup template sobat, jika terjadi kesalahan.
      • Beri tanda centang pada Expand Template Widget
      • Cari kode seperti di bawah ini : => sobat juga bisa gunakan pencarian cepat (Ctrl + F)

        <b:includable id='main' var='top'>
        <!-- posts -->
        <div class='blog-posts'>
        <b:loop values='data:posts' var='post'>
        <b:if cond='data:post.dateHeader'>
        <h2 class='date-header'><data:post.dateHeader/></h2>
        </b:if>
        <b:include data='post' name='post'/>
        <b:if cond='data:blog.pageType == "item"'>
        <b:if cond='data:post.allowComments'>
        <b:include data='post' name='comments'/>
        </b:if>
        </b:if>
        </b:loop>
        </div>

        <!-- navigation -->
        <b:include name='nextprev'/>

        <!-- feed links -->
        <b:include name='feedLinks'/>
        </b:includable>

        • Kalau sudah dapat, kemudian sobat ganti dengan kode dibawah ini :

        <b:includable id='main' var='top'>
        <!-- posts -->
        <div class='blog-posts'>
        <!-- on a label page, add a header saying 'Contents' -->
        <b:if cond='data:blog.homepageUrl != data:blog.url'>
        <b:if cond='data:blog.pageType != "item"'>
        <b:if cond='data:blog.pageType != "archive"'>
        <h2 class='date-header'>Contents</h2>
        </b:if>
        </b:if>
        </b:if>
        <!-- Start loop for displaying posts here -->
        <b:loop values='data:posts' var='post'>
        <!-- Date-headers are only displayed if on main, item or archive page -->
        <!-- If on label-page, then no date-header -->
        <b:if cond='data:blog.homepageUrl == data:blog.url'>
        <b:if cond='data:post.dateHeader'>
        <h2 class='date-header'><data:post.dateHeader/></h2>
        </b:if>
        <b:else/>
        <b:if cond='data:blog.pageType == "item"'>
        <b:if cond='data:post.dateHeader'>
        <h2 class='date-header'><data:post.dateHeader/></h2>
        </b:if>
        <b:else/>
        <b:if cond='data:blog.pageType == "archive"'>
        <b:if cond='data:post.dateHeader'>
        <h2 class='date-header'><data:post.dateHeader/></h2>
        </b:if>
        </b:if>
        </b:if>
        </b:if>
        <!-- Here we start displaying the posts. -->
        <!-- If we are on a label page, only the posttitle is displayed -->
        <!-- On other pages the entire post is displayed -->
        <b:if cond='data:blog.homepageUrl != data:blog.url'>
        <b:if cond='data:blog.pageType != "item"'>
        <b:if cond='data:blog.pageType != "archive"'>
        <a expr:href='data:post.url'><data:post.title/></a><br/>
        <b:else/>
        <b:include data='post' name='post'/>
        </b:if>
        <b:else/>
        <b:include data='post' name='post'/>
        </b:if>
        <b:else/>
        <b:include data='post' name='post'/>
        </b:if>
        <!-- If on item page display comments -->
        <b:if cond='data:blog.pageType == "item"'>
        <b:if cond='data:post.allowComments'>
        <b:include data='post' name='comments'/>
        </b:if>
        </b:if>
        </b:loop>
        </div>

        <!-- navigation -->
        <b:include name='nextprev'/>

        <!-- feed links -->
        <b:include name='feedLinks'/>
        </b:includable>

        • Jika proses peng-copyan sudah selesai, sobat Save hasil kerja sobat.
        • Nah, blom selesai sampai disini......Langkah selanjutnya adalah sobat menentukan letaknya pada blog sobat.
        • Pilih Tata Letak/Layout.
        • Pada halaman Page Element/Elemen Laman.
        • [Klik] Add a Gadget.
        • Pilih Link List. Lalu tentukan judul link sobat.
        • Pada New Site URL masukkan kode berikut ini :

        http://Alamat URL Blog Sobat/search/label/?max-results=999

        • Ganti tulisan yang berwarna merah "Alamat URL Blog Sobat"  dengan alamat URL Blog sobat.
        • Kemudian Save dech....!! Coba sobat lihat hasilnya...
        Semoga Bermanfaat....!!


        EnaL Rhay SyahRinggan Next..>>
        READ MORE - Cara Membuat Daftar Isi Blog

        Selasa, 07 September 2010

        Membuat Post & Comment Counter Di Blog

        Membuat Post & Comment Counter Di Blog
        Hay...Jumpa lagi dengan sobat blogger, kali ini saya akan share salah satu cara memodifikasi blogspot tepatnya memasang Blog Accessories pada blog sobat.

        Salah satu Blog Accessories yang saya maksud tadi adalah cara Membuat Post & Comment Counter Di Blog dengan menggunakan kode script. 

        Dengan menggunakan kode script yang saya tampilkan dibawah, dengan otomatis jumlah posting yang telah dipublikasikan akan muncul pada tempat yang anda inginkan di blogspot sobat, misalnya di sidebar blog soba. Sama halnya dengan comment counter, dengan otomatis jumlah comment akan muncul di Blog sobat.

        Langsung saja ikuti langkah-langkah berikut :
        • Seperti biasa Log in ke Blogger anda [klik] disini.
        • Pilih Tata Letak/Layout.
        • Pada halaman Page Element/Elemen Laman.
        • [Klik] Add a Gadget.
        • Pilih HTML/Javascript.
        • Copy code di bawah ini dan paste ke dalam HTML/Javascript tersebut.

        Script Post Counter
        <script style="text/javascript">
        function showpostcount(json) {
        document.write('Total Posts : <b>' + parseInt(json.feed.openSearch$totalResults.$t,10)
        + '</b><br>');}</script>
        <script src="http://namablogsobat.blogspot.com/feeds/posts/default?alt=json-in-script&callback=showpostcount"></script>

        Script Comment Counter
        <script style="text/javascript"></script>
        <script style="text/javascript">
        function numberOfComments(json) {
        document.write('Total Comments : <b>' + json.feed.openSearch$totalResults.$t +
        '</b><br>');}</script>
        <script src="http://namablogsobat.blogspot.com/feeds/comments/default?alt=json-in-script&callback=numberOfComments"></script>

        • Ganti tulisan yang berwarna merah "http://namablogsobat.blogspot.com/"  dengan URL Blog sobat.
        • Kemudian Save hasil kerja sobat,,,, Coba sobat lihat hasilnya..!!
        Semoga bermanfaat...


        EnaL Rhay SyahRinggan Next..>>
        READ MORE - Membuat Post & Comment Counter Di Blog

        Kamis, 02 September 2010

        Menghilangkan Judul Blog Di Header

        Judul blog memberikan informasi tentang blog kita dan sangat penting dalam search engine. Namun jika kita membuat background header yang unik, bagus dan keren tapi di blogger judul blog tampak di header menurut kita akan mengganggu pemandangan background header kita.

        Nah...Dalam posting kali ini saya akan share cara Menghilangkan Judul Blog Di Header
        Ach...mda usah panjang lebar....Langsung aja ikuti langkah-langkahnya :

        • Seperti biasa Log in ke Blogger anda. => Blogger.com
        • Pilih Tata Letak/Edit HTML.
        • Cari Kode dibawah ini : (Gunakan saja pencarian cepat => Ctrl + F)

        #header h1 {
        font:$pagetitlefont;
        letter-spacing:0;
        margin:0;
        padding:21px 20px 3px;
        text-shadow:0 1px 0 #000000;
        text-transform:none;
        }


        Nach.. tambahkan kode CSS visibility:hidden; ke dalam kode CSS di atas sehingga hasilnya akan terlihat seperti di bawah ini :


        #header h1 {
        font:$pagetitlefont;
        letter-spacing:0;
        margin:0;
        padding:21px 20px 3px;
        text-shadow:0 1px 0 #000000;
        text-transform:none;
        visibility:hidden;
        }

        Nach...Kamu simpan dech, dan lihat hasilnya...!!

        EnaL Rhay SyahRinggan Next..>>
        READ MORE - Menghilangkan Judul Blog Di Header

        Rabu, 21 Juli 2010

        Cara Membuat CBox / Buku Tamu di Samping Blog


        Hay sobat blogger.....kali ini saya ingin berbagi pengetahuan sekalian ingin share cara membuat CBox pada blog yang biasanya disebut dengan Buku Tamu,,,Hahayyyy....

        Tapi kali ini CBox yang saya akan share yaitu CBox atau biasanya disebut dengan Buku Tamu bukan  yang  sering kali kita lihat di area widget pada blog, Namun CBox yang akan saya Share yaitu CBox yang tepatnya  berada di posisi samping blog sobat.....

        Okey...Jika sobat blogger tertarik dengan Cara Membuat CBox / Buku Tamu di Samping Blog ikuti langkah-langkahnya....!!!!

        • Seperti biasa Log in ke Blogger anda [klik] disini.
        • Pilih Tata Letak/Layout.
        • Pada halaman Page Element/Elemen Laman.
        • [Klik] Add a Gadget.
        • Pilih HTML/Javascript.
        • Copy code di bawah ini dan paste ke dalam HTML/Javascript tersebut.


        <style type="text/css">
        #gb{
        position:fixed;
        top:50px;
        z-index:+1000;
        }
        * html #gb{position:relative;}
        .gbtab{
        height:200px;
        width:30px;
        float:left;
        cursor:pointer;
        background:url('http://th387.photobucket.com/albums/oo318/cem_ply/th_buku-tamu_03.gif') no-repeat;
        }
        .gbcontent{
        float:left;
        border:2px solid #F5F5F5;
        background:#000000;
        padding:10px;
        }
        </style>
        <script type="text/javascript">
        function showHideGB(){
        var gb = document.getElementById("gb");
        var w = gb.offsetWidth;
        gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
        gb.opened = !gb.opened;
        }
        function moveGB(x0, xf){
        var gb = document.getElementById("gb");
        var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
        var dir = xf>x0 ? 1 : -1;
        var x = x0 + dx * dir;
        gb.style.right = x.toString() + "px";
        if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
        }
        </script>
        <div id="gb">
        <div class="gbtab" onclick="showHideGB()"> </div>
        <div class="gbcontent">
        <!-- BEGIN CBOX - www.cbox.ws - v001 -->
        <div id="cboxdiv" style="text-align: center; line-height: 0">
        <div><iframe frameborder="0" width="200" height="305" src="http://www3.cbox.ws/box/?boxid=3261541&amp;boxtag=f2qtm9&amp;sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain3-3261541" style="border:#0A19F7 1px solid;" id="cboxmain3-3261541"></iframe></div>
        <div><iframe frameborder="0" width="200" height="75" src="http://www3.cbox.ws/box/?boxid=3261541&amp;boxtag=f2qtm9&amp;sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform3-3261541" style="border:#0A19F7 1px solid;border-top:0px" id="cboxform3-3261541"></iframe></div>
        </div>
        <!-- END CBOX -->
        <br/>
        <a href="http://forantum.blogspot.com">.
        </a>
        <div style="text-align:right">
        <a href="javascript:showHideGB()">
        [Hide]
        </a>
        </div>
        </div>
        </div>
        <script type="text/javascript">
        var gb = document.getElementById("gb");
        gb.style.right = (30-gb.offsetWidth).toString() + "px";
        </script>

        • Sobat juga bisa merubah warna dan posisi tempatnya sesuai keinginan sobat.
        • [Klik] Save...!! 
        • Selesai dech....Oya, harap tinggalkan Commennya yach...!!


        EnaL Rhay SyahRinggan Next..>>
        READ MORE - Cara Membuat CBox / Buku Tamu di Samping Blog

        Selasa, 29 Juni 2010

        Cara Mengganti Background Pada Blog

        Cara Mengganti Background Pada Blog
        Dalam posting kali ini saya akan menunjukkan Cara Mengganti Background Pada Template Blog. Pada umumnya template yang kita download memiliki background yang sudah cukup bagus, tapi mungkin masih ada sebagian Blogger yang ingin menggantinya dengan background kreasi sendiri dengan menambahkan gambar animasi bergerak juga bisa kita lakukan.

        Baiklah tanpa basa-basi lagi saya akan memberikan triknya..
        • Seperti biasa Log in ke Blogger anda.
        • Pilih Dashboard Blogger anda 
        • Kemudian [klik] Layout - Edit HTML. Untuk berjaga-jaga sebaiknya backup dulu template anda.
        • Kemudian carilah kode ini body { :
        Lihat contoh di bawah ini :


        body {
         background:#000000 url('http://i1185.photobucket.com/albums/z354/Enal_Rhay_SyahRenggan/th_EnalRhaySyahRinggan1.jpg');
         margin:0;

        Ket :

        1. Kode yang berwarna merah (#000000) adalah kode warna (Boleh di ubah
            sesuai selera anda).
        2. Kode yang ini (http://i1185.photobucket.com/albums/z354/
            Enal_Rhay_SyahRenggan/th_EnalRhaySyahRinggan1.jpg) adalah alamat
            Url Gambar, Anda juga bisa menggantinya dengan Url gambar pilihan anda.
          • Setelah diganti, anda lihat dulu [klik] Pratinjau, jika berhasil [klik] Simpan Template
          Selamat mencobanya....!!!!!


          EnaL Rhay SyahRinggan Next..>>
          READ MORE - Cara Mengganti Background Pada Blog

          Minggu, 27 Juni 2010

          Membuat Tulisan Address Bar Berjalan


          Membuat Tulisan Address Bar Berjalan
          Hay,, Sobat Blogger....
          Okey, kali ini saya akan memberikan tips-tips memodifikasi blogger. Salah satunya yaitu tentang bagamana cara membuat posting sahabat blogger agar tampak lebih menarik para pengunjung. Dalam posting kali ini saya akan membahas tentang Cara Membuat Tulisan Address Bar Berjalan.........!!

          Selama ini kita hanya bisa membuat tulisan berjalan dengan merquee di area blog, seperti di postingan, sinebar, footer, header, dll. Tapi,untuk kali ini sobat bisa menerapkannya di address bar Blog sobat. Tulisan ini berjalan tanpa hentinya di address blog sobat sehingga tampak kelihatan menarik/terkesan melihatnya dan pengunjung pun tidak akan bosan.

          Sobat bisa mengganti tulisan yang berjalan sesuai dengan keinginan sobat...
          Untuk sobat, ini tidak terlalu sulit kita hanya menambahkan sedikit kode CSS di template kita. Dari pada penasan langsung aja ya di praktekkan.



          Jika sobat Blogger tertarik, silahkan ikuti langkah-langkahnya.
          Okey,, langsung ajah sahabat blogger :
          • Seperti biasa Log in ke Blogger anda. => Blogger.com
          • Pilih Tata Letak/Edit HTML.
          • Cari Kode </head> dan 
          • Copy script di bawah ini kemudian pastekan tepat di atas kode </head>



          <script type='text/javascript'>
          //<![CDATA[
          msg = " --- Welcome to My Blog--- ";
          msg = " **Enal Rhay SyahRinggan** " + msg;pos = 0;
          function scrollMSG() {
          document.title = msg.substring(pos, msg.length) + msg.substring(0, pos); pos++;
          if (pos > msg.length) pos = 0
          window.setTimeout("scrollMSG()",100);
          }
          scrollMSG();
          //]]>
          </script>


          Ket :

          • Lihat Tulisan yang berwarna biru, sobat bisa menggantinya sesuai keinginan sobat dan itulah tulisan yang akan muncul di Address bar sobat.

          4. Simpan Template.

          Wetzzzzzzz...Ingat, tinggalkan Commennya juga yach...

          EnaL Rhay SyahRinggan Next..>>
          READ MORE - Membuat Tulisan Address Bar Berjalan

          Selasa, 15 Juni 2010

          Membuat Judul Posting Berjalan


          Dalam posting yang kali ini saya buat yaitu membahas tentang bagamana cara membuat judul postingan bisa bergerak/berjalan....???

          Okey,, dengan cara yang sederhana untuk membuat judul posting pada blog berjalan.....Hasil yang nanti akan kita dapat sama seperti membuat teks berjalan dengan kode marquee atau seperti judul blog berjalan yang menggunakan Java script.

          Baiklah tanpa basa-basi lagi saya akan memberikan triknya..
          • Seperti biasa Log in ke Blogger anda.
          • Pilih Dashboard Blogger anda 
          • Kemudian klik Layout - Edit HTML. Untuk berjaga-jaga sebaiknya backup dulu template anda.
          • Klik pada Expand widget templates dan carilah kode dibawah ini:

          <b:includable id='post' var='post'>
          <div class='post hentry uncustomized-post-template'>
          <a expr:name='data:post.id'/>
          <b:if cond='data:post.title'>
          <h3 class='post-title entry-title'>
          <b:if cond='data:post.link'>
          <a expr:href='data:post.link'><data:post.title/></a>
          <b:else/>
          <b:if cond='data:post.url'>
          <a expr:href='data:post.url'><data:post.title/></a>
          <b:else/>
          <data:post.title/>
          </b:if>
          </b:if>
          </h3>
          </b:if>

          Kemudian pasangkan kode marquee sehingga kode lengkap..
          Dan hasil perubahan akan seperti dibawah ini:

          <b:includable id='post' var='post'>
          <div class='post hentry uncustomized-post-template'>
          <a expr:name='data:post.id'/>
          <b:if cond='data:post.title'>
          <marquee direction='left'><h3 class='post-title entry-title'>
          <b:if cond='data:post.link'>
          <a expr:href='data:post.link'><data:post.title/></a>
          <b:else/>
          <b:if cond='data:post.url'>
          <a expr:href='data:post.url'><data:post.title/></a>
          <b:else/>
          <data:post.title/>
          </b:if>
          </b:if>
          </h3>
          </marquee>
          </b:if>

          Ket :
          Teks yang berwarna merah adalah kode yang harus anda tambahkan. Anda dapat merubah arah dengan mengganti kode left menjadi right.
          Klik tombol Preview untuk melihat hasilnya.
          Jika hasilnya memuaskan maka silahkan simpan hasil kerja anda.

          Selamat Mencoba...........!!!!!!!!

          EnaL Rhay SyahRinggan Next..>>
          READ MORE - Membuat Judul Posting Berjalan

          Cara Membuat Posting Title Berjalan


          Hay,, Sahabat Blogger....
          Okey, kali ini saya akan memberikan tips-tips memodifikasi blogger. Salah satunya yaitu tentang bagamana cara membuat posting sahabat blogger agar tampak lebih menarik para pengunjung. Dalam posting kali ini saya akan membahas tentang Cara Membuat Posting Title Berjalan, namun kurang tepat jika dikatakan Recent Post....tp gak apa-apa juga sich...

          Recent Post Title ini merupakan tool yang bukan hanya menampilkan judul-judul posting kita yang baru bahkan judul-judul posting lama kita pun akan muncul, jadi posting-posting lama kita bisa dilihat lagi dech sama pengunjung Blogger.

          Code Recent Post ini akan menghasilkan daftar-daftar posting yang berurutan kesamping, agar dapat menghemat ruang pada blog kita.

          Jika sahabat Blogger tertarik pada Recent Post Title ini silahkan ikuti langkah-langkahnya.
          Okey,, langsung ajah sahabat blogger :

          • Seperti biasa Log in ke Blogger anda.
          • Pilih Tata Letak/Layout.
          • Pada halaman Page Element/Elemen Laman, klik Add a Gadget.
          • Pilih HTML/Javascript.
          •  Copy code di bawah ini dan paste ke dalam HTML/Javascript tersebut.




          • Ganti angka (350) di atas sesuai ukuran yang anda inginkan.
          • Ganti tulisan (http://nama-blog-anda.blogspot.com) dengan alamat URL Blog anda.
          • Angka 2 pada (scrollamount="2") menerangkan kecepatan, bisa anda sesuaikan dengan keinginan anda.
          • Tekan SAVE untuk menyimpannya.
          • Nah....Coba anda lihat hasilnya.....

           EnaL Rhay SyahRinggan Next..>>
            READ MORE - Cara Membuat Posting Title Berjalan

            Sabtu, 12 Juni 2010

            Mengubah Blog No Follow Menjadi Do Follow

            Dalam posting kali ini saya akan membahas tentang masalah bagaimana cara merubah no follow menjadi do follow...?? Bagi sobat blogger yang dah senior sich menganggap posting ini tidak populer lagi, tapi ini juga bisa berguna bagi sobat blogger pemula seperti saya ini.

            Nach,,,timbul dech pertanyaan.....
            "Apa sich kegunaan dari do follow itu...?? Apa untungnya buat blog kita..??" Pusing juga tuh.... pertama kali dapat pertanyaan kayak gitu...!! Tapi akhirnya saya dapat juga jawabannya dech...

            Kegunaan dari Do Follow yaitu :
            1. Google dapat mendeteksi alamat blog yang berkomentar menjadi linkback.
            2. Bisa meningkatkan jumlah komentar, karena dengan meninggalkan komentar bisa meningkatkan jumlah backlink ke blog sahabat yang memberikan komentar pada blog kita.
            3. Dan tentunya page rank kita akan cepat meningkat karena makin banyak backlink.

            Jika sobat Blogger tertarik, silahkan ikuti langkah-langkahnya.
            Okey,, langsung ajah sahabat blogger :

            • Seperti biasa Log in ke Blogger anda. [klik]=> Blogger.com
            • Pilih Tata Letak/Edit HTML.
            • [Klik] Download Full Template untuk mem-backup template sobat jika terjadi kesalahan.
            • Beri tanda centang pada Expand Template Widget.
            • Cari Kode di bawah ini :

            <a expr:href='data:backlink.url'rel='nofollow'><data:backlink.title/></a>

            Jika sudah ketemu hapus tulisan yang berwarna merah sehingga akan menjadi seperti dibawah ini :

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


            Kemudian cari lagi code seperti dibawah :

            <a expr:href='data:comment.authorUrl'rel='nofollow'><data:comment.author/></a>   

            Jika sudah ketemu hapus tulisan yang berwarna merah sehingga akan menjadi seperti dibawah ini :

            <a expr:href='data:comment.authorUrl'><data:comment.author/></a>


            • Nach jika sudah, [klik] Save Template.
            Simpan juga Commennya yach...!!!


            EnaL Rhay SyahRinggan Next..>>

            READ MORE - Mengubah Blog No Follow Menjadi Do Follow

            Rabu, 09 Juni 2010

            Cara Memasangkan Feed ke Blog


            Bagaimana caranya kita dapat mengetahui perkembangan atau update terbaru dari blog yang kita inginkan, apa ada yang bisa kita pasangkan/memasang sesuatu pada blog kita sendiri agar dapat melihat perkembangan Update terbaru yang kita inginkan....>>


            Ok...Sobat blogger dapat melihat semua perkembangan Update terbaru pada blog sobat dan hanya dengan satu cara yaitu memakai RSS feed. 


            Apa itu RSS? 
            RSS singkatan dari Rich Site Summary atau jika dalam bahasa indonesia adalah ringkasan dari isi sebuah situs dan Blog juga menjadi salah satu yang termaksud di dalamnya Feed.

            Dalam posting berikut ini, saya akan membahas tentang Cara Memasangkan Feed ke Blog. Bagi sobat yang ingin tahu lebih lanjut tentang masalah di atas sobat bisa membacanya di RSS-Wikipedia.

            Sekarang bagaimana cara memasang kode feed di blog milik kita.....???
            Bagi anda yang menggunakan template baru atau new blogger template caranya sangat mudah. Silahkan ikuti langkah-langkah berikut ini :

            1. Log in ke Blogger Anda.
            2. Pilih Tata Letak.
            3. Tambah Gadget dan pilih Feed.
            4. Tulis alamat ini pada kotak di samping tulisan URL feed (http://blogenalrhaysyahringgan.blogspot.com/atom.xml)
            5. Klik tombol Simpan.
            6. Pindahkan Gadget yang baru saja di buat pada tempat yang dikehendaki
            7. Klik tombol Simpan
            8. Klik tulisan Lihat Blog untuk melihat hasil penambahan elemen yang baru di buat
            9. Selesai....!!!




            Ok....Lanjut...>>>
            Bagi sobat yang lebih mengutamakan penampilan, spring widget telah membuat suatu panel yang sangat unik sehingga akan bisa di jadikan sebagai aksesori blog (untuk template baru).

            Apabila sobat tertarik memasangnya... silahkan ikuti langkah-langkah berikut :


            1. Log in ke Blogger Anda.
            2. Pilih Tata Letak.
            3. Tambah Gadget dan pilih HTML/JavaScript.
            4. Copy paste code script di bawah ini....(paste ke HTML/JavaScript anda)



                5.  Klik tombol Simpan.
                6.  Pindahkan Gadget yang baru saja di buat pada tempat yang dikehendak.
                7.  Klik tombol Simpan.
                8.  Klik tulisan Lihat Blog untuk melihat hasil penambahan elemen yang baru di buat.
                9.  Selesai....!!!!!!!


             
            * Keterangan : 

            Mengatur menu setting agar bisa menampilkan feed. Langkah-langkahnya yaitu :
            1. Log in ke Blogger Anda.
            2. Pilih Tata Letak.
            3. Klik menu Pengaturan.
            4. Klik menu Feed situs
            5. Klik menu dropdown di samping tulisan Ijinkan Feed blog
            6. Pilih yang Penuh
            7. Klik tombol Simpan Setting
            8. Selesai....!!!!

            EnaL Rhay SyahRinggan Next..>>
            READ MORE - Cara Memasangkan Feed ke Blog

            Cara Mengganti Icon Cursor Pada Blog

             Cara Mengganti Icon Cursor Pada Blog

            Selamat datang di Blog Enal Rhay SyahRingGan.....!! Mau modifikasi blogger anda....???
            Nach sekarang saya nemuin cara memodifikasi blogger.

            Dalam posting kali ini saya akan membahas tentang cara memodifikasi blogger anda, Cara yang satu ini termaksud g' sulit kok... Kamu ikutin aja langkah-langkah Cara Mengganti Icon Cursor Pada Blog.

            Nach Langkah-langkahnya seperti biasa....yang harus anda lakukan..:

            1. Log in ke Blogger Anda.
            2. Pilih Tata Letak.
            3. Tambah Gadget dan pilih HTML/JavaScript.
            4. Copy paste code script di bawah ini....(paste ke HTML/JavaScript anda)


                  * Ket :
            • Ganti tulisan "http://img2.enal.com/img/icon18_rhay_allbkgsyahrenggan.png" dengan alamat URL Cursor Anda...

                 5.  Save...Selesai dech.....!!!!
                
                     Coba dech kamu lihat hasilnya......!!!

            EnaL Rhay SyahRinggan Next..>>
            READ MORE - Cara Mengganti Icon Cursor Pada Blog

            Cara Membuat Animasi Tulisan Pada Kursor (Berputar-putar)


            Nah...Sekarang saya mau ngasih tau bagaimana Cara Membuat Tulisan Bergerak Pada Kursor (Animasi) Blog... Sesuai dengan permintaan dari sahabat blogger yaitu Cara Membuat Animasi Tulisan Pada Kursor (Berputar-putar) pada blog.

            Malas rasanya nge-blogging tanpa ada modifikasi-modifikasi keren pada blog anda. Maka dari itu di posting kali ini saya akan membahas tentang Cara Membuat Animasi Tulisan Pada Kursor (Berputar-putar) pada blog.

            Contohnya bisa anda lihat pada gambar di bawah ini..:


            Langka-langkah yang harus anda lakukan..:
            1. Log in ke Blogger Anda.
            2. Pilih Tata Letak.
            3. Tambah Gadget dan pilih HTML/JavaScript.
            4. Copy paste code script di bawah ini....(paste ke HTML/JavaScript anda)
            <style type="text/css">
            /* Circle Text Styles */
            #outerCircleText {
            /* Optional - DO NOT SET FONT-SIZE HERE, SET IT IN THE SCRIPT */
            font-style: italic;
            font-weight: bold;
            font-family: 'comic sans ms', verdana, arial;
            color: #999;



            /* End Optional */

            /* Start Required - Do Not Edit */
            position: absolute;top: 0;left: 0;z-index: 3000;cursor: default;}
            #outerCircleText div {position: relative;}
            #outerCircleText div div {position: absolute;top: 0;left: 0;text-align: center;}
            /* End Required */
            /* End Circle Text Styles */
            </style>
            <script type="text/javascript">

            /* Circling text trail- Tim Tilton
            Website: http://www.tempermedia.com/
            Visit: http://www.dynamicdrive.com/ for Original Source and tons of scripts
            Modified Here for more flexibility and modern browser support
            Modifications as first seen in http://www.dynamicdrive.com/forums/
            username:jscheuer1 - This notice must remain for legal use
            */

            ;(function(){

            // Your message here (QUOTED STRING)
            var msg = "***eNaL Rhay SyahRingGan***";

            /* THE REST OF THE EDITABLE VALUES BELOW ARE ALL UNQUOTED NUMBERS */

            // Set font's style size for calculating dimensions
            // Set to number of desired pixels font size (decimal and negative numbers not allowed)
            var size = 24;

            // Set both to 1 for plain circle, set one of them to 2 for oval
            // Other numbers & decimals can have interesting effects, keep these low (0 to 3)
            var circleY = 0.75; var circleX = 2;

            // The larger this divisor, the smaller the spaces between letters
            // (decimals allowed, not negative numbers)
            var letter_spacing = 5;

            // The larger this multiplier, the bigger the circle/oval
            // (decimals allowed, not negative numbers, some rounding is applied)
            var diameter = 10;

            // Rotation speed, set it negative if you want it to spin clockwise (decimals allowed)
            var rotation = 0.4;

            // This is not the rotation speed, its the reaction speed, keep low!
            // Set this to 1 or a decimal less than one (decimals allowed, not negative numbers)
            var speed = 0.3;

            ////////////////////// Stop Editing //////////////////////

            if (!window.addEventListener && !window.attachEvent || !document.createElement) return;

            msg = msg.split('');
            var n = msg.length - 1, a = Math.round(size * diameter * 0.208333), currStep = 20,
            ymouse = a * circleY + 20, xmouse = a * circleX + 20, y = [], x = [], Y = [], X = [],
            o = document.createElement('div'), oi = document.createElement('div'),
            b = document.compatMode && document.compatMode != "BackCompat"? document.documentElement : document.body,

            mouse = function(e){
            e = e || window.event;
            ymouse = !isNaN(e.pageY)? e.pageY : e.clientY; // y-position
            xmouse = !isNaN(e.pageX)? e.pageX : e.clientX; // x-position
            },

            makecircle = function(){ // rotation/positioning
            if(init.nopy){
            o.style.top = (b || document.body).scrollTop + 'px';
            o.style.left = (b || document.body).scrollLeft + 'px';
            };
            currStep -= rotation;
            for (var d, i = n; i > -1; --i){ // makes the circle
            d = document.getElementById('iemsg' + i).style;
            d.top = Math.round(y[i] + a * Math.sin((currStep + i) / letter_spacing) * circleY - 15) + 'px';
            d.left = Math.round(x[i] + a * Math.cos((currStep + i) / letter_spacing) * circleX) + 'px';
            };
            },

            drag = function(){ // makes the resistance
            y[0] = Y[0] += (ymouse - Y[0]) * speed;
            x[0] = X[0] += (xmouse - 20 - X[0]) * speed;
            for (var i = n; i > 0; --i){
            y[i] = Y[i] += (y[i-1] - Y[i]) * speed;
            x[i] = X[i] += (x[i-1] - X[i]) * speed;
            };
            makecircle();
            },

            init = function(){ // appends message divs, & sets initial values for positioning arrays
            if(!isNaN(window.pageYOffset)){
            ymouse += window.pageYOffset;
            xmouse += window.pageXOffset;
            } else init.nopy = true;
            for (var d, i = n; i > -1; --i){
            d = document.createElement('div'); d.id = 'iemsg' + i;
            d.style.height = d.style.width = a + 'px';
            d.appendChild(document.createTextNode(msg[i]));
            oi.appendChild(d); y[i] = x[i] = Y[i] = X[i] = 0;
            };
            o.appendChild(oi); document.body.appendChild(o);
            setInterval(drag, 25);
            },

            ascroll = function(){
            ymouse += window.pageYOffset;
            xmouse += window.pageXOffset;
            window.removeEventListener('scroll', ascroll, false);
            };

            o.id = 'outerCircleText'; o.style.fontSize = size + 'px';

            if (window.addEventListener){
            window.addEventListener('load', init, false);
            document.addEventListener('mouseover', mouse, false);
            document.addEventListener('mousemove', mouse, false);
            if (/Apple/.test(navigator.vendor))
            window.addEventListener('scroll', ascroll, false);
            }
            else if (window.attachEvent){
            window.attachEvent('onload', init);
            document.attachEvent('onmousemove', mouse);
            };

            })();

            </script>
            * Ket :
            • Ganti  tulisan yang berwarna merah (***eNaL Rhay SyahRingGan***)dengan tulisan yang anda inginkan.
            • Ganti  tulisan yang berwarna merah (#999) dengan warna yang anda inginkan.
            Lalu simpan...selesai dech.....!!

            Coba Anda lihat hasilnya........!!!

            EnaL Rhay SyahRinggan Next..>>
            READ MORE - Cara Membuat Animasi Tulisan Pada Kursor (Berputar-putar)

            Minggu, 06 Juni 2010

            Tips Mendaftarkan Blog atau Web ke Google


            Banyak tehnik yang dipakai agar blog atau situs kita dikunjungi banyak orang. Diantaranya melakukan kegiatan blogwalking, mengunjungi situs-situs terkenal, memberi komentar pada postingan blog orang lain, dan mendaftarkan blog ke mesin pencari. Berikut adalah tips untuk mendaftarkan blog Kita ke mesin pencari. Banyak mesin pencari yang digunakan diseluruh dunia, akan tetapi Google merupakan yang paling banyak digunakan.

            Nah, jika kalian mempunyai blog atau situs, dan ingin blog atau situs kalian ini dikunjungi banyak orang, salah satu caranya adalah dengan mendaftarkan blog atau situs kalian ke Google. Caranya gampang, lihat tutorialya disini.
            Masuk aja ke situs ini: "http://www.google.com/addurl/"
            Nah, jika kalian sudah berada pada halaman situs ini, isilah form yang ada pada halaman situs ini..
            Berikut langkah-langkahnya.

            URL : isi dengan alamat URL atau situs kalian,
            contoh: http://blogenalrhaysyahringgan.blogspot.com

            Comments : Isi dengan kata kunci yang ada hubungannya blog kalian
            contoh: Trik-Trik Blogger | SEO Blogspot | Tips-tips Menarik, dll

            Pokonya Yang ada sangkutpautnya dengan web kalian
            Verifikasi: isi dengan huruf verifikasi yang muncul pada gambar,

            Klik tombol Add URL, selesai.

            Setelah melakukan pendaftaran, tunggu 2 sampai 4 hari agar blog kita terindeks pada mesin pencari Google. Kadang hanya butuh waktu beberapa hari saja agar blog kita terindeks ke mesin pencari. Nah jika sudah, cobalah masukkan alamat blog atau judul salah satu postingan blog kalian di Google. Setidaknya alamat blog anda bisa masuk daftar 10 besar pencarian di Google. Selamat mencoba.

            READ MORE - Tips Mendaftarkan Blog atau Web ke Google

            Cara Mengganti Icon Pada Address Bar




            Jika kita membuka suatu website atau blog maka seringkali kita menjumpai ada sebuah gambar atau icon pada address bar (kotak untuk mengetikkan alamat web). Dan jika kita punya blog di Blogspot maka icon default yang akan tampil adalah gambar seperti ini :


            Bagi kamu yang tidak puas dengan icon/gambar tersebut, kamu bisa menggantinya dengan gambar sesuai dengan keinginanmu. caranya sangat mudah, yaitu dengan membuat gambar (gif, jpg, ico, dan lain2) dengan ukuran kira2 24x24 pixel sampai 32x32 pixel (sebenarnya ukurannya bebas sih, tapi biar filenya kecil dan proses membukanya cepat). Setelah itu .....




            Masuk ke "Layout --> Edit HTML" trus tempatkan script berikut sebelum kode </head>

            <link href='http://kendhin.890m.com/sonictrik.gif' rel='SHORTCUT ICON'/>

            ganti huruf yang dicetak tebal dengan lokasi gambar dimana kamu menyimpannya. Kamu bisa menyimpan gambarmu di 000webhost atau bisa juga di photobucket dan juga di imageshack atau kalo kamu tidak mau pusing dibawah ini ada beberapa contoh icon/gambar beserta dengan linknya.

            http://img87.imageshack.us/img87/5862/image1an1.gif
            http://img110.imageshack.us/img110/6218/image2ie0.gif
            http://img98.imageshack.us/img98/9617/image3cr0.gif
            http://img134.imageshack.us/img134/633/image4hx4.gif
            http://img139.imageshack.us/img139/83/image5oa7.gif
            http://img509.imageshack.us/img509/6449/image6fu0.gif
            http://img527.imageshack.us/img527/6543/image7go9.gif
            http://img507.imageshack.us/img507/5774/image8wn8.gif
            http://img150.imageshack.us/img150/5784/image9qo1.gif
            http://img404.imageshack.us/img404/1214/image10vr1.gif
            http://img412.imageshack.us/img412/3808/image11pc0.gif
            http://img100.imageshack.us/img100/4658/image12du2.gif
            http://img132.imageshack.us/img132/4733/image13lj1.gif
            http://img145.imageshack.us/img145/7793/image14zg9.gif
            http://img412.imageshack.us/img412/4403/image15jc7.gif
            http://img264.imageshack.us/img264/7575/image16kn8.gif


            EnaL Rhay SyahRinggan Next..>>
            READ MORE - Cara Mengganti Icon Pada Address Bar

            Comments Via Facebook

            | Enal | Trik-Trik Blogger | SEO Blogspot