Showing posts with label Trik Blog. Show all posts
Showing posts with label Trik Blog. Show all posts

Thursday, March 19, 2015

Membuat Text Area dengan Tombol Highlight All

Membuat Text Area dengan Tombol Highlight All

Masih binggung dengan judul nya ya ?

Text Area dengan Tombol Highlight All  adalah dimana kita bisa mensisipkan text atau kode script pada sebuah text area dengan di tambah tombol Highlight All , Highlight All  berarti dengan kita klik tombolnya maka sesuatu yang ada pada text area ter-Blok atau select all, dengan itu kalian bisa mudah dalam copy/paste.

dengan ini para pengunjung blog akan sangat di permudah

ini contohnya
Mau coba membuatnya ?
cukup copy saya script di bawah ini , dan ganti text yang berwarna biru sesuai dengan yang kalian inginkan

<div>
<form name="copy">
<div align="center">
<input onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button" value="Highlight All" /> </div>
<div align="center">
<textarea cols="20" name="txt" rows="4" style="height: 80px; width: 180px;" wrap="VIRTUAL">Text atau kode script</textarea></div>
</form>
</div>

Tuesday, August 19, 2014

Cara Membuat Teks Berjalan di Menu Bar

Cara Membuat Teks Berjalan di Menu Bar

Pernah kan kalian melihat web atau blog dengan title text pada menu bar nya berjalan ?

untuk kalian yang ingin menerapkan title yang panjang dan agar terlihat semua.
Trik ini cocok untuk anda terapkan di blog anda Ini dia tutorial nya,

Cara Membuat Teks Berjalan di Menu Bar
trikaja.blogspot.com

1. Log in dengan akun blogger anda

2. Pilih blog yang akan di terapkan trik ini

3. Pada menu Design lalu Edit HTML 

4. Letakkan kode dibawah ini diatas kode </head>

<script type='text/javascript'> //<![CDATA[ msg = " Trik N Tips Blogspot"; msg = "www.trikaja.blogspot.com" + 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()",150); } scrollMSG(); //]]> </script>

Cara Membuat Teks Berjalan di Menu Bar

Ganti teks tebal sesuai dengan keinginan anda dan angka 150 adalah menunjukan kecepatan gerak teks tersebut, semakin besar nilainya maka akan semakin lambat dan sebalinya

Semoga berhasil ya kawan 

Thursday, June 5, 2014

Membuat Link Membesar Saat di Sentuh Cursor di Blogger

Pada kesempatan kali ini saya akan sedikit berbagi trik sederhana buat mengkostum link yang ada pada blog kita, jadi saat link di sentuh cursor maka link akan sedkit membesar . langsung saja kita mulai trik Membuat Link Membesar Saat di Sentuh Cursor.
Membuat Link Membesar Saat di Sentuh Cursor di Blogger
www.seospecialist.co.uk

Membuat Link Membesar Saat di Sentuh Cursor

1. Jangan lupa, sign in / masuk di akun blogger sobat.
2. Pilih blog yang akan kalian edit.
3. Pilih template, lalu edit.
4. Cari kode a:hover{ .
5. Ubah font-size dengan nilai yang lebih besar, sesuai keinginan anda.

* lihat contohnya seperti di bawah ini

a:hover {
color:#d2691e;
font-size:10px;
font-style:italic;
cursor:wait;
}
gamti seperti contoh di bawah ini
a:hover {color:#d2691e;font-size:15px;font-style:italic;cursor:wait;} 
6. Lalu simpan template nya

Selamat mencoba

Monday, May 5, 2014

Menghilangkan Navbar blogger (Navigation Bar) di blogger

Cara Menghilangkan Navbar (Navigation Bar) - Navbar adalah Seperti garis yang melintang darikiri ke kanan yang terletak di halaman atas dari setiap blog yang di bikin di blogger. seperti ini nih yang namanya Navbar


Menghilangkan Navbar blogger (Navigation Bar)

Memag jika Navbar ini di hilangkan, tampilan blog akan lebih asik dilihatnya dan menambah sedikit lebih menarik

Cara Menghilangkan Navbar 

Sampai saat ini , banyak sekali blogger yang menghilangkan Navbar termasuk juga saya etapi selama ini aman-aman saja kok. memang dalam Term of Service (TOS) blogger tidak di bahas dengan jelas tentang Navbar
Untuk anda yang berminat, Ini dia triknya

1. Sign di Blogger


2. Pilih Template lalu edit HTML


3. Cari kode
<body>

4. Jika sudah ketemu taruh kode berikut di atasnya:



/* hilangkan navbar
----------------------------- */

#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}

5. Simpan template

Pasti Navbar anda sudah tak tampak

Sunday, May 4, 2014

Menghilangkan Tulisan Posting Baru/Newer Post pada blogger

Menghilangkan tulisan Posting Baru/Newer Post 


anda pernah melihat tulisan seperti gambar di bawah ini ?


Menghilangkan Tulisan Posting Baru/Newer Post

Jika kalian terganggu dengan tulisan ini, kalian bisa kok menghapusnya

Begini nih kira-kira

1. Seperti biasa anda harus sign in di akun blogger.com kalian
2. Pilih blog yang akan kalian terapkan trik ini
3. Pilih menu Template lalu Edit HTML;
4. Carilah kode yang kurang lebih seperti berikut ini ( gunakan ctrl+F untuk mempermudah pencarian):  


<data:newerPageTitle/>

5. Hapus kode tersebut lalu simpan deh template nya Coba di lihat hasilnyaSemoga berhasil Kalian Bisa kasih komentar untuk konsultasi masalah trik ini 

jika kalian menemukan kode lebih dari 1, maka hapus saja semua kode yang persis tersebut

Friday, May 2, 2014

Cara Membuat Spoiler di Blog

Cara Buat Spoiler di Blog
Cara membuat Spoiler di Blogspot - Udah lihat gambar di atas ? Itu tuh yang di namakan spoiler, kegunaannya untuk menyembunyikan konten yang ada di dalam spoiler, untuk contohnya, kalian bisa lihat di bawah ini, agar lebih mengerti fungsi dari spoiler 

Cara membuat Spoiler di Blog

Hide and show button juga sebutan untuk spoiler, yang lebih gampangnya Tombol sembunyikan dan tampilkan konten, konten ini bisa berisi berbagai macam, seperti gambar, video, teks maupun script dan kode . spoiler ini juga bisa ditaruh di side bar maupun postingan blog. Kalian tinggal copy kode di bawah ini, edit dan ubah sesuai dengan yang kalian inginkan , lalu paste di side bar atau postingan yang kalian hendaki.. 


<div style="margin: 5px 20px 20px;"> <div class="smallfont" style="margin-bottom: 2px;"><b>Judul Spoiler</b>: <input value="Buka" style="margin: 0px; padding: 0px; width: 55px; font-size: 12px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka'; }" type="button"> </div> <div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;"> <div style="display: none;">  
isi teks, kode html, script video, gambar dan lainnya
 <br> </div> </div> </div>


Semoga bermanfaat ya

Menyingkat komentar post dengan scrolling pada blog

Menyingkat komentar post dengan scrolling Sebuah postingan yang mempunyai ratusan komentar bahkan lebih, pasti sangat mengganggu tampilan blog anda dengan panjangnya deretan komentar-komentar yang ada pada posting. Untuk mengakalinya dan komentar masih tetap ada, ini dia triknya. Scrolling artinya putar, dimana kita tinggal memutarnya dengan scrolbar pada mouse untuk melihat semua komentar yang ada. Ingin menerapkannya pada blog anda?. Mari kita simak tips nya
Menyingkat komentar post dengan scrolling

Menyingkat komentar post dengan scrolling

1. Masuk dengan akun blogger anda 

2. Pilih blog yang akan anda terapkan trik ini 

3. Lalu pilih edit template atau edit HTML, jangan lupa ya di centang

4. Backup template untuk jaga-jaga sobat 

5. Cari kode yang seperti ini : 

#comments a {text-decoration: none;} 
#comments h2 {font-size: 1.3em;} 
#comments p {margin-bottom: 10px;line-height: 1.6em;} 
#comments form {padding: 0 10px;} 
#comments form p {margin-bottom: 5px;} 
#comments form input {margin-right: 5px;}

         6.Sisipkan kode berikut di atas kode berwarna merah seperti di atas

 #comments {height:500px;overflow:auto;}


        7. Sehingga kode nya seperti ini

#comments a {text-decoration: none;}  
#comments {height:500px;overflow:auto;} 
#comments h2 {font-size: 1.3em;} 
#comments p {margin-bottom: 10px;line-height: 1.6em;} 
#comments form {padding: 0 10px;} 
#comments form p {margin-bottom: 5px;} 
#comments form input {margin-right: 5px;}


Catatan : 500px adalah panjang scrolling yang kita buat, ubah sesuai keinginan anda
    Jika pada template blog kalian tidak ada kode #comments h2 { , maka cari 
     kode #comments a