Tips & Trik Blog

cara merubah link pada blogspot

Tutorial Cara Merubah Warna Link Pada Blogspot ini adalah untuk menjawab pertanyaan dari sahabat blogger kita yaitu Place to modify blog, bertanya melalui kolom komentar yang pertanyaannya begini: " bozz, buat recent comment yg kayak punya bozz itu gmn caranya? warna komentatornya warna hijau,, punyaku biasa2 aja".

Setelah saya pikir-pikir, mungkin yang memerlukan artikel semacam ini tidak hanya sahabat Place to modify blog saja, tapi masih ada yang lain, maka akhirnya saya memutuskan untuk menjawab pertanyaan tersebut melalui posting ini, ya itung-itung buat nambah jumlah posting yang berarti akan menambah jumlah pengunjung blog ini, betul khan?

Lho koq pertanyaan dengan jawaban/judul posting tidak nyambung? Tenang saja tidak perlu khawatir ntar pasti nyambung.

Mengapa warna komentatornya pada recent comment blog ini koq berwarna hijau? Karena pada saat menulis komentar, sang komentator menautkan link/url pada identitasnya, sehingga nama komentator warnanya berubah menjadi warna link.

Sebenarnya warna link yang ada di recent comment itu sama dengan yang ada di posting maupun di sidebar blog ini, coba perhatikan semua teks yang mengandung link/url pada blog ini, kecuali pada lable, semua warnanya sama, artinya adalah yang perlu dilakukan hanya merubah warna link blog saja.

Nah biar lengkap, berikut ini Cara Merubah Warna Link Pada Blogspot:
  1. Login ke Blogger => Rancangan => Edit HTML, kasih centang pada Expand Template Widget;
  2. Cari kode ini a:link { contoh struktur kode yang ada di template blog ini:

    a:link {
    color: #0AF251;
    color:#04B33A;
    text-decoration:none;
    }

  1. Gantilah kode color (warna) sesuai selera Anda;
  2. Save Template, lalu perhatikan apa yang terjadi? Heheeeeee, selesai.

Gimana gampang khan? Oh ya sering-sering aja nanya biar saya nggak pusing-pusing cari materi buat posting blog ini, tapiiiiiiiiiiiiiiiii yang ditanyakan sebaiknya seputar blog ini, kalau diluar itu berarti saya harus googling dulu atau menjawab dengan jawaban "saya tidak tahu", maklum masih belajar juga, he he heeeeee…….


















= = = = = = = => Selamat Mencoba, Semoga Sukses!!! <= = = = = = = =
 
 
 


langsung aja copy paste di bawah ini:
Edit HTML java script paste lalu save
dan lihat hasilnya

<script src="http://ujiecaprone.com/js/bintangputih.js" type="text/javascript"></script>


ebelum Anda membaca artikel ini lebih lanjut, coba perhatikan dahulu di bawah posting ini, disana terdapat 2 (dua) kolom yang satu kolom Feed RSS dan satu lagi kolom Related Post (Artikel Terkait). Itulah pembahasan kita kali ini yaitu Cara Menambah 2 (dua) Kolom di Bawah Posting.

Adapun Cara Membuat atau Menambah 2 (dua) Kolom di Bawah Posting atau Artikel adalah sebagai berikut:
  1. Login ke Blogger/Blogspot => Rancangan/Layout => Edit HTML, Download Template Lengkap dan beri tanda centang Expand Template Widget;
  2. Cari kode ]]></b:skin> ;
  3. Di atas kode ]]></b:skin> letakkan kode di bawah ini:

#related{background:#eee url(http://lh6.ggpht.com/_pt7i0nbIOCY/SuPuxFn6_FI/AAAAAAAACXU/z314-b9H97c/dot_thumb.gif) 45% 0 repeat-y;border:1px solid #ddd;color:#000;margin:0 0 10px;padding:15px}
#related .related-posts{font-weight:400;width:53%;float:right}
#related .related-posts p{margin:0}
#related .related-posts h3,#related .related-posts h2,#related .related-posts h1{font-size:12pt;letter-spacing:0;margin:0}
#related .related-posts ol{font-weight:400;margin:2px 0 0}
#related .subscribe{width:43%;float:left;color:#000}
#related .subscribe p.intro{font-weight:400}
#related .subscribe p.feed{margin-bottom:10px;font-weight:700;padding-left:21px;background:url(http://lh3.ggpht.com/_pt7i0nbIOCY/SuPmf8r8eqI/AAAAAAAACXM/BYjbuwVwxas/FeedIcon-16_thumb.gif) 0 50% no-repeat;vertical-align:middle}
#related .subscribe form{margin:0;padding:0}
.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden}
.clearfix{display:inline-block}

4. Cari kode di bawah ini:
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/> </b:if>

5. Letakkan kode di bawah ini diantara kode:  
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/> dan kode: </b:if> :<div class='clearfix' id='related'>
<div class='subscribe'>
<p class='feed'>
<a href='
http://disini letakkan Link Feed anda/feeds/posts/default'>Berlangganan via RSS Feed</a></p><p class='intro'>disini letakkan kode Form Berlangganan Anda</p></div>
<div class='related-posts'>
disini letakan kode Related Post Anda</div></div

7. Simpan Template, selesai!!!

CARA MEMBUAT CHATBOX
  • Langkah Pertama yang kamu perlukan adalah membuka alamat website chatbox di www.cbox.ws. Setelah masuk ke halaman utama, Klik Sign Up. Kemudian isi data tersebut seperti alamat email, alamat blog dll. Jika sudah mengisi data tersebut dengan lengkap, klik Create my Cbox!


  • Setelah itu kamu akan masuk di Control Panel Home, Klik Look & FeelColours & Fonts

  • Lalu kamu akan masuk pada halaman untuk mengedit chatboxmu. Edit warna dan style chatboxmu sesuaikan dengan skin blogmu. Jika sudah selesai klik Apply. Setelah itu Klik Publish 

  • Jika sudah, maka anda akan masuk pada halaman CODE GENERATOR. Isikan alamat blog mu pada Your Website. Beri tanda centang pada Enable Quick Link. Isikan Security Tag sesuai kode yang tertera..

  • Pada Step 1 Where are you installing your chatbox? klik tanda panah ke bawah pilih Blogger / Blogspot.

  • Pada Step 2 Choose a variation : Klik tanda panah ke bawah pilih Inline (default).

  • Pada step 3 Get your code. Blog semua dan copy script tersebut.

  • Sekarang kamu log in pada bloggermu. Setelah masuk, Klik Rancangan, kemudian Elemen Laman. Klik Tambah Gadget. Setelah muncul jendela baru, pilih HTML/Javascript klik tanda tambah. Kemudian Isikan Kode ini :
<!-- left hidden chatbox by http://29101996.blogspot.com/ START -->
<style>
#hcl {
position:fixed;
top:50px;
left:0px;
z-index:+1000;
}
* html #hcl {position:relative;}
.hcltab {
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('http://3.bp.blogspot.com/_Z_KyM3IvEFQ/S2Evq5hIpUI/AAAAAAAABAM/3qo6ScKImhw/s400/cbred-LEFT.png') no-repeat;
}
.hclcontent {
float:left;
border:2px solid #790909;
background:#f3f6f7;
padding:10px;
}
.hc-credit {font-size:9px}
.hc-credit a {text-decoration:none}
</style>
<script type="text/javascript">
function showHidehcl(){
var hcl = document.getElementById("hcl");
var w = hcl.offsetWidth;
hcl.opened ? movehcl(0, 30-w) : movehcl(20-w, 0);
hcl.opened = !hcl.opened;
}
function movehcl(x0, xf){
var hcl = document.getElementById("hcl");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
hcl.style.left = x.toString() + "px";
if(x0!=xf){setTimeout("movehcl("+x+", "+xf+")", 10);}
}
</script>
<div id="hcl">
<div class="hclcontent">

<script chat kamu> taruh sini script kamu

di bawah ini contoh punya gue:
<!-- BEGIN CBOX - www.cbox.ws - v001 -->
<div id="cboxdiv" style="text-align: center; line-height: 0">
<div><iframe frameborder="0" width="200" height="305" src="http://www4.cbox.ws/box/?boxid=3924026&amp;boxtag=n9kpmp&amp;sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain" style="border:#000000 1px solid;" id="cboxmain"></iframe></div>
<div><iframe frameborder="0" width="200" height="75" src="http://www4.cbox.ws/box/?boxid=3924026&amp;boxtag=n9kpmp&amp;sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform" style="border:#000000 1px solid;border-top:0px" id="cboxform"></iframe></div>
</div>
<!-- END CBOX -->


chatbox kamu pasang di tengah yg berwarna merah
 
<br />
<div class="hc-credit">
<span style="float:left">
<!-- THIS CREDIT MUST STAY INTACT FOR LEGAL USE -->
<a href="http://29101996.blogspot.com/2010/06/hidden-chatbox.html" target="_blank">
Get this widget!
</a>
</span>
<span style="float:right">
<a href="javascript:showHidehcl()">
[close]
</a>
</span>
</div>
</div>
<div class="hcltab" onclick="showHidehcl()"> </div>

</div>
<script type="text/javascript">
var hcl = document.getElementById("hcl");
hcl.style.left = (30-hcl.offsetWidth).toString() + "px";
</script>
<!-- left hidden chatbox by http://29101996.blogspot.com/ END -->