Tampilkan postingan dengan label blog. Tampilkan semua postingan
Tampilkan postingan dengan label blog. Tampilkan semua postingan

Kamis, 27 Mei 2010

Cara membuat link download

OK,langsung aja kita bahas bagai mana cara membuat link download..gampang saja pertama kamu tulis <a href="URL TUJUAN" target="new">NAMA URL TUJUAN</a>
contoh:
<a href="http://www.pajenk-akbar.co.cc" target="new" title="pajenk blog">PajenkBlog</a>
maka hasilnya seperti ini :
pajenk blog

Selanjutnya cara membuat link download beserta gambar :
sebenernya sama kya yang di atas cuma ditambah html gambarnya yg kita ambil dari tempat penyimpanan gambar,
contoh :

<center>
<a href='http://ziddu.com' target="new"><img src="http://i868.photobucket.com/albums/ab247/pajenkblog/pajenk%20blog/download.png" border="0" alt="Photobucket" title="isi terserah kamu" width="200" height="50">
</center>

maka hasilnya seperti ini:


Photobucket



nah,,tulisan warna merah itu gambarnya bisa kamu pakai gambar sendiri tapi syaratnya mesti di upload di photobucket atau juga ngambil di photobucket.

keterangan :
a href : untuk memanggil link tujuan
</a> : untuk mengakhiri
title : Pesan akan muncul saat mouse berada di atas teks
target="new" : untuk membuka tab baru
center : supaya gambar/link downloadnya berada di tengah - tengah.

sekian dlu tips dari saya kurang lebih saya minta maaf...

Cara menyembunyikan navbar

Banyak para blogger ingin menghilangkan navbar yang berada di atas pada blog kita yang terdapat tulisan posting baru, kostumisasi, daftar, dan keluar,tapi ada beberapa blogger yang ingin menghilangkan navbar ini, hal ini tentu saja melanggar peraturan yang telah diterapkan,akibatnya blog kita bisa di ban alhasil kita tidak dapat mengakses blog kita lagi. Untuk mewujudkan keinginan kamu, kita bisa menyembuyikan navbar tersebut dengan auto hide navbar. Caranya adalah sebagai berikut :

1.klik kostumisasi dan kemudian edit HTML
2.Cari kode body {
3.Masukkan kode di bawah ini di atas kode kode body {

#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}

4.Jika sudah klik simpan dan lihat blog kamu


arahkan mouse pada bagian teratas blog kamu, maka akan muncul navbar yang telah disembunyikan. Apabila mouse kamu arahkan ke tempat lain, maka navbar akan kembali hilang atau disembunyikan.menari

Jika ingin menghilangkan navbar dari blog kita gini caranya:takbole

Masukan kode berikut persis di bawah kode <body> :

<style type='text/css'>
#navbar-iframe {display:none;}
</style>

Untuk template klasih masukan di atas code </style> :

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

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


Untuk template baru simpan kode yang berada di atas, di atas kode ]]></b:skin> :

Lalu klik save template...

Mau pilih yang mana??menghilangkan navbar atau menyembunyikannya,tapi klo masih penasaran pengen menghapus navbar ya silahkan saja tapi resikonya tanggung sendiri yah...setan

Semoga behasil..tepuktangan

ide dari atan-hacker

Membuat efek marquee/teks berjalan

Kali ini saya akan memberitahukan trik membuat Marquee atau teks berjalan,trik ini banyak diminati para blogger dan webmaster karena program ini menarik untuk di lihat serta dapat menghemat tempat pada blog kita. Teks berjalan ini bisa kita atur gerakannya, baik dari kiri ke kanan, kanan ke kiri, atas ke bawah maupun bawah ke atas. Selain itu, kita juga bisa memasukkan link ke dalam teks yang bergerak tersebut.
Berikut ini adalah contoh hasil dari teks berjalan atau marquee :

Keterangan:
BGCOLOR="COLOR" --> Untuk mengatur warna background (latar belakang) teks

DIRECTION="left/right/up/down" --> Mengatur arah gerakan teks

BEHAVIOR="scroll/slide/alternate" --> Untuk mengatur perilaku gerakan

Scroll --> teks bergerak berputar
Slide--> teks bergerak sekali lalu berhenti
Alternate --> teks bergerak dari kiri kekanan lalu balik lagi ( bolak-balik bo)

TITLE='pesan" --> Pesan akan muncul saat mouse berada di atas teks

SCROLLMOUNT="angka" --> mengatur kecepatan gerakan dalam pixel, semakin besar angka semajin cepat gerakannya.

SCROLLDELAY="angka" --> Untuk mengatur waktu tunda gerakan dalam mili detik

LOOP="angka|-1|infinite" --> Mengatur jumlah loop

WIDTH="lebar" --> Mengatur lebar blok teks dalam pixel atau persen

1. Marquee kanan ke kiri:
<MARQUEE align="center" direction="right" height="100" scrollamount="2" width="30%">

marquee dari kanan ke kiri

</MARQUEE>
Hasilnya:


marquee dari kanan ke kiri


2. Teks berjalan dari kiri ke kanan dan berhenti pada saat mouse ditujukan pada teks:

<marquee onmouseover="this.stop()" onmouseout="this.start()">KIRI ke KANAN dan BERHENTI</marquee>
Hasilnya:

KIRI ke KANAN dan BERHENTI

3. Teks bergerak bolak-balik : kiri -> kanan -> kiri:

<marquee behavior="alternate">Bolak Balik</marquee>
Hasilnya:

Bolak Balik

4. Teks bergerak dari bawah ke atas:

<marquee direction="up">BAWAH ke ATAS</marquee>
Hasilnya:

BAWAH ke ATAS

5. Teks bergerak dari atas ke bawah:

<marquee direction="down" width="100%" height="100">ATAS ke BAWAH</marquee>
Hasilnya:

ATAS ke BAWAH

6. Marquee dengan variasi huruf dan latar brlakang:
<span style='font-family:arial; font-size: 14px; font-weight:bold; color:#000000;'> <marquee bgcolor='#80FF00' direction='left' height='20px' scrollamount='3' width='100%'>MARQUEE DENGAN LATAR BELAKANG</marquee></span>
Hasilnya:
MARQUEE DENGAN LATAR BELAKANG

7. Contoh marquee yang di dalam nya terdapat link :

<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="100%" height="100" align="center">
<a href="http://www.pajenk-akbar.co.cc" target="new">Pajenk Blog</a><br/>
<a href="http://www.facebook.com" target="new">facebook </a><br/>
<a href="http://kolom-iklan.blogspot.com" target="new">Kolom iklan </a><br/>
</marquee>

Hasilnya



Pajenk Blog


facebook


Kolom iklan







Itulah beberapa contoh teks berjalan atau marquee yang bisa anda masukkan ke dalam blog, tinggal pilih mana yang ingin di masukkan.,Mau yang rata kanan atau kiri terserah lah..Atau sobat blogger bisa menggabungkan marquee dari keterangan di atas supaya lebih terlihat menarik...
selamat mencoba..!!!

Read more otomatis dengan gambar

Kali ini saya akan memberikan trik bagaimana cara membuat tulisan readmore otomatis beserta gambar,sebenernya cara ini sama aja kya cara bikin readmore yang lainnya tapi uniknya di tambah gambar biar lebih menarik,,gimana oksengihnampakgigi??? jika kamu tertarik silahkan ikuti cara - cara nya dibawah ini, langsung aja gk pake lama ...

Caranya :
1. Log in blogger.com
2. Dasbor > tata letak > edit HTML
3. Centang Expand Template Widget
4. Cari kode
5. Copy kode di bawah ini,dan letakkan di atas


<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 250;
summary_img = 250;
img_thumb_height = 120;
img_thumb_width = 120;
</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(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>


6. Lalu cari kode <data:post.body/> atau <p><data:post.body/></p>
7. Ganti kode tersebut dengan kode di bawah ini..

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script>
<span class='rmlink' style='float:right'><a expr:href='data:post.url'><img src='URL GAMBAR'/></a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

Keterangan :
==> Summary noimg 430 = Tinggi artikel terpenggal tanpa image.
==> Summar img 430 = Tinggi artikel terpenggal dengan image.
==> URL GAMBAR = Diisi dengan file gambar kamu sendiri yang di upload dari Photobucket atau tempat penyimpanan gambar lainnya.

8. Save template
semoga berhasil...:sinchan

Minggu, 23 Mei 2010

Cara memperlebar halaman template blog

Mungkin para sobat yang baru bikin blog merasa template yang di sediakan oleh blogger terlalu sempit atau kurang lebar. Sobat ingin merubah template sobat hingga menjadi lebih lebar? Bagaimana caranya..? Mungkin ada beberapa cara untuk merubah halaman template. Dan saya biasa menggunakan cara sebagai berikut,yang saya anggap paling sederhana.

Dan tidak perlu panjang lebar lagi kita mulai saja caranya.
Yang perlu kita ketahui beberapa bagian dari template yang nantinya kita
bisa ubah ukurannya:

Outer-wreper : Lebar template secara keseluruhan
Main-wrapper : Bagian dimana kita biasa posting artikel
Sedebar-wrapper : biasanya terletak di kanan atau kiri dari main wraper
Header- wrapper : Bagian paling atas dari template
Footer-wrapper : Dasar atau berada paling bawah

Sekarang masuk ke blog sobat, klik tata letak kemudian edit html.Pada edit
html sobat tidak perlu kasih centang pada Expand template widget.
Kemudian cari code sebagai berikut:

#outer-wrapper {
width: 660px;
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}
#main-wrapper {
width: 410px;
float: $startSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#sidebar-wrapper {
width: 220px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */

Sobat bisa ganti ukuran pada teks yang berwarna biru. Sobat bisa ganti dengan ukuran berapa saja,biar keliatan rapi sesuaikan ukurannya. Misal :

#outer-wrapper {
width: 950px;
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}

#main-wrapper {
width: 500px;
float: $startSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#sidebar-wrapper {
width: 400px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */

Jika lebar outer-wrapper: 950px maka jarak main-wraper dan sedebar-wraper harus di sesuai:

Main-wrapper:500px
Sedebar-wrapper: 400px
Sedang sisanya yang 50px merupakan jarak agar sedebar dan postingan blog tidak berhimpitan.
Setelah itu jangan lupa sesuaikan juga lebar header-wraper dan footer-wraper sama dengan outer-wraper

#header-wraper{
width: 950px
margin:0 auto 10px;
border:1px solid $bordercolor;
}

#footer {
width:950px;
clear:both;
margin:0 auto;
padding-top:15px;
line-height: 1.6em;
text-transform:uppercase;
letter-spacing:.1em;
text-align: center;

Sebelum menyimpan template,dianjurkan supaya mengklik PRATINJAU terlebih dahulu supaya kamu bisa lihat hasilnya,,,klo hasilnya memuaskan baru kamu SIMPAN TEMPLATE..
ok slamat mencoba...