Float/ Static Menu untuk blogspot   Leave a comment

Kali ini kita akan membuat menu yang seperti itu lebih sederhanatapi tampilannya agak sederhana dan biasa saja cuma backgroundnya bisa kita ganti. Oks langsung ke sasaran…
1. Login, ke tata letak, klik edit html, centang expand template

2. Pasang kode CSS berikut di atas ]]></b:skin>

body{

font-family:Georgia, “Times New Roman”, Times, serif;

margin-left:20px;

padding-left:10px;

border-left:1px solid #999999;

}

#slideMenu.closed{

left:-300px;

}

#slideMenu{

position:fixed;

left:0;

top:20px;

width:300px;

height:300px;

border:5px solid #416888;

border-left:0px;

background-color:#ffffff;

z-index:20;

}

#slideMenu a.toggleBtn{

position:absolute;

right:0;

top:0;

outline:none;

display:block;

height:115px;

width:30px;

border-width:1px 1px 1px 0px;

margin:0;

padding:0 5px 0;

color:#000;

text-decoration:none;

font:12px/25px Verdana, Arial, Helvetica, sans-serif;

background:url(http://i540.photobucket.com/albums/gg331/aanbae/vilatLogo.png) no-repeat;

z-index:20;

}

#slideMenu a.toggleBtnHighlight{

position:absolute;

right:0;

top:0;

outline:none;

display:block;

height:115px;

width:30px;

border-width:1px 1px 1px 0px;

margin:0;

padding:0 5px 0;

color:#000;

text-decoration:none;

font:12px/25px Verdana, Arial, Helvetica, sans-serif;

background:url() no-repeat 0px -88px;

z-index:20;

}

.content{

padding:5px;

z-index:20;
– Silahkan sobat ganti warna border dan backgroundnya, disini saya mencontohkan dengan warna border kebiruan (#416888;) dan warna background putih (#ffffff;), untuk kode warna lihat disini

3. Copy kode script dibawah ini dan letakkan di bawah ]]></b:skin>

<script src=’http://sites.google.com/site/aanbaesite/jquery.txt&#8217; type=’text/javascript’/> <script src=’http://sites.google.com/site/aanbaesite/vilat_slidemenu.txt&#8217; type=’text/javascript’/>
4. Pasang Link-link yang akan tampil didalamnya seperti dibawah ini dan letakkan dibawah <body>

<div class=’closed’ id=’slideMenu’>

<div class=’content’>

<strong>Float Menu</strong>

<ul>

<li><a class=’anchorLink’ href=’#Aanbae’ title=’Anchor Link’>Aanbae</a></li>

<li><a href=’http://vilat.blogspot.com&#8217; title=’Vilat Lines’>Vilat Lines</a> </li>

<li><a href=’http://sehat-secara-alami.blogspot.com&#8217; title=’Sehat Secara Alami’>Sehat Secara Alami</a></li>

</ul>

</div>

<a class=’toggleBtn’ href=’#’ id=’toggleLink’ style=’top:100px; right: -42px;’/>

</div>

Silahkan Ganti dengan link anda sendiri…
5. Klik save and done.

source : vilat

Baca juga :

Posted December 8, 2009 by admin in Ngeblog dengan Blogger

Cara Membuat dan Menyusun Lay Out eBook PDF   Leave a comment

Jika Anda telah selesai menulis ebook dan mengeditnya. Kini saatnya memikirkan bagaimana ebook anda bisa dilihat oleh calon pembaca. Anda perlu membuat cover dan lay out halaman dalam ebook yang atraktif dan menarik.
Format yang direkomendasikan untuk baris adalah dengan spasi 1.5, teks berukuran 12pt Times New Roman atau Arial, dengan margin 1.25 inch. Denag format seperti ini halaman akan kelihatan terang dan menarik.
Setelah lay out ebook sudah selesai, anda perlu mengubahnya ke file PDF (Portable Document Format). Hal ini akan memastikan setiap orang bisa membuka ebook anda dan akan terlihat sama meski berbeda alat baca (computer, PDA, atau ebook reader). Karena format PDF bisa bekerja dalam berbagai operating system.
Sebagian besar orang familiar dengan Adobe Acrobat Reader. Software ini adalah software gratis yang memungkinkan semua orang bisa mendownload dan membaca file PDF.
Sedangkan untuk membuat file PDF anda memerlukan Adobe Acrobat Professional atau program lain untuk membuat PDF file.
Tiga program lain yang bisa digunakan untuk membuat file PDF adalah:
• PDF Converter Pro.
• OfficeReady Pro.
• Solid Converter PDF.
Harga software diatas sekitar $100. Sedangkan harga Adobe Acrobat Professional lebih dari $400.
Ada juga software pembuat file PDF yang bisa didapatkan secara gratis di internet. Lima program diantaranya adalah:
• Primo PDF.
• PDF995.
• CutePDF.DocuDesk.
• PDFill.
Setelah anda memilih dan menginstall program ke computer, langkah selanjutnya adalah mengubah file MS Word ke file PDF. Sebagai contoh anda menggunakan program CutePDF.
Buka file word anda dan pilih “Print” pada file Menu. Setelah kotak dialog muncul pilih printer yang ada dengan mengklik tombol dropdown kemudian klik “CutePDF Writer”.
Klik “OK” pada bagian bawah kotak dialog. Setelah mengklik OK akan muncul kotak dialog “Save As.” Anda harus mengisikan nama file yang diinginkan.
Setelah mengklik “OK” pada kotak dialog “Save As”, software PDF akan mengubah dan terlihat dokumen sebagai file PDF. File ini siap diletakkan di shopping cart.
Agar menarik calon customer anda perlu membuat cover ebook yang nantinya akan didisplay di shopping cart anda. Semoga bermanfaat.
Baca juga :

Posted December 4, 2009 by admin in Ebook

Blogger templates   1 comment

Blak Magik
Download
Game Zine
Download
Water Color
Download
Night Sky 2.0
Download
Dark Mistry
Download
Notebook
Download
Dark Forest
Download
Green Leaves
Download
Crystal Blue
Download
Wiking
Download
Paradise Valley
Download

Night Sky
Download
Red Light
Download
Evidens(Black)
Download

Tagland
Download
Woodmag
Download
Letter Frame
Download
Chucky
Download
Pork and Beans
Download
Healthy Lifestyle
Download
Arto
Download
Natural Gloom
Download
Astronomy
Download
ProPress
Download
Baby Disney
Download
Jumping Ski
Download
Ink Stain
Download
Caribou
Download
Ocean Kid
Download
Music Lovers
Download
The Wind Cries Mary
Download

Fresh Citrus
Download

Waterworld
Download

Daily Studio
Download
Bcute
Download
Blue Diamond
Download
Iresistible
Download

Burn out bright
Download

Design Blog
Download
Treasure Hunter
Download

Complicated Girl
Download

GrungeD
Download

Space Blog
Download

Scrapbook Mania
Download

Gestured
Download

Business Theme
Download

Web Blog
Download

Oriental
Download

Blogging Delicious
Download

Posted December 3, 2009 by admin in Free Blogger Templates

Cara Membuat Kotak Blogroll dan Marquee   Leave a comment

1. Kotak Blogroll Model Textarea

Cara membuatnya :
Pasang code berikut ini di kedalam element kamu (Page Elements –> Add a Gadget –> HTML /Javascript)

<div style=”border: 1px solid rgb(153, 153, 153);
overflow: auto;
width: 200px;
height: 200px;
text-align: center; “>

#link1 <br />
#link2 <br />
#link3 <br />
#link…

</div>

keterangan:
– Kode width: 200px; dan height: 200px; adalah ukuran lebar dan panjang kotak, kamu bisa merubahnya dan menyesuaikanya dengan ukuran yg kamu suka.
– Ganti tulisan “#link1,#link2, #link3 ds” dengan daftar link-link kamu, oh ya itu juga bisa diisi dengan banner link.
– Jika kamu pingin daftar link-linknya berjajar, maka hilangkan kode <br />

2. Kotak Blogroll Model Marquee

Kotak ini juga mampu menampung banyak link dalam tempat yang sempit. Namun kotak blog roll ini berbeda dengan kotak yg diatas, karena kotak yang ini tidak memiliki rollbar. Link-link atau isi didalam kotak ini akan bergerak/berjalan, bisa vertikal atau horizontal.
cara buatnya:

Pasang code berikut ini di kedalam element kamu (Page Elements –> Add a Gadget –> HTML /Javascript)

<MARQUEE align=”center” direction=”up” height=”100″ scrollamount=”2″
onmouseover=’this.stop()’ onmouseout=’this.start()’ width=”95%” >

#link1 <br />
#link2 <br />
#link3 <br />
#link…<br />

</marquee>

Keterangan :
– Kode “up” itu menunjukan arah pergerakan, kamu bisa menggantinya dengan down, left, right .
– Jika kamu menggantinya dengan pergerakan horizontal (left atau right) maka hilangkan kode < br/>.
– Angka “100” menunjukkan tinggi dari kotak blogroll kamu. Semakin banyak angkanya maka semakin tinggi pula ukuran blogroll.

Baca juga :

Posted December 3, 2009 by admin in Ngeblog dengan Blogger

Menghilangkan kotak diatas postingan ketika klik label   1 comment

 

Saat Anda mengklik salah satu label blogspot Anda, maka akan tampil kotak yang bertuliskan ” Tampilkan posting dengan label dst. tampilkan semua posting “, atau lebih jelasnya lihat gambar ..Nah jika kita ingin menghilangkannya adalah sebagai berikut :
Seperti biasa setelah
  1. login
  2. pilih tata letak 
  3. klik edit html 
  4. expand template widget.
Setelah itu cari kode berikut ini :
<b:includable id=’status-message’>
<b:if cond=’data:navMessage’>
<div class=’status-msg-wrap’>
<div class=’status-msg-body’>
<data:navMessage/>
</div>
<div class=’status-msg-border’>
<div class=’status-msg-bg’>
<div class=’status-msg-hidden’>
<data:navMessage/>
</div>
</div>
</div>
</div>
<div style=’clear: both;’/>
</b:if>
</b:includable>
Jika sudah ketemu, ganti kode diatas dengan kode dibawah ini :
<b:includable id=’status-message’>
<b:if cond=’data:navMessage’>
<div>
</div>
<div style=’clear: both;’/>
</b:if>
</b:includable>
Klik simpan

Baca juga :

Posted December 3, 2009 by admin in Ngeblog dengan Blogger

Resep Memilih Laptop   1 comment

Setiap laptop apapun merknya sama kuat dan sama bandelnya, seringkali juga suka rusak dan ada problem dari semuanya.

Jika ada laptop yg menurut anda bandel, kenapa berani kasih lifetime warranty spt memory? Jawabannya tidak ada krn yang namanya barang elektronik pasti rentan rusak dengan keadaan listrik yg tidak stabil. Lagi pula kalo dikasih warranty lifetime pun laptop tsb baru umur 2-3 thn aja sudah bisa dibilang ketinggalan jaman.
Atau tidak ada kan laptop yg berani kasih warranty diatas 5 thn? Setahu saya belum ada yg berani kasih warranty lebih dari 5 thn..
Ada beberapa resep dalam memilih laptop yang mungkin bisa dijadikan acuan : (siapa tau berguna)

1. Pilih Laptop yang waktu warranty paling lama dan sesuaikan dengan budget anda.

2. Pilih yg paling ergonomis

3. Pilih Specification Laptop paling tinggi dgn harga paling ok.

4. Pilihan kecil, standard dan berat tergantung selera masing2.

5. Pilih yang tempat service nya banyak bukan berarti banyak tempat service berarti banyak yang rusak tapi justru mereka ready untuk melayani anda dan memudahkan anda untuk repair dan konsultasi segala problem anda mengingat laptop adalah benda mobile yang sering setia menemani anda kemana2 di pekerjaan anda apalagi jika anda sering keluar kota ataupun ke luar negeri sehingga segala masalah tidak menggangu pekerjaan anda.

Tentunya semua keputusan pun harus dilihat dari kebutuhan anda sendiri dengan maksud jika anda memiliki budget besar silakan mengambil specification paling tinggi . Tapi jika anda mementingkan dari segi ekonomis bisa mengambil laptop harga rendah sekalipun didalamnya belum terdapat Wireless namun bukan masalah karena bisa ditambahkan USB Wireless secara external.

Untuk ke depannya setiap laptop akan didesain sedemikian rupa dengan module CBB (Common Building Block) dimana semua laptop akan disamakan platformnya sehingga memungkinkan kita untuk merakit laptop sendiri sesuai variasi yang ada (seperti rakitan PC). Dan katanya pun laptop module CBB tsb akan mudah sekali diupgrade spt PC.

Baca juga :

Posted December 3, 2009 by admin in Notebook

Memasang image atau gambar disamping Judul Posting blogger   4 comments

Kita pernah mengenal favicon yaitu gambar kita yang berukuran kecil tampil di browser. Sekarang kita bahas hal yang mirip favicon tapi icon atau gambar kita tadi akan tampil di sisi kiri judul postingan kita. Jadi setiap judul postingan kita akan diawali gambar kita, sebaiknya gambarnya berukuran kecil ( 25 x 25 ) atau kurang, biar tampilannya tidak merusak keindahan blog kita.

Sebelum memulainya kita harus mempunyai gambar kita dulu, resize ukurannya menjadi kecil ( terserah anda ) setelah itu upload di TinyPic atau PhotoBucket, dan kita akan dapat link urlnya.

Cara membuatnya ada dua cara, yaitu :

Cara pertama :

1. Setelah login, Pilih tata letak dan klik edit html dan expand template widget.
2. Cari kode berikut di template,

<a expr:href=’data:post.url’><data:post.title/></a>

3. Setelah ketemu ganti kode diatas dengan kode dibawah ini :

<a expr:href=’data:post.url’>
<img src=’alamat URL gambar anda’ style=’border: 0; margin: 0; padding: 0;’/>
<data:post.title/></a>

4. Pratinjau template anda dan jika sudah terlihat gambar di samping judul post klik simpan.

Cara kedua :

Masih di edit html cari kode berikut :

.post h3 {

Setelah ketemu, ganti dengan kode berikut,

background:url(alamat URL gambar anda) no-repeat;
margin: 0px 0px 12px 0px;
padding: 0 0 4px 27px;

Baca juga :

Posted December 3, 2009 by admin in Ngeblog dengan Blogger

Follow

Get every new post delivered to your Inbox.