Showing posts with label Blogger Widget. Show all posts

Color Code

0 comments



Di dalam dunia web/blog, warna itu sangat penting dan sangat berpengaruh terhadap penampilan web/blog. Warna-warna biasanya digunakan untuk background, text, links, table dll. Kalo kombinasi warna pada web/blog kita tidak sesuai, atau tidak enak dipandang mata mata, maka hal itu akan membuat pengungjung web/blog kita menjadi kurang nyaman, dan kemungkinan akan malas untuk mengunjungi blog kita lagi. Tapi karena untuk untuk membuat warna-warna ini harus menggunakan kode-kode warna, maka bagi yang tidak begitu mahir tentang html akan kesulitan untuk mendapatkan kode-kode warna ini.

Nah oleh karena itulah dibawah ini telah  dibuatlah Chart HTML Kode Warna bagi yang tidak tahu atau bagi yg pingin tahu kode-kode warna. Cara penggunaannya cukup mudah, km tinggal klik warna yang kamu pilih, maka kode warnanya akan tampil di kotak "kode warna:". Ok silahkan dicoba.





























































































































































































































Kode warna :

Membuat Buku Tamu / ShoutMix Tersembunyi Di Sisi Blog

4 comments

ShoutMix atau Buku Tamu atau kolom komentar yang tersembunyi di sisi blog juga bisa menghemat ruang blog. Kalau blog anda penuh dengan konten maka sebaiknya anda menggunakan shoutmix tersembunyi agar blog terlihat rapih. Langkahnya :

1. Masuk dulu ke shoutmix.com untuk mendapatkan kode shoutmix anda, klik disini aja nih, setelah masuk klik create shoutbox, isi semua kolomnya trus centang "I have read and agree to the Terms of Service." Lanjut klik continue. Kalo udah dapet kodenya simpan dulu kode shoutmix anda.
2. Seperti biasa login ke akun blogger anda, klik Rancangan > Lemen Halaman > Tambah Gadget>pilih HTML/JavaScript.
3. Masukkan kode berikut nih :


<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('http://i37.tinypic.com/345o85i.gif') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
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">

LETAKKAN KODE SHOUTMIX/CBOX ANDA DI SINI

<div style="text-align:right">
<a href="javascript:showHideGB()">
[CLOSE]
</a>
</div>

</div>

</div>

<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>


4. Ganti kalimat " LETAKKAN KODE SHOUTMIX/C BOX ANDA DISINI" dengan kode shoutmix yang sudah anda simpan tadi. Sesuaikan gambar, tinggi, lebar, dan garis tepi dengan mengganti tulisan yang berwarna biru sesuai dengan selera anda.
5. Simpan dan selesai...


selamat mencoba!

Membuat You Might Also di Blog

0 comments
Nah kali ini saya ingin membahas cara membuat related post yang lebih menarik yaitu dengan menambahkan thumbnail atau gambar didalamnya. Agar lebih jelas perhatikan gambar ini.


Menarik bukan? Cara ini bisa digunakan bersamaan dengan related post tanpa thumbnail. Bagi anda yang tertarik untuk memasangnya, ikuti langkah-langkah berikut:


1. Buka menu Design -> Edit HTML

2. Beri centang pada "Expand Widgets Templates"
3. Letakkan kode berikut diatas </head>


<!--Related Posts with thumbnails Start--> <!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'> <style type='text/css'> #related-posts { float:center; height:100%; min-height:100%; padding-top:10px; padding-left:15px; padding-right:15px; } #related-posts h2{ font-size: 1.3em; color: black; font-family: Arial; margin-bottom: 0.75em; } #related-posts a{ color:black; } #related-posts a:hover { background-color:#eeeeee; } </style> <script type='text/javascript'> var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhV_jOcEhCpE6x_2PA8ZhxM56TpTLfR1hoDJwEisoy3nAZ-dGM-uJs1Y_GDhbhZdtOexefm3S-X8BYcpgsfq5Aj4IjHVmZ5F9f-gZZwq3YXF2Nyyo85Z5wTwzO6M2h_mCSxb-Xd9SuENX83/"; var maxresults=5; var splittercolor="#cccccc"; var relatedpoststitle="You might also like:"; </script> <script src='http://hermanblog.googlecode.com/files/related-posts-with-thumbnails-for-blogger.js' type='text/javascript'/> <!-- remove --></b:if> <!--Related Posts with thumbnails End-->


4. Lalu cari <p class='post-footer-line post-footer-line-1'/>
5. Kalau tidak ketemu coba cari post-footer-line 
6. Letakkan kode berikut dibawahnya.

<!-- Related Posts with Thumbnails Code Start--> <!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'> <div id='related-posts'> <b:loop values='data:post.labels' var='label'> <b:if cond='data:label.isLast != &quot;true&quot;'> </b:if> <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:loop> <script type='text/javascript'> removeRelatedDuplicates_thumbs(); printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;); </script> </div><div style='clear:both'/> <!-- remove --></b:if> <!-- Related Posts with Thumbnails Code End-->


Keterangan:
var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhV_jOcEhCpE6x_2PA8ZhxM56TpTLfR1hoDJwEisoy3nAZ-dGM-uJs1Y_GDhbhZdtOexefm3S-X8BYcpgsfq5Aj4IjHVmZ5F9f-gZZwq3YXF2Nyyo85Z5wTwzO6M2h_mCSxb-Xd9SuENX83/" menunjukkan gambar yang muncul pada postingan yang tidak memiliki gambar. Anda bisa mengganti gambar tersebut dengan gambar lain.

var maxresults=5 menunjukkan jumlah postingan yang muncul pada related post. Silahkan atur jumlah postingan yang mau ditampilkan dengan mengganti angkanya.

var splittercolor="#cccccc" menunjukkan warna garis pemisah. Ganti cccccc dengan kode warna yang anda inginkan.

var relatedpoststitle="You might also like:" menunjukkan judul related post. Ganti teks yang berwarna merah dengan judul yang anda inginkan.


Bagi anda yang merasa cara diatas terlalu sulit, anda bisa menggunakan widget related post dengan thumbnail yang disediakan oleh linkwithin.com. Untuk cara pemasangannya sangat mudah, berikut langkah-langkahnya:

Bagi anda yang merasa cara diatas terlalu sulit, anda bisa menggunakan widget related post dengan thumbnail yang disediakan oleh linkwithin.com. Untuk cara pemasangannya sangat mudah, berikut langkah-langkahnya:


2. Isi data-data yang diperlukan pada form yang telah disediakan

Email      : alamat email anda
Blog link : Alamat blog dimana anda memasang widget related post with thumbnail
Platform  : pilih Other
Width     : pilih jumlah related post yang mau ditampilkan

Beri centang pada kotak kecil jika anda menggunakan background template yang gelap

3. Klik Get Widget

4. Copy dan paste kode script yang diberikan diatas </body> pada template blog anda lalu simpan template anda. Selesai

Jika ada yang kurang jelas atau mengalami kendala dalam memasang related post dengan thumbnail silahkan tinggalkan komentar anda dibawah ini. Saya akan berusaha untuk membantu anda. 

7. Kalau sudah Save template anda. 


semoga bermanfaat :)

Widget Pendeteksi Alamat IP ( IP Address Detector )

0 comments
IP Address Detector merupakan suatu tools yang digunakan untuk mendeteksi IP Address dari setiap pengguna. Dengan demikian setiap pengunjung dapat mengetahui IP Address mereka saat memasuki situs anda.

Sebelum membahas lebih jauh tentang IP Detector, kita harus tahu apakah IP Address itu?
IP Address (Internet Protocol Address) adalah logical address dari adapter jaringan. Alamat IP adalah unik dan mengidentifikasi komputer pada jaringan. Sebuah alamat IP dapat swasta, untuk digunakan pada LAN, atau publik, untuk digunakan di Internet atau WAN (Wide Area Network) lainnya.
Nah, setelah mengetahui apa IP address itu maka disediakanlah tools yang berfungsi sebagai pendeteksi IP Address pengunjung. Widget IP Address Detector ini selain sebagai pendeteksi IP Address, dapat juga mempercantik tampilan website maupun blog pembaca setia SMART Son. Maka dengan sangat bangga Frozer Files membagi beberapa Script HTML dari IP Address Detector sebagai hasil penjelahan selama ini sebagai berikut:

1. Single IP Address Detector

what is my ip address?

Code:
<img src="http://www.ongsono.com/show_ip_address.php" border="0" alt="what is my ip address?" /></a> <!--Check IP Address Link End-->

2. Multi Detector IP Address

IP

Code:
<img src="http://www.wieistmeineip.de/ip-address/" border="0" width="125" height="125" alt="IP" /></a>

3. IPligence Detector IP Address - Vertical

geolocation database

Code:
<img src="http://www.ipligence.com/freetools/iplocation/b2/" alt="geolocation database" /></a>


4. IPligence Detector IP Address - Horizontal

geolocation database

Code:
<img src="http://www.ipligence.com/freetools/iplocation/b1/" alt="geolocation database" /></a>

Tanpa banyak cingcong lagi, berikut adalah langkah - langkah menambahkan IP Address Detector pada website pembaca setia Frozer Files


A. Blogger


1. Browse ke blogger.com dan login.
2. Klik "Layout" kemudian pilih "Page Elements".
3. Klik "Add a gadget", setelah muncul sebuah jendela "Add a Gadget" cari dan tambahkan "HTML/Java Script"
4. Copy and Paste salah satu HTML Script diatas pada kotak "HTML/Java Script"
5. Klik Save.
6. Selesai.


B. Wordpress


1. Login ke dashboard wordpress anda.
2. Pada "Appereance", klik "Widgets"
3. Tambahkan widget "TEXT" ke sidebar wordpress anda.
4. Copy and Paste salah satu HTML Script diatas ke dalam kotak "TEXT"
5. Klik Save.
6. Selesai.


C. Website.


1. Login ke panel admin website anda.
2. Copy and Paste salah satu HTML Script diatas ke dalam gadget sidebar website anda.
3. Klik Save.
4. Selesai.

Pasang Translator Dari Google Translate

0 comments
Buat yang gemar menghias blognya dengan berbagai macam widget, saya nemuin widget nih yang ga cuma menuhin blog kawan2, tapi lumayan juga khasiatnya ( kaya jamu aja ya ).
yaitu Translator yang dibikin oleh google translate (yaa begitu yang saya tau mah).

pertama buka link ini:



Disitu ada 4 step.
step yang pertama dilewat aja, fokus ke step no 3 dan 4 karena disitulah kita men-setting hal-hal yang utama dari widget translator ini.

naahh, kalau udah selesai semua cari dan klik tombol ADD TO BLOGGER

selesai deh... selamat mencoba!

Frozer Corporation Bloggers - Meet Millions of Bloggers Frozer Corporation
 
Indonesian Streets