Archive for Desember 2017

Cara remove quick edit ( obeng dan kunci ) pada blog

Cara remove quick edit ( obeng dan kunci ) pada blog. Pada template pada umumnya akan terdapat gambar obeng dan kunci atau bahasa gaulnya quick edit.

simbol ini sebenarnya ada kegunaanya namun juga ada kerugiannya. adanya Simbol quick edit ini sebenarnya dibuat untuk mepermudah kita dalam melakukan pengaturan ataupun editing pada widgat di blog kita. supaya anda tidak perlu masuk kedalam pengaturan layout untuk mengatur atau mengedit widget itu sendiri pada blog.

Namun disamping hal tersebut terdapat juga kekurangannya, dimana dengan adanya simbol quick edit tersebut biasanya, saat anda melakukan edit template membuat tampilan widget blog kita keliahatan menjadi turun serta tampilannya juga jadi kurang bagus dilihat,karena terlalu banyak simbol obeng dan kunci.

Sebenarnya memang ada atau tidaknya simbol tersebut tidak terlu mempengaruhi terhadap blog, namun bagi yang merasa tidak nyaman dengan adanya tampilan kunci dan obeng pada tampilan blog anda, anda bisa hapus quick edit dengan 2 cara yaitu :

Cara mudah yang pertama yang dapat anda lakukan untuk menghilangkan simbol quick edit (obeng dan kunci) adalah dengan menghapus kode <b:include name='quickedit'>

Caranya yaitu:
> Masuk ke dasboard
> pilih Template
> Pilih Edit HTML
> cari kode <b:include name='quickedit'> , supaya mudah gunakan tombol ctrl + F.
> Kemudian Hapus kode tersebut.
Jika sudah selasai klik pratinjau, bila sudah sesuai dengan keinginan anda klik save tamplate.

Cara mudah yang kedua yang dapat dilakukan untuk menghilangkan quick edit ( obeng dan kunci) yaitu dengan nembahkan kode berikut ini pada template anda. caranya :

> Masuk ke dasboard
> Pilih Template
> Pilih Edit HTML
Cari Kode ]]></s:kin> ,
> Copy dan Pastekan kode .quickedit{display:none;} Letakkan tepat dibawah kode
]]></s:kin> tadi.
dan hasilnya akan seperti gambar berikut ini
.quickedit { display:none; }]]></b:skin>

Klik pratinjau,bila gambar obeng dan kunci sudah hilang, klik save.

Mudah bukan cara menghilangkan simbol quick edit (obeng dan kunci ).
Sekian cara remove quick edit (obeng dan kunci) pada blog, semoga bermanfaat dan selamat mencoba

Cara Membuat Read More Di Blog

Cara Membuat Read More Di Blog. Read more atau baca selengkapnya berguna untuk mempersingkat tampilan dari setiap posting di halaman awal blog. Berikut ini ada 2 cara, yang pertama adalah cara membuat read more manual versi blogger dan read more otomatis.

Cara membuat read more manual versi blogger

Login Ke blogger. Buka Salah satu Artikel kamu.
Pada Bagian Option klik Insert Jump Break di halaman yang ingin kamu potong. Contoh:

Sekarang Save artikel kamu dan coba lihat tampilan awal blog kamu. Maka akan seperti gambar dibawah ini.

Selesai.

Cara diatas adalah membuat read more atau baca selengkapnya secara manual. Jadi kita harus melakukan cara diatas satu persatu disetiap posting. Selanjutnya kita akan membuat read more otomatis, setiap posting akan di potong atau dipersingkat tampilannya dan diberi satu gambar dibagian kiri di halaman awal blog. Ikuti langkah-langkah dibawah ini.

Cara membuat read more Otomatis

Login ke blogger. Dari halaman Dasboard Pilih pengaturan Template.
Selanjutnya klik edit HTML dan cari kode </head> dan Copy-paste script berikut tepat DI BAWAH </head> (gunakan Ctrl+F):

<script type='text/javascript'>
var thumbnail_mode = "yes";
summary_noimg = 430;
summary_img = 340;
img_thumb_height = 150;
img_thumb_width = 150;
</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 = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
        summ = summary_img;
    }
    }
    var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
    div.innerHTML = summary;
}
//]]>
</script>

Keterangan Kode: Edit kode2 dibawah ini agar sesuai dengan yang kalian inignkan.

summary_noimg = 430; Jumlah Huruf dengan gambar
summary_img = 340; Jumlah Huruf Tanpa gambar
img_thumb_height = 150; Tinggi gambar
img_thumb_width = 150; Lebar Gambar

Sekarang cari kode <data:post.body/> ada 3 kode yang sama, ganti semuanya dengan kode dibawah ini.

<b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == "static_page"'>
<data:post.body/>
<b:else/>
<div style='text-align:justify;' expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'> createSummaryAndThumb("summary<data:post.id/>");
</script>
<a class='more' expr:href='data:post.url'>Baca Selengkapnya >>></a>
</b:if>
</b:if>

Tulisan Baca Selengkapnya >>> bisa diganti dengan kata yang kalian inginkan, selanjutnya preview template, jika sudah berubah baru save. Selesai.

Gambar diatas adalah contoh tampilan read more otomatis, ada gambar dibagian kiri dan dilanjutkan dengan kalimat-kalimat yang ada. Setelah menambahkan read more otomatis, maka setiap Artikel postingan kita tampilannya akan disederhanakan dari halaman awal blog. Jadi kita tidak perlu lagi menggunakan Tools Insert Jump break, seperti read more manual versi blogger. Setelah publikasi, maka tampilan artikel blog akan seperti diatas.

Silakan baca juga artikel tentang cara membuat kotak komentar facebook yang bersebelahan dengan kotak komentar blogger, dibawah posting blog. Dan juga cara mengganti warna judul sidebar widget yang berada di kanan-kiri posting, dan juga bagian bawah footer blog. Atau Cara membuat related post dibawah posting blog. Semoga Bermanfaat.

Membuat Form Kotak Pencarian Dengan Show Hide Value / Auto Value

Belajar Menghias Kotak Mesin Pencari / Kotak Pencari pada Blog

Jika beberapa waktu lalu saya sempat memposting tentang bagaimana cara membuat form search engine/mesin pencari pada blog,giliran kali ini kita belajar menghiasnya.

Untuk fungsi dan keuntungan dari kotak pencarian ini,saya kira teman-teman sudah pada tahu ya ^^

Menghias mesin pencari bisa bermacam-macam,dari mengubah background /menambahkan image kotak mesin pencari maupun memaksimalkan fitur kotak pencarian tersebut.

Salah satunya yang akan saya bagi-bagi saat ini,adalah membuat form kotak pencarian dengan fitur show-hide value atau auto value.
Maksudnya?
Gimana ya njelasinnya? bingung juga si,xixixi..

Maksudnya,saat form diklik value/tulisan yang ada pada form pencarian akan hilang,dan sebaliknya jika yang diklik di luat form,tulisan pada form akan mucul secara otomatis alias nongol kembali.

And bisa lihat kotak pencarian pada blog ini,saat anda klik pada form,tulisan 'Cari Artikel Disini..' akan hilang,sebaliknya saat anda mengklik di luar form,tulisan 'Cari Artikel Disini..' akan muncul kembali.

Gimana? maksud khan?

Langkah Cara Membuat Kotak Mesin Pencari Show Hide Values

Yo wis,jika anda berminat membuat kotak pencarian seperti itu,ikuti langkah -langkah di bawah ini:

Pilihlah Dashboard,kemudian pergilah ke Tata Letak blog anda,selanjutnya pilih Add New Widget/Tambah Gadget.

Kemudian pilih HTML/Javascript.

Setelah itu letakkan code berikut:

<center><form id="searchform" action="http://dot-blogspot76.blogspot.com/search" name="q" method="get"><input id="s" onfocus="if (this.value == 'Cari artikel disini..') {this.value = '';}" value="Cari artikel disini.." name="q" onblur="if (this.value == '') {this.value = 'Cari artikel disini..';}" type="text"/><input id="searchsubmit" value="Search" type="submit"/></form></center>

Lalu Simpan dan lihat hasilnya.

Untuk tulisan :

Cari artikel disini..,gantilah sesuai keinginan anda misal;'Type your text here..' atau 'Cari Artikel..' dll,tapi ingat! dari tulisan ketiga-tiganya harus sama.
Sedangkan tulisan http://dot-blogspot76.blogspot.com,gantilah sesuai alamat blog anda.

Semoga berhasil dan mudah-mudahan bermanfaat.. Amin! Kawin! lha koq??

Sapi Bosok