Tampilkan postingan dengan label TRIK BLOG. Tampilkan semua postingan
Tampilkan postingan dengan label TRIK BLOG. Tampilkan semua postingan

Kamis, 18 Agustus 2011

Membuat Shoutbox

Bagi yang baru pertama kali dengar kata shoutbox mungkin masih bingung. Jadi aku coba jelasin sedikit (menurut pemahaman ku hehehe). Pada intinya sama antara shoutbox dengan komentar di postingan yaitu bertujuan memberikan pesan baik kritik, saran, pertanyaan, dll. Tetapi tetap punya perbedaan, antara lain :

- Selalu terpampang ketika blog dibuka, tidak seperti komentar yang tersembunyi dalam artikel (tergantung setting).
- Shoutbox tidak perlu adanya login untuk meninggalkan pesan, sedangkan komentar ada yang disetting untuk login apabila ingin meninggalkan pesan.

Bagi yang sudah mahir javascript & CSSmungkin dapat membuatnya sendiri. Tetapi sekarang penyedia jasa shoutbox seperti tersebut sudah banyak tersedia di internet, tetapi untuk kali ini aku menggunakan jasa shoutmix. Kunjungi terlebih dahulu http://www.shoutmix.com/ kemudian klik tombol create shoutbox.


Kemudian silahkan form pendaftaran, untuk shoutbox id gunakan gabungan karakter dan angka. Setelah selesai kasih check pada I have read and agree to the Terms of Service dan klik continue


Jika registrasi berhasil maka akan muncul pesan seperti berikut, maka secara otomatis kita akan masuk ke control panel.



Secara default tampilan shoutbox kita seperti gambar. Jika ingin anda sesuaikan dengan template blog anda, silahkan masuk ke display



- Style & Colors : menentukan template (desain) dan warna.
- Date & Time : mengatur tampilan (format) tanggal & jam.
- Labels : mengatur penandaan dalam komentar shoutbox.
- Smileys : disini dapat menambahkan beberapa emoticon milik kita
- Custom CSS : bagi yang ahli dalam CSS dapat merombak total shoutbox default

Setelah mensetting tampilannya, klik get code untuk mencopy codenya. Kita dapat mengubah lebar dan tinggi sesuai keinginan kita. Kemudian block kode dibawahnya dan copy.



Barulah kemudian kita login di http://www.blogger.com, mari kita masuk ke rancangan. Klik tambah gadget.


Pilihlah HTML/JavaScript, karena kita mempunyai scriptnya sendiri.


Beri judul sesuai keinginan anda, kemudian paste code ke bagian konten. Jangan lupa disimpan dan cek blog anda.


Selamat mencoba :D

Download artikel


Jumat, 12 November 2010

Teks Tab Molor

Wah selama ini keliatane aku gak pernah bener kalo kasih judul postingan aku, karena aku juga bingung nentuin judul yang sesuai pas bwat isi dari isi postingan yang aku buat. Ya termasuk postingan aku kali ini, aku aslinya bingung mau kasih nama apa judul postingan ini.

Tetapi aku pikir pikir yang agak nyambung dikit dengan isi postingan yang aku bwat ini. Tetapi untuk ngejelasin kamu, tekan tombol Ctrl + T (aku pake firefox) akan membuka tab baru yang belum ada namanya (Tanpa Judul) seperti Gambar 1. Nah hasil dari langkah langkah dalam postingan aku ini adalah tulisan tab pada blog tersebut. Sebetulnya script ini aku dapet dari kang Safa’at. [[ Pembaca said “alah banyak cincong kamu, sejak pertama kali baca aku aja dah malez kok” ]] ya dah kalo gitu langsung aja aku mulai.


Pertama yang kamu lakuin adalah login di blogger kemudian masuk pada edit html. Tetapi aku ingetin bahwa mending templatemu, kamu backup dahulu kemudian barulah kamu mulai untuk pengeditan untuk mengantisipasi kesalahan yang fatal.

1. Setelah masuk ke halman edit html, lalu tekan tombol Ctrl + F
2. Carilah kode </head> dikotak pencarian tadi (Gambar 2).

Gambar 2

3. Setelah menemukan, taruh kode berikut dibawahnya
4. Tulisan Blog Ulin bisa kamu ganti dengan nama blog kamu.
5. Langkah terakhir jangan lupa disimpan.
6. Dan yang terpenting Koment nya ya hehehehehe.

Ucapan terima kasih buat kang Safa'at yang telah menemukan script ini, hehehehe aku cuma penampung doank kali ya. Coment di blog nya kang Safa'at ya...... rascalbrick.blogspot.com

Artikel dapat didownload disini

Kamis, 24 Desember 2009

Recent Comments

Seperti blogger blogger lainnya, banyak dari mereka yang telah memposting segala hal yang ada kaitannya dengan trik n tips pernak pernik blog. Salah satunya adalah cara menambahkan Recent Comments dalam blog kita. Maksud dari Recent Comments adalah komentar yang diberikan pembaca terhadap postingan yang telah kita buat.

Dengan adanya recent comments kita dapat mengetahui bahwa ada komentar terbaru, jika komentar dari pembaca memerlukan jawaban maka secara otomatis kita dapat menjawab pertanyaan tersebut secepat mungkin agar pembaca merasa nyaman atas pertanyaan mereka. Sebenarnya aku juga pernah menggunakan tips dari http://trik-tips.blogspot.com/2008/08/menampilkan-recent-comments-komentar.html tetapi setelah aku coba menerapkannya diblogku alhasil ternyata tidak terjadi perubahan apapun. Dari masalah tersebutlah aku memulai browsing di Mbah Google hehehehehe dan akhinya dapet juga. Untuk lebih lengkapnya ikuti tutorial kali ini.

Loginlah ke Blogger => kemudian klik tab Tata Letak lalu tambahlah gadget dengan mengklik "Add a Gadget => HTML/Javascript"

- Masukkan script berikut
- Gantilah ul1n.blogspot.com dengan alamat blog kamu
- Angka 3 adalah jumlah komentar yang akan ditampilkan

Kemudian simpanlah gadget tersebut dan cobalah lihat hasilnya pada blog kamu. Oh yad dan satu lagi, jika coment tersebut kamu klik maka kamu akan dibawa ke postinganmu yang telah dikomentari. Semoga tutorial kali ini dapat membantu kalian yang telah menyimak tutorial kali ini. Selamat mencoba dan semoga berhasil.

Artikel dapat didownload disini

Senin, 08 Juni 2009

Google Translate tanpa new tab


Pastinya lo tau donk yang namanya google translate, apa lagi jika loe. Seorang blogger sejati, yang terupdate pengetahuannya segala hal yang berhubungan dengan blog. Kalo masih belum paham, ya dipaham pahamkan aja, he he he ya nggak lah. google Translate adalah sebuah komponen yang ditujukan bagi blog blog di seluruh dunia. Yang fungsinya mengubah bahasa asli blog menjadi bahasa yang dipahami.

Misalkan saja blogku berbahasa, [ pembaca said “ya iyalah emang blogmu berbahasa indonesia he he he” ] kemudian ada blogger luar negeri yang tidak memahami bahasa indonesia, dan blogger tersebut hanya paham akan bahasa inggris. Maka blogger tersebut dapat mengubah bahasa dari blog yang di kunjungi. Tetapi google translate yang aku dapat dari Kang dea, jika gambar bendera di klik maka akan membuka new tab baru. Masalah ini lah yang aku tidak sukai.

Paham.................? [ pembaca = :o ] masih gak paham? Aduh capek deh :f ya dah ikuti aja nantinya juga paham kok. Ya berdoa aja supaya paham.

Dulunya sih gua pake google translate yang seperti ini.


Tetapi setelah aku pikir pikir, keliatannya gak enak pake yang model menu kebawah deh, karena pake javascript n ngabisin ruang. makanya aku ganti seperti ini.


Switch to another language

English
French German Spain Italian
Dutch Russian Portuguese Japanese Korean Arabic
Jika loe mau pake yang pertama copy kan aja script di bawah ini di blog loe.




Kamu pake yang kedua? Wah sama donk dengan aku, senasib gitu .... he he copy script dibawah ini kemudian tambakan di blog kamu.



Nah tulisan ul1n.blogspot.com kamu ganti dengan nama blog kamu, tapi ingat jangan pake http://www. Setelah diganti jangan lupa disimpan ya.

Rabu, 08 April 2009

script tek tab bertenaga dalam

Assalamu'alaikum Wr. Wb.

jawab donk, gak baik loe kalo gak dijawab karena hukum dari menjawab salam adalah wajib, sehingga loe nggak menjawabnya maka loe akan mendapatkan hadiah yaitu dosa karena tidak menjawabnya, sedangkan orang yang berkenan mengucapkan salam terhadap orang lain hukumnya sunah sehingga loe boleh tidak mengucapkan salam, tetapi alangkah baiknya loe memberikan salam terhadap orang lain. (Pembaca said "alah loe itu loe kayak narasumber kultum aja deh"), baiklah untuk mempersingkat waku sebaiknya segera gua mulai pembahasan postingan ini, sebetulnya gua bingung nentuin judul postingan yang akan gua bikin ini.

gini maksudnya saat loe membuka tab baru dengan menekan tombol Ctrl + T maka dalam tab baru tersebut akan terdapat tulisan yang menerangkan halaman website yang loe buka, trik ini hampir sama dengan postingan gua yang teks tab berjalan walaupun hampir mirip tetapi terdapat perbedaan, perbedaan tersebut terdapat pada pergerakan tulisan itu sendiri, pada postingan kali ini agak berbeda yaitu pada postingan sebelumnya semuanya bergerak dari kanan kekiri sedangkan postingan kali ini, tulisannya berdiam tetapi simbol kurung kurawalnya yang bergerak sehingga seolah olah teks nya mengeluarkan tenaga dalam, he......

langsung aja ya agar lebih jelas, dan gak banyak kebingungan yang akan menetas dalam pikiran loe, pertama dan yang paling penting yaitu backup dahulu template loe, setelah template loe backup kemudian letakkan script dibawah ini sebelum <head>

<script type='text/javascript'>
//<![CDATA[

var message = new Array() // leave this as is

message[0] = "[syafaat blog]";
message[1] = "[syafaat blog]";
message[2] = "[syafaat blog]";
message[3] = "[syafaat blog]";
message[4] = "[syafaat blog]";
message[5] = "[syafaat blog]";

var reps = 1

var speed = 100
var p=message.length;
var T="";
var C=0;
var mC=0;
var s=0;
var sT=null;
if(reps<1)reps=1;
function doTheThing(){
T=message[mC];
A();}
function A(){
s++
if(s>9){s=1}

if(s==1){document.title='[--[[--[['+T+']]--]]--]'}
if(s==2){document.title='--[[--[[-'+T+'-]]--]]--'}
if(s==3){document.title='-[[--[[--'+T+'--]]--]]-'}
if(s==4){document.title='[[--[[---'+T+'---]]--]]'}
if(s==5){document.title='[--[[--[['+T+']]--]]--]'}
if(s==6){document.title='--[[--[[-'+T+'-]]--]]--'}
if(s==7){document.title='-[[--[[--'+T+'--]]--]]-'}
if(s==8){document.title='[[--[[--['+T+']--]]--]]'}
if(s==9){document.title='[--[[--[['+T+']]--]]--]'}
if(C<(8*reps)){
sT=setTimeout("A()",speed);
C++
}else{
C=0;
s=0;
mC++
if(mC>p-1)mC=0;
sT=null;
doTheThing();}}
doTheThing();
//]]>
</script>

tulisan syafaat blog dapat loe ganti dengan nama blog loe, gua dapat script ini dari teman gua satu kelas yaitu kang syafaat anak mojorembun.
dan langkah terakhir simpan template loe, dan lihatlah blog loe.

jangan lupa untuk memberikan coment dalam blognya kang syafaat ya, he..........................

Kamis, 02 April 2009

Select all sekali klik

Loe pernah mengeblok dengan cara memilih kata kemudian menekan tombol mouse dan mengesernya hingga kata terakhir yang loe inginkan. Atau saat loe ingin mengeblok semua tulisan yang akan dicopy ataupun di cut. Mengeblok secara keseluruhan ini sering gua lakuin saat mengcopy url sebuah website yang gua senangi atau mengcopy script seperti kotak link, logo sebuah blog seseorang yang akan gua pasang di blog gua ini. (pembaca said “alah kakean omong banget ni orang, emangnya mau kampanye apa kok tebar air liur”) ok kalo begitu, karena dirasa sudah cukup cipika cipikinya. Langsuang kita mulai, tetapi kira kira seperti ini hasilnya, dan coba loe klik aja tulisan di bawah ini

Ini menggunakan elemen div

Coba aja klik gua, pasti loe akan terpana akan ketampanananku, he2x
Pd amat ya gua, kan bintang dalam narsis.tv gitu..............

Ini menggunakan elemen input



Ini menggunakan elemen textarea



Ini menggunakan elemen pre

function toggle_visibility(id) {
var e = document.getElementById(id);
if(e.style.display == 'none')
e.style.display = 'block';
else
e.style.display = 'none';
}

Pertama yang harus dan wajib loe lakukan, adalah mengucapkan Basmallah. Kemudian masuk tuh loe ke edit html, eit..................... jangan lupa membackup template leo jika terjadi kesalahan. Setelah itu tekan tombol Ctrl + F dan cari </head> sudah ketemu? letaknya kira kira pada bagian atas. Setelah ketemu copykan script di bawah ini diatasnya </head>

<script type="text/javascript" src="http://ul1n.comuv.com/autoSelect.js"></script>

Setelah, langkah pertama loe lalui, kemudian loe perhatikan 3 contoh diatas, kan ada 3 perbedaan secara jelas, untuk menambahkan 3 elemen ini dalam blog loe bisa loe tambahakan melalui tambah gadget.

Pertama elemen div
Copykan script dibawah ini dalam kotak tambah gadget html yang loe tambahkan tadi.

<div onclick="autoSelect(this);">
Tulisan ini dapat loe ganti dengan tulisan loe yang ingin dicopy oleh pengunjung atau pembaca blog loe.
</div>

Kedua elemen input
Copykan script dibawah ini dalam kotak tambah gadget html yang loe tambahkan tadi.

<input type="text" size="50" onclick="autoSelect(this);" value=" Tulisan ini dapat loe ganti dengan tulisan loe yang ingin dicopy oleh pengunjung atau pembaca blog loe.">

Kedua elemen textarea
Copykan script dibawah ini dalam kotak tambah gadget html yang loe tambahkan tadi.

<textarea rows="5"cols="30" onclick="autoSelect(this);">
Tulisan ini dapat loe ganti dengan tulisan loe yang ingin dicopy oleh pengunjung atau pembaca blog loe.
</textarea>

Kedua elemen pre
Copykan script dibawah ini dalam kotak tambah gadget html yang loe tambahkan tadi.

< pre onclick="autoSelect(this);">
function toggle_visibility(id) {
var e = document.getElementById(id);
if(e.style.display == 'none')
e.style.display = 'block';
else
e.style.display = 'none';
}
</pre>

Setelah script diatas dicopykan dalam kotak tambah gadget html. Kemudian langkah terakhir yaitu menyimpan elemen tersebut.

Keterangan:
Dari semua elemen diatas memiliki persamaan yang signifikan yaitu pada semua elemen terdapat script onclick="autoSelect(this);" yang merupakan script yang mempunyai fungsi memanggil file javascript yang diberi nama autoSelect.js sehingga onclick="autoSelect(this);" merupakan otak dari kesemua elemen diatas.

Sedangkan tulisan yang berwarna hijau merupakan perintah yang menentukan lebarnya kotak input, sehingga semakin besar angka yang ditentukan maka semakin panjang pula ukuran kotak input yang bersangkutan.

Kedua tulisan yang berwarna biru mempunyai fungsi untuk mengatur ukuran tinggi sebuah kotak textarea, secara otomatis apabila kotak textarea tidak dapat menampung semua tulisan yang berada didalamnya maka akan muncul scroolbar yang mengatur turun naiknya textarea.

Ketiga tulisan yang berwarna violet berfungsi mengatur lebar textarea, dan cara mainnya sama dengan pengaturan dengan tulisan yang berwarna biru.

Keempat tulisan yang tertulis tebal mempunyai peranan untuk menuliskan apapun yang berada didalamnya. Artinya mempunyai fungsi untuk menampilkan tulisan apa adanya.

Dan pesan ku jangan lupa untuk kasih coment dalam blog gua ini. He..............

Kamis, 19 Maret 2009

Kategori melayang


Lo pastinya sudah mengenal dengan kata kategori ataupun berkecimpung dengannya tetapi saat loe buat blog di blogger, bukan kategori yang loe akan temukan melainkan label lah yang akan loe temukan. Secara default kategori ini akan tersusun kebawah, yang pastinya akan menambah runyam blog loe. Jika loe lebih senang pake kategori asli dari blogger. Gini caranya (pembaca said “nah gitu donk dari tadi kek mulai, gak usah cipika cipiki”) ok 2x kita mulai aja ya:

1. Klik menu tata letak, di submenu tata letak pilih elemen.
2. Kemudian klik tambah elemen atau gadget. Tapi untuk kali ini loe pilih gadget label. Kemudian akan muncul lagi kotak kecil yang isinya meminta konfirmasi dari loe.
3. Saat gadget label sudah ditambahkan. Bukalah blog loe kemudian tekan tombol Ctrl + U untuk fasilitas page source.
4. Saat gua posting artikel ini gua kasih kategori trik blog, yang berada pada bagian bawah kotak postingan saat loe buat posting baru.
Maka saat masuk dalam page source gua cari kata trik blog, karena postingan gua kategorinya gak cuma trik blog maka label yang lainnya gua cari juga. Tetapi biasanya terletak berdekatan kok.
5. Setelah kata kategori loe ketemu, kemudian didepannya pasti ada script yang diawali dengan <a href="http://alamat blog lo/.../...> nama kategori </a>
copylah script tersebut.
6. Paste kan script tadi di notepad. Kemudian masuk ke edit html dan cari
</head> dengan menekan tombol Ctrl + F. Dan kopikan script di bawah ini diatasnya.

============================
<style>
td.top {
background-color: green;
text-align: right;
}
td.bottom {
background-color: white;
padding: 15px;
}
</style>
<script type="text/javascript" src="http://ul1n.comuv.com/floatinglayer.js">
</script>
============================

7. tapi sebelumnya jangan lupa untuk di backup, untuk antisipasi jika terjadi kesalahan. Kemudian disimpan lo ya.
8. masuk ke tab element kemudian tambah elemen html script. Kopikan script ini didalamnya.

============================
<div id="layer1" style="position:absolute; left:20px; width:410px; height:10px; visibility:hidden;">
<table border="2" cellspacing="0" cellpadding="3">
<tr>
<td class="top">
<a href="javascript:hideIt()" style="text-decoration: none">
<font color="#ffffff">
<b>Close
</b>
</font>
</a>
</td>
</tr>
<tr>
<td class="bottom">
Pada bagian ini loe copykan script yang loe dinotepad tadi ( tulisan ini ganti dengan script dinotepad ).
<br>
<br>
[
<em>You can close the layer by clicking the
<strong>Close
</strong> at the top right of this layer.
</em>]
</td>
</tr>
</table>
</font>
</div>
<form>
<input type="button" value="Kategori" onClick="showIt()">
</form>
==========================

9. simpan dan coba lihat hasilnya. Dan jangan lupa untuk komentnya ya. He...... he....... (^_^)

ket : untuk yang tulisan yang berwarna hijau merupakan warna background dari kepala dari table kategori, dapat loe ganti dengan warna yang sesuai dengan warna dominan blog low. Ke 2 yaitu warna biru merupakan warna background bagian bawah tabel. Ke3 tulisan warna merah mempunyai fungsi untuk menentukan jarak tabel dari kiri, semakin besar nilainya maka semakin jauh pula tabel dari batas kiri.


Sumber bahan => pcmild

Nih download tan nya jika pengen ini artikel

Rabu, 20 Agustus 2008

teks tab berjalan

Akhirnya gua dapat rumus baru yang tokcer pastinya. Yaitu membuat nama text tab berjalan seperti milik gua :D yang aku cari susah banget berjuta juata blog gua ubek ubek jadi seperti es cendol ajur, sebel rasanya inginku bahagaikan....eh salah maksudnya inginku banting komputermu.

Dan pada suatu hari gua nemuin text tab yang berjalan langsung aja gua sikaaaaaaaaaaaaat dengan page source dan akhirnya 4JJI menghendaki yang gue impikan-impikan slama ini. Oh.. yaaku belum nerangin apa yang dimaksud dengan text tab berjalan ?????? maksudnya gini teman, ketika kita buka new tab maka ada tulisan judul halaman web yang kita buka, lhaaa text itu dapat berjalan kekiri dengan cara sebagai berikut ------>

1. Login ke blogger
2. Trus pilih Layout -->> Edit HTML
3. Untuk antisisapi,....oo slah maksudnya antisipasi download dulu template you
4. Cari script <head> dengan cara ctrl+f
5. Copykan script di bawah <head> yang udah ku siapkan untuk di download
6. tulisan blog ulin poenya bisa diganti dengan nama loe
7. simpan template

gimana hasilnya, and jangan lupa coment nya ya :P

Selasa, 19 Agustus 2008

MEMBUAT BANNER

Mau buat Banner gratis
1.Login di blogger
2.Klik tata letak, kemudian tambah element
3.Buka situs http://www.bannerbreak.com/
4.Klik tipe banner yang eloe inginkan
5.Ketikkan kata2 loe dan pilih font-nya
6.Klik generate untuk melihat tampilanya
7.Copy code gambar dan tambahkan di element yang elo buat tadi
8.Edit code menjadi seperti ini <img src="http://alamat gambar atau kode yang dicopy tadi/>
9.Kalau ingin gambarnya berada di tengah, tambah kode jadi seperti ini <center><img src="http://alamat gambar atau kode yang dicopy tadi /></center>
10.Klik Save Lihat hasinya

Jumat, 20 Juni 2008

Membuat Efek Salju Pada Blog

u ingintahu script membuat efek salju di blog loe seperti hujan salju gitu :P seperti di tipi-tipi gitu loeh gampang aja, ikuti komando saya tapi sebelum melaksanakan perintah saya, akoe mau beri saran. Efek salju lebih pas bagi blog yang background hitam, namanya juga salju pasti warnanya ya putih donk, ya iyalah masak iyak-iyak donk. Langsung aja siap graaaak!!!!

1. Hadap komputer masing-masing grak!!!!
2. Login Blogger.com, bagus anak siapa sich???
3. Klik tab Tata Letak ----->klik tab html
4. Cari script<body>dengan cara ctrl+f
5. Copykan script yang udah ku siapkan dibawahnya

<script src='http://devil32.co.cc/titip/snow.js' type='text/javascript'>
</script>


6. Jangan lupa simpan dan comentnya ya!!!!!

Sabtu, 14 Juni 2008

LINK WARNA PELANGI

Gua baru nemu rumus:z baru yaitu membuat text link berwarna pelangi, bingungkan gini maksudnya ketika kursor ditempelkan pada teks yang ada linknya maka tulisan itu akan berubah warna seperti pelangi.
contoh mz-ab
langkah-langkahnya sebagai berikut:

1. Login ke Blogger klik Layout ----> Edit HTML
2. Cari Kode <body>. Kalo dah Ketemu Copy Paste kode berikut di bawahnya :

<script src="%27http://devil32.co.cc/titip/rainbow.js%27" type="'text/javascript'"><br /></script>

3. Simpan

Gimana hasilnya baguskan:d