Tampilkan postingan dengan label Tips & Trik Blog. Tampilkan semua postingan
Tampilkan postingan dengan label Tips & Trik Blog. Tampilkan semua postingan

Rabu, 11 Juni 2014

Cara Mengganti Icon BLOG Dengan Gambar Sendiri

Mengganti Icon Blogger merupakan hal yang sepele bagi pengguna blogger yang sudah mahir, tetapi kali ini saya akan share tips/trik khusus bagi pemula yang masih meraba didunia Blogger. Sebelumnya mungkin ada yang belum tau apa sih favicon itu? Favicon adalah icon yang terdapat pada Address Bar browser kita.
Secara umum, favicon default blogger biasanya nampak seperti ini.
Menurut saya pribadi hal ini kurang menarik, dan selain itu icon favicon pada address bar juga berfungsi sebagai ciri / identitas dari sebuah situs. Pasti pengen kan biar blog kita terlihat lebih keren dan profesional? Baiklah langsung saja kita untuk mengganti favicon ini.
  • Buka Blogger.com dan login dengan akun blogger anda.
  • Lalu pilih masuk ke menu Tata Letak seperti gambar dibawah ini
  • Setelah itu Klik Edit pada Kolom Favicon seperti gambar dibawah ini

  • Dan pilih gambar yang ingin dijadikan icon maka hasilnya akan seperti gambar dibawah ini 
  • Yang terakhir simpan setelan dan lihat hasilnya pada Address Bar anda.

    NB : sepengalaman saya gambar icon yang bisa diganti dengan format  .ico jadi bila anda punya gambar yang berformat  .jpg atau lainnya silakan convert dulu ke ke format  .jpg dengan aplikasi convert yang anda punya dan kalau anda tidak punya silakan dulu download DISINI

Jumat, 06 Juni 2014

Membuat Recent post keren dan ringan pada Blog

Mungkin sebelumnya saya sudah share tips/trik membuat Blog anda keren, nah.. kali ini saya akan share tips Membuat Recent post keren dan ringan pada Blog. Sebelum kita ke TKP saya jelaskan dulu apa itu recent post.

Recent post merupakan widget yang menurut saya wajib ada di blog. Sebenarnya dulu sudah ada defaultnya dari blogger tinggal dipasang saja namun sekarang di hilangkan ntah kemana. Kegunaan lain dari  Recent post adalah menampilkan beberapa artikel sobat dari yang paling atas adalah yang paling baru. Dimana tujuannya tetap sama yaitu memberikan kemudahan untuk pengunjung mengetahui isi dari blog sobat dan update-tan terbaru dari sobat. Maka dari itu saya akan memberikan sobat langkah-langkah untuk membuatnya sendiri. 

Oke langsung saja kita ke TKP.

1. Buka blogger.com.
2. Kemudian masuk dengan akun blog sobat.
3. Setelah itu pilih Tata Letak.
4. Lalu klik add gadget dan pilih HTML/Java Script.
5. Copy pastekan script dibawah ini pada kolom yang tersedia :

<div align="center">

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
    <style type="text/css" media="screen">
    <!--

    #spylist {
    overflow:hidden;
    margin-top:5px;
    padding:0px 0px;
    height:430px;
    }
    #spylist ul{
    width:220px;
    overflow:hidden;
    list-style-type: none;
    padding: 0px 0px;
    margin:0px 0px;
    }
    #spylist li {
    width:208px;
    padding: 5px 5px;
    margin:0px 0px 5px 0px;
    list-style-type:none;
    float:none;
    height:70px;
    overflow: hidden;
    background:black url(URL Gambar agan) repeat-x;
    border:1px solid #000;
    }

    #spylist li a {
    text-decoration:none;
    color:white;
    font-size:11px;
    height:18px;
    overflow:hidden;
    margin:0px 0px;
    padding:0px 0px 2px 0px;
    }
    #spylist li img {
    float:left;
    margin-right:5px;
    background:transparent;
    border:0;
    }
    .spydate{
    overflow:hidden;
    font-size:8px;
    color:#6aa84f;
    padding:2px 0px;
    margin:1px 0px 0px 0px;
    height:15px;
    font-family:Tahoma,Arial,verdana, sans-serif;
    }

    .spycomment{
    overflow:hidden;
    font-family:Tahoma,Arial,verdana, sans-serif;
    font-size:10px;
    color:#6aa84f;
    padding:0px 0px;
    margin:0px 0px;
    }

    -->
    </style>

        <script language='javascript'>

    imgr = new Array();

    imgr[0] = "URL Gambar agan";

    imgr[1] = "URL Gambar agan";

    imgr[2] = "URL Gambar agan";

    imgr[3] = "URL Gambar agan";

    imgr[4] = "URL Gambar agan";
    showRandomImg = true;

    boxwidth = 255;

    cellspacing = 6;

    borderColor = "#232c35";

    bgTD = "#000000";

    thumbwidth = 70;

    thumbheight = 70;

    fntsize = 12;

    acolor = "#666";

    aBold = true;

    icon = " ";

    text = "comments";

    showPostDate = true;

    summaryPost = 40;

    summaryFontsize = 10;

    summaryColor = "#666";

    icon2 = " ";

    numposts = 15;

    home_page = "http://ufreesoft.blogspot.com/";

    limitspy=5
    intervalspy=5000

    </script>

    <div id="spylist">
        <script src='http://alfiandikha.googlecode.com/files/recentpostthumbspy-min.js' type='text/javascript'></script>
    </div></div>
Nb : ganti tulisan yang berwarna merah dengan alamat Blog sobat.

6. Simpan dan lihat hasilnya pada Blog Sobat.

Rabu, 04 Juni 2014

Cara Membuat Read More/ Baca Selengkapnya Otomatis di Blog Dengan mudah

Udah seminggu nggak  ngepost rasanya hambar ya. Oke ! Sebelumnya saya telah mengshare beberapa trik mempercantik tampilan Blog, kali ini saya akan mengshare Cara membuat read more otomatis di blogspot sangat mudah. Sebelum kita ke TKP lebih baik kita tahu apa itu read more? dan apa fungsi read more? Read more dalam bahasa indonesia yaitu " Baca Selengkapnya " dan fungsi read more itu sendiri adalah meminimalis penggunaan halaman blog agar terlihat lebih rapi dan menarik. Read more otomatis ini akan memotong tampilan depan artikel yang panjang dan anda bisa menentukan berapa banyak huruf yang akan ditampilkan di halaman depan, begitu pengunjung membuka Read more atau baca selengkapnya barulah pengunjung bisa membaca artikel penuh blog anda. Sekarang lanjut ke langkah cara membuat read more otomatis di blogspot .

Berikut Langkah-langkah membuat Read More / Baca Selengkapnya pada Blog :

  • Login Ke Blogger.
  • Klik Template, Backup template untuk jaga2 bila diperlukan, atau langkah berikut bisa di uji coba       menggunakan Blog percobaan yang lain.
  • Klik Edit HTML.
  • Klik Kiri 1 x Dimana saja dalam kotak template.
  • Cari kode </head> , tetapi saya sarankan anda menggunakan  Ctrl+F (Supaya mempercepat pencarian kode) , Setelah itu Masukan kode </head> tersebut kedalam kotak pencarian, kemudian enter untuk  mencari. Setelah dapat kode </head> masukan kode dibawah ini diatas kode </head>.
<!--Auto Read More Mulai-->

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<style>
.post-body{text-align:justify;}
.post-body img{max-width:none;width:auto;}
.read-more{float:left; padding-top: 10px;}
.read-more a{ color: #fff!important;text-shadow:0 1px 0 rgba(0,0,0,0.5);background:#38761d;  text-decoration:none;font:bold 13px Arial;padding:5px;}
.read-more a:hover{text-decoration:none;background:#274e13;}
.pic{border: 10px solid #fff;float:left;height:155px;width:155px;margin-right: 10px;margin-bottom:10px;overflow:hidden;box-shadow: 5px 5px 5px #111;}
.grow img{height:135px;width:135px;transition: all 1s ease;}
.grow img:hover{width:135px;height:135px;}
</style>
<script type='text/javascript'>
var thumbnail_mode = &quot;yes&quot;; //yes -dengan gambar, no -tanpa gambar
  summary_noimg = 300 ; //banyaknya huruf jika tidak ada gambar
summary_img = 250; //banyaknya huruf jika ada gambar
img_thumb_height = 155;
img_thumb_width = 155;
</script>
<script type='text/javascript'>//<![CDATA[
function removeHtmlTag(strx,chop){if(strx.indexOf("<")!=-1){var s = strx.split("<");for(var i=0;i<s.length;i++){if(s[i].indexOf(">")!=-1){s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);}}strx =  s.join("");}chop = (chop < strx.length-1) ? chop : strx.length-2;while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;strx = strx.substring(0,chop-1);return strx+'...';}function createSummaryAndThumb(pID){var div = document.getElementById(pID);var imgtag = "";var img = div.getElementsByTagName("img");var summ = summary_noimg;if(thumbnail_mode == "yes"){if(img.length>=1){imgtag = '<div class="grow pic"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></div>';summ = summary_img;}}var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';div.innerHTML = summary;}
//]]></script>
</b:if>
</b:if>

<!--Auto Read More Akhir-->

  • Kemudian Cari Kode <data:post.body/> Kode tersebut diatas jumlahnya biasanya ada 2, biasanya yang kedua (ke-2) cari dengan menekan enter 2x pada kotak pencarian.
  • Hapus Kode <data:post.body/> yang ke-2 dan Ganti dengan kode dibawah ini.
<!-- Auto read more Mulai -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<data:post.body/>
<b:else/>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'> createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
      <div class='read-more'>
      <a expr:href='data:post.url'>Baca Selengkapnya &#187;</a>
      </div>
</b:if>
</b:if>
<!-- Auto read more Akhir -->

Rabu, 23 April 2014

Cara Membuat Link Sumber Otomatis Muncul Saat Artikel di Copy-Paste

Sebagai admin Blogger mungkin ada etika yang harus kita patuhi misalnya ketika kita ingin membuat postingan dari artikel lain hendaknya kita menampilkan link sumber dari mana asal artikel tersebut. Bukan berarti kita dilarang Copy-Paste tetapi kita hanya perlu menampilkan link sumber dari artikel tersebut karena bisa jadi artikel yang kita Copy-Paste merupakan hasil jerih payah pikiran orang lain, selain itu kita juga harus menulis artikel tidak sama persis dengan aslinya untuk menjaga kualitas artikel blog.

Tetapi ada juga blogger yang nakal atau meng-copas artikel tapi tidak menyertakan link sumber dari artikel yang dicopas, jadi kali ini saya akan share Cara Membuat Link Sumber Otomatis Muncul Saat Artikel di Copy-Paste sehingga ketika ada pihak yang meng-Copas artikel kita secara otomatis akan dilampirkan link sumber dari artikel kita.

Berikut langkah-langkahnya : 
  • Login akun blogger Anda. 
  • Pilih Template ---> Edit HTML ---> klik Expand Template Widget. 
  • Copy kode dibawah ini dan letakkan tepat dibawah kode </head>
<script type='text/javascript'>
if(document.location.protocol==&#39;http:&#39;){ var
Tynt=Tynt||[];Tynt.push(&#39;cXIEhKYVSr4lJ5adbi-bpO&#39;);Tynt.i={&quot;ap&quot;:&quot;Link Sumber :&quot;}; (function(){var
s=document.createElement(&#39;script&#39;);s.async=&quot;async&quot;;s.type=&quot;text/javascript&quot;;s.src=&#39;http://tcr.tynt.com/ti.js&#39;;var
h=document.getElementsByTagName(&#39;script&#39;)[0];h.parentNode.insertBefore(s,h);})();
 } </script>

saran saya gunakan CTRL + F untuk mempercepat pencarian anda seperti gambar dibawah ini.

Demikianlah artikel saya kali ini mudah-mudahan anda berhasil mencobanya.

Jumat, 18 April 2014

Membuat ScrollBar Blog Berbeda Dari yang Lain

Membuat tampilan blog beda dari yang lain adalah hal yang selalu dilakukan para blogger untuk memperindah blognya. Contohnya kali ini saya akan share tips/trik 'Membuat ScrollBar Blog Berbeda Dari yang Lain' , sudah tahu kan apa itu scroll ? ScrollBar adalah sebuah kontrol penggulung yang terdapat di sisi suatu jendela.  Macam dari ScrollBar sendiri ada 2, horizontal scrollbar dan vertical scrollbar.Fungsinya untuk menggulung teks pada layar atau mengubah nilai sebuah kontrol. Dan kali ini kita akan mengubah scrollbar di blog atau juga bisa dibilang scrollbar dari browser. 

Apakah anda tertarik menggunakan trik ini untuk memperindah blog kalian ?  Kalau iya langsung ikuti langkah - langkah berikut ini :
  • Login ke akun Blogger kalian.
  • Pilih Tab menu Template.
  • Klik menu Edit HTML.
  • Cari code </b:skin> , saya sarankan gunakan CTRL + F untuk mempercepat pencarian anda.
  • Pasang kode berikut di atas kode ]]></b:skin> 
::-webkit-scrollbar {height:12px;background: #DEDEDE;}
::-webkit-scrollbar-thumb {background-color: black;border:3px solid #FFFFFF;}
::-webkit-scrollbar-thumb:hover{background: #38761d;}
::-webkit-scrollbar-thumb:active{background:  #274e13;}
  • Klik simpan/Save dan lihat hasilnya pada blog anda.
Tapi anda jangan senang dulu setelah saya teliti kode/CSS diatas hanya berfungsi di Browser Chrome dan Opera dan tidak berlaku di Firefox .

Semua terserah anda saja mau gimana , yang jelas artikel ini sudah sedikit membantu anda untuk merubah bentuk dan warna Scroll bar di blog ( sendiri dengan browser yang mendukung ) dan tidak tampil begitu di browser yang tidak mendukung CSS diatas. Mudah-mudahan anda bisa bereksperiment membuat ScrollBar yang mendukung Browser Firefox dan mengsharenya kesesama Blogger.

Kamis, 17 April 2014

Cara Menambah Widget Google Translate Pada Blog

Hai semua sebelumnya saya sudah share tips/trik membuat pengunjung suka berselancar di blog kita. kali ini saya akan tambahkan tips/trik menarik pengunjung agar semakin betah diblog kita apalagi kita berharap blog kita tidak hanya dikunjungi oleh pengunjung lokal tetapi bisa juga banyak dikunjungi oleh pengunjung mancanegara.Tetapi mungkin pengunjung tersebut tidak akan berlama-lama di blog anda, karena tidak sesuainya bahasa yang digunakan. Jika anda tidak ingin kehilangan pengunjung tersebut, coba gunakan widget yang dapat menterjemahkan bahasa pada blog anda menjadi bahasa yang mereka gunakan. Untuk itu saya akan memberikan tutorial bagaimana cara memasang widget translate bahasa yang dapat anda praktekkan langsung di blog anda  masing-masing.
  • Pertama, login akun blogger sobat
  • Kedua Pilih Tata Letak
  • Ketiga Klik Tambahkan Gadget
  • keempat Pilih HTML/JavaScript
Bila sudah masukkan kode script berikut:

<center>
<style>
.google_translate img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
border:0;
}
.google_translate:hover img {
filter:alpha(opacity=30);
-moz-opacity: 0.30;
opacity: 0.30;
border:0;
}
.google_translatextra:hover img {
filter:alpha(opacity=0.30);
-moz-opacity: 0.30;
opacity: 0.30;
border:0;
}
</style>
<div>
<a class="google_translate" href="" target="_blank" rel="nofollow" title="English" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cen&hl=en'); return false;"><img alt="English" border="0" align="absbottom" title="English" height="40" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgK7wVnexqpOO7QWdf7pjxeJdTJ_FRns0D-d18aCyf-e6Y7q3eO6jXYwdQhVgbjEz9XtoVagnK-qNmnYuofNehPzbqEfUIQV8o2rh9wshxL6Rto4NsDeB1pUc5iNw9DU62N4qhkf2Al5OM/?imgmax=800" style="cursor: pointer;margin-right:10px" width="30"/></a>
<a class="google_translate" href="#" rel="nofollow" title="French" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cfr&hl=en'); return false;"><img alt="French" border="0" align="absbottom" title="French" height="40" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGh2klHs9MedZ-HOxTRewGbK1isrFZhzZAFTT1e47iuuSgo-ZWVILvqQX9vuLml7axX5miUyPHZLRfWrUxf1R1F3UufqWRiQWbCZ5RuyuMu8DTi2I1-RnSXoaNMW9Y1GYaKkpTkokn-I0/?imgmax=800" style="cursor: pointer;margin-right:10px" width="30"/></a>
<a class="google_translate" href="#" rel="nofollow" title="German" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cde&hl=en'); return false;"><img alt="German" border="0" align="absbottom" title="German" height="40" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiOghic2JlEdXOFxht8cqDjV8e1fAJhLPX1DijyTfU1-1fZHJmgQXUNH6vv5iQUCeNImY-KNPvdDdaaAqfIbb97z6_2qx0AwSsvYSjyaMocgSMqnfBF_dfLWW9PZBa7jyWqKaQGsyO-3vMd/?imgmax=800" style="cursor: pointer;margin-right:10px" width="30"/></a>
<a class="google_translate" href="#" rel="nofollow" title="Spain" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Ces&hl=en'); return false;"><img alt="Spain" border="0" align="absbottom" title="Spain" height="40" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsR5N84Tf5FbTpX29jP5Y_4lUPJZEzDjW7BiZqseVVW7mddB2pbkCXeEedYvYQbsNcQGsVFetfG7ZX5GF3M_cnLf1P8isOeW-WIR2qiP3RTz_H0K1IppfbsvZAkfb8TPWpjl2LGhYDIiNT/?imgmax=800" style="cursor: pointer;margin-right:10px" width="30"/></a>
<a class="google_translate" href="#" rel="nofollow" title="Italian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cit&hl=en'); return false;"><img alt="Italian" border="0" align="absbottom" title="Italian" height="40" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgly9x5Wd1uvBtFFvf5o64PYGx8AtlHx0CKqcTpxnO-OvAWCrGdrPEXEo121h8ZDsfw_LGG2jbKNEOytdaTGf9mtj_u4B5JcNU5mQy7yU64l4XYnJrdRNknha4_8Ysn5w1Vl1Ozq5e1t0I/?imgmax=800" style="cursor: pointer;margin-right:10px" width="30"/></a>
<a class="google_translate" href="#" rel="nofollow" title="Dutch" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cnl&hl=en'); return false;"><img alt="Dutch" border="0" align="absbottom" title="Dutch" height="40" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDMUhmwG95rg8zJQvaRmbuThK9wrWapGkZFpSSHKcn1F5N22rYDAdkw-KkIsoG90Xiu_PhgGJWRHU8OT3HWj16mM6Q8a5vRbNexXy6nkdN6CeHTWtcCZCowpNYD8nF80TBYLJSHYHftgo/?imgmax=800" style="cursor: pointer;margin-right:10px" width="30"/></a>
<br /><br />
<a class="google_translate" href="#" rel="nofollow" title="Russian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cru&hl=en'); return false;"><img alt="Russian" border="0" align="absbottom" title="Russian" height="40" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjao8SWQd4ndn6DHbQadOzsabHX8mMVVl5Ih8zc7Gw4b1EMAxtfd-W-_R_7hwKfIeMYdtT3JNexHsJ08xrprDpbmC5C4mEic4JLNRR-TP0ZOZp7zFzt70azVnKssD2eyowg8couOfTzkqA/?imgmax=800" style="cursor: pointer;margin-right:10px" width="30"/></a>
<a class="google_translate" href="#" rel="nofollow" title="Portuguese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cpt&hl=en'); return false;"><img alt="Portuguese" border="0" align="absbottom" title="Portuguese" height="40" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiX_4zNupv2KJaikVeDr8o-rp4Q_eA0qc8XP81l5hHHm94Y67HNiVmNHzb06g2apVsy8Wjg4Sq8KS4CjLHTh_ZyQBBpG53ucxiAsrJzMcok1JfaiOSdo618ciUVETi1JyWJ-FYlPxH2Ea4/?imgmax=800" style="cursor: pointer;margin-right:10px" width="30"/></a>
<a class="google_translate" href="#" rel="nofollow" title="Japanese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cja&hl=en'); return false;"><img alt="Japanese" border="0" align="absbottom" title="Japanese" height="40" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi43Dnr7xy1Xjjoh_X9QK_auGnTPlY6fAglwmde-zANc3l834O-Kek1jdkrldx5npNAFgJSdqwQEihTPaLR6rxYwgRpftpYjyytwNcLpHTPe-Kiv7wRwGUcmTIJAMPEPVCSNWo3i__va4hM/?imgmax=800" style="cursor: pointer;margin-right:10px" width="30"/></a>
<a class="google_translate" href="" rel="nofollow" title="Korean" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cko&hl=en'); return false;"><img alt="Korean" border="0" align="absbottom" title="Korean" height="40" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLd8EZHqLXHPHHBHSvYBfrjMdU-E-Z5Zvcm9S1wWW9sYIfqJogF2Wmds_b7K80m4Xmo6GetTAiqog2oVFEdL-MS8UHw7wH6mZDJdQ_ijZWMezjzQ2BxG9XPbJHaZJ8O1uL3lrKFsg_ovw/?imgmax=800" style="cursor: pointer;margin-right:10px" width="30"/></a>
<a class="google_translate" href="" rel="nofollow" title="Arabic" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Car&hl=en'); return false;"><img alt="Arabic" border="0" align="absbottom" title="Arabic" height="40" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPUVEnAY_zKhJ21Jaf7GW9WUePLAcMwXgEqcIsqd5IPEJ2R4PC6lUdIiMyZOZ_1PHmhmPKQRyBAwnjyYrS9V5e19PPNJf2poAup8dNNlDE61DbxQmIHOPB6slgi9yZRXl38CthzhUxr6Y/?imgmax=800" style="cursor: pointer;margin-right:10px" width="30"/></a>
<a class="google_translate" href="" rel="nofollow" title="Chinese Simplified" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Czh-CN&hl=en'); return false;"><img alt="Chinese Simplified" border="0" align="absbottom" title="Chinese Simplified" height="40" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJQUFNx1nc5FZU5D5j2bqyiPlwCrdMqH0LNLa09OtjQgBBzx_dVtXUjeAXuixbda7uyznPku9QQ6waW-EWCKXdCHabb15Djrl5FVFXbDSbzDx9Un8WXE5j-UXjLOCjeQ2YRyHimO0U-oA/?imgmax=800" style="cursor: pointer;margin-right:10px" width="30"/></a>
</div></center>
<div style="text-align: center;">
<a href="http://ufreesoft.blogspot.com/2014/04/cara-menambah-widget-google-translate.html" rel="nofollow" target="_blank"><span style="font-size: 8px;"><i>Get This Gadget</i></span></a></div>


  • Klik simpan/save lalu lihat hasilnya pada blog anda.

Selasa, 15 April 2014

Cara Membuat Kotak Pencarian / Search di Blog

Membuat pengunjung suka berselancar di blog kita memang adalah tujuan dari para blogger. Dan banyak trik untuk mewujudkan itu semua, contohnya memasang Kotak Pencarian / Search pada Blog. Kotak Pencarian sangat berguna untuk mempermudah pembaca atau pengunjung blog mencari Artikel Tertentu sehingga pengunjung tidak perlu repot membuka satu persatu artikel yang ada pada blog kita. Karena dengan memasukan kata kunci pada kotak pencarian kita langsung bisa menemukan artikel yang kita cari pada blog tersebut. Maka dari itu saya akan share CARA MEMBUAT KOTAK PENCARIAN PADA BLOG, langsung saja ke TKP.
  • Yang pertama login ke Blogger sobat lalu pilih menu Tata letak seperti gambar dibawah ini.

  • Lalu pilih tambah Gadget seperti gambar dibawah ini.
  • Lalu pilih HTML/Java Script seperti gambar dibawah ini
  • Lalu Copy Pastekan kode ini seperti gambar dibawah ini.
<form action="http://ufreesoft.blogspot.com/search"
method="get">
<strong>Cari Artikel Disini<br/></strong>
<input class="textinput" name="q" size="22" type="text"/>
<input value="search" class="buttonsubmit" name="submit" type="submit"/></form>
ket : ganti tulisan yang berwarna merah dengan alamat blog sobat.


Simpan dan lihat hasilnya pada blog sobat.

Cara Menghilangkan Navbar Blogger

Mungkin sudah banyak yang mengerti bagaimana cara menyembunyikan navbar tetapi banyak pula pemula blogger yang belum mengetahuinya. Oke langsung saja sebelum saya memberi tahukan bagaimana cara menghilangkan Navbar atau lebih tepatnya menyembunyikannya pada tampilan diblogmu tahu gak apa itu navbar blog?. Navbar blogger adalah suatu frame yang berukuran kecil miliknya blogger yang terdapat di bagian atas blog. Oke langsung saja ke TKP.
  1. Hal yang harus dilakukan adalah masuk ke dalam dashboard blogger kemudian pilih "Tata Letak". Muncul halaman pengaturan widget lalu pilih Navbar yang berada di paling atas lalu klik "Edit".

  2. Pada jendela Konfigurasi Navbar, kemudian klik "Off" dan "Simpan". Maka sesudah itu tampilan dari Navbarnya sudah hilang.

Jadi sedikit saya jelaskan cara di atas hanya untuk menghilangkan tampilan dari navbarnya saja, namun tidak merubah dari ukuran dan susunan elemen pada halaman blogger, sehingga terlihat di halaman atas blog terdapat ruang kosong yang tadinya berisi tampilan navbar.