TRIK BLOG

CARA MEMBUAT BLOG GRATIS !! BUAT SEKARANG JUGA !!

Langsung aja ya ke topik pembahasan

1. kalian haruslah memiliki email di gmail seperti postingan sebelumnya yang membahas Daftar Gmail
2. setelah anda memiliki email di gmail maka otomatis anda sudah memiliki account blogger.com buka blogger dot com

Cara Buat Blog

3. Setelah itu Klik Create a Blog (settingan English)

Cara Buat Blog

4. Otomatis anda akan di bawa kehalaman create blog seperti gambar di bawah ini

Cara Buat Blog

• isi Blog title nya (judul blog terserah anda mau diisi apa)
• terus isi blog address isi alamat address blog anda (yang anda inginkan) lantas klik Check Availability apabila tersedia berarti belom ada yang make nama blog tersebut namun bila ada yang memakai nama blog tersebut sebaiknya anda mengganti nama blog anda tersebut (tipsnya andaikata anda mengininkan nama trikblog dan sudah ada yang memakai anda bisa menambahkan seperti ini trik-blog atau tr-ikblog apabila anda benar2 suka dengan nama tersebut)
• kemudian isi Word Verification isi dengan captcha yang benar loh setalah itu klik Continue

5. Setelah itu anda akan di suruh memilih template blog yang anda sukai seperti gambar dibawah ini, template bisa di sesuaikan dengan yang anda mau. pilih saja asal terlebih dahulu karena nanti bisa di sesuaikan lagi kok

Cara Buat Blog

klik salah satu template yang anda suka

kemudian klik Continue

blog anda sudah terbuat, selamat blogging :)

Cara Buat Blog

SELESAI, sekarang anda tinggal mengisinya sesuka hati anda.

klik Start Blogging untuk memulai blog. terima kasih anda telah membaca artikel ini :)

capek juga ya hehehe :)

CARA MEMBUAT LINK PADA BLOG!

buat para blogger yang tidak tahu cara membuat link pada blog yang kalian miliki, saya akan memberikan cara tips dan triknya secara cuma-cuma alias gratis. hehe lebay ^.^

dan inilah caranya:

• jika tidak ingin membuat jendela atau tab baru pada browser (jika di klik) anda dapat menggunakan cara seperti dibawah ini. tinggal di copas aja kodenya
  
  <a href='http://www.AlamatWeb.com'>Nama Blog</a>
• jika ingin membuat jendela atau tab baru pada browser (jika di klik) anda dapat menggunakan cara seperti dibawah ini. tinggal di copas aja kodenya
  
  <a href='http://www.AlamatWeb.com' target='new'>Nama Blog</a>
  
  atau anda bisa gunakan yang ini
  
  <a href='http://www.AlamatWeb.com' target='_blank'>Nama Blog</a>
• jika anda ingin membuat link (Klik Disini) maka anda dapat menggunakan kode dibawah ini
  
  <a href='http://www.AlamatWeb.com' tittle='Blogger Tips' target='_blank'>Nama Blog</a>
• Adapun Tips Cara untuk Membuat Links Email, sebagai berikut dibawah ini
  
  Mailto link: <a href="mailto:webmaster@example.com">Send e-mail</a>

Untuk teks yang berwarna merah adalah tempat tujuan link yang akan anda tautkan. Untuk teks yang berwarna biru adalah untuk menunjukkan nama yang akan anda munculkan pada blog anda.

Gimana? Mudah bukan? hehe :)

jika anda2 mengalami kesulitan silahkan tanyakan saja pada saya, sebisa mungkin saya akan memberikan jalan keluarnya. hehe ^.^

6 cara untuk menampilkan Website anda dihalaman pertama google

Seo/Belajar SEO adalah cara-cara untuk membuat halaman web anda dapat di index oleh Search Engine (SE) dan mendapatkan PageRank atau Ranking halaman yang tinggi sehingga dapat tampil di halaman awal SE tersebut ketika sebuah kata kunci (keyword) dimasukkan. Dengan kata lain, belajar SEO atau Search Engine Optimization adalah sebuah seni dan metode untuk membuat halaman website anda "menarik"  bagi search engine seperti Google dan Yahoo.
Sebagai contoh silahkan anda membuka search engine paling top saat ini di google lalu ketikkan keyword "Belajar seo" di kotak pencarian. tanpa tanda petik. Nah, hasil pencarian yang keluar adalah halaman website yang telah di index oleh google, dan dimasukkan ke dalam database mereka.
Hasil pencarian yang muncul di halaman pertama, terutama di halaman posisi 5 teratas, adalah halaman web yang di nilai oleh Google sebagai halaman website yang memiliki pagerank paling tinggi. Halaman ini juga di sebut sebagai hot zone.
Sampai saat ini tidak ada orang yang tahu secara pasti apakah kriteria Google dalam menilai ranking sebuah halaman karena hal ini dirahasiakan oleh mereka, dan kriteria tersebut tampaknya selalu berubah mengikuti situasi dan kondisi yang terjadi di dunia Internet Marketing.
Semua usaha untuk optimizing sebuah halaman wev dilakukan berdasarkan kriteria yang pernah diterapkan oleh search engine dan dengan cara mengamati dinamika yang terjadi di dunia Internet Marketing.
Praktek untuk optimasi website pada pertengahan tahun 90an oleh para webmaster (pengelola website). Pada saat itu langkah yang dilakukan oleh para webmaster adalah mengirimkan atau mensubmit alamat (URL) mereka ke Search Engine, dan kemudian SE akan mengirimkan web crawler atau spider mereka ke website tersebut, menelusuri halaman demi halaman lalu mendownload halaman tersebut untuk di index dan di simpan ke database mereka.
Selanjutnya program pengindex akan mencari informasi dalam website tersebut, untuk menentukan pagerank sesuai dengan standar masing-masing search engine.
Seiring dengan meningkatnya kompetisi di dunia bisnis online, para webmaster mulai mencari cara untuk mengakali sistem dari search engine demi memenangkan persaingan memperebutkan posisi teratas di SERP (search engine result page).
Hal ini juga memaksa search engine untuk selalu memperbaiki sistem mereka dari waktu ke waktu. Search engine merancang sistem index mereka dengan dasar beberapa faktor, antara lain:

• nama domain
• judul
• html tags
• kata kunci yang digunakan
• nama file image
• frekwensi update website
• sitemap
• kepadatan kata kunci
• dll

Selain itu link dari web lain yang menuju website bersangkutan juga menjadi pertimbangan yang penting. Untuk membuat website kita dapat segera di index oleh search engine, kita dapat melakukan langkah-langkah seperti berikut:

mensubmit alamat web kita ke google

Aktif fi forum yang sesuai dengan tema website kita ( misal topik tentang belajar SEO,  belajar internet marketing dll ) lalu membuat signature yang menunjuk ke alamat website kita. hal ini juga berlaku untuk membuat comment di blog-blog milik orang lain dengan menyertakan alamat website di comment anda.

Membuat blog di blogger atau blogspot yang sesuai dengan tema website kita, lalu membuat link yang menuju website kita. blogger.com adalah salah satu jaringan blog kesayangan google, sebuah blog baru disana dalam beberapa hari sudah di index google sehingga dengan meletakkan link kita di sana crawler milik google dapat segera mengikuti dan menemukan website kita

Membuat beberapa artikel pendek yang kemudian kita submit ke article directory, biasanya article directory menyediakan fasilitas biodata pengarang dan memperbolehkan pengarang meletakkan alamat websitenya disana, satu lagi link mengarah ke website kita.

Selalu mengupdate website kita, minimal seminggu 2 kali, google spider sangat menyukai website yang dinamis sehingga mereka akan sering berkunjung ke web anda.

Mengajak pemilik website lain dengan tema yang sama untuk saling bertukar link/banner.

Dalam belajar SEO banyak sekali hal yang harus diperhatikan sehingga sulit untuk membuat sebuah web yang langsung sempurna SEO-nya, dengan kata lain optimasi sebuah website dilakukan secara gradual dan terus menerus berubah. Langkah-langkah di atas adalah langkah minimal yang bisa kita lakukan sembari kita terus belajar dan menambahkan optimasi secara perlahan sampai website kita benar-benar "optimized"

sumber: caksub.com-marketing-watch.com/blog

update 20 nov 2009
Berikut cara lainnya, untuk mempromosikan blog anda. social bookmarking kombes.com bisa anda akses di:http://bookmarking.kombes.com. Social bookmarking, sarana cepat untuk mempromosikan tulisan/berita anda. Kombes.com merupakan social networking blogger indonesia yang di lengkapi dengan social bookmarking untuk mempromosikan tulisan anda.
Berikut beberapa kelebihan Social Bookmarking Kombes.com
bukan hanya sekededar social bookmarking, tapi juga sebuah social bookmarking. Disini anda juga bisa berbagi berita dan menjalin persahabatan.
Connect dengan Facebook, anda bisa menggunakan account Facebook anda untuk login di Kombes.com Promosi tulisan/berita anda lebih cepat, karena akan langsung di distribusikan ke seluruh member kombes.com dan juga memberi Facebook yang terkoneksi dengan Kombes.com
Data lengkap tentang tulisan/berita anda submit: jumlah klik, jumlah vote, anda juga bisa tau siapa aja yang vote, dll
Cepat di index oleh search engine terutama google.
Anda juga bisa menikmati fasilitas lainnya dari Kombes.com seperti chat room, om chat, forum, group, dll.


Untuk kali ini saya pemilik akun apw site akan berbagi cara permalink seo di blogspot.
Untuk buar permalink pada blogspot berbeda dengan membuat permalink pada wordpress, pada blogspot kita harus memasang permalink manual untuk dijadikan permalink otomatis pada setiap posting, itu akan membuat posting anda akan lebih kuat dalam bersaing di search engine, karena salah satu kegunaan yang paling penting untuk membuat seo permalink di blogspot adalah untuk mendongkrak posisi posting blog di search engine.


Membuat permalink seo di blogspot
Berikut ini adalah cara membuat permalink di blogspot yang cukup mudah. anda tinggal mengikuti langkah-langkah yang sudah saya sediakan:

• Anda harus login ke blog anda terlebih dahulu
  http://www.blogger.com/ atau http://www.draft.blog.com/
• Kemudian anda masuklah ke bagian rancangan dan pilih kotak edit html
• jangan lupa untuk mencentang expand template widget (terdapat di atas kotak semat template html)
• sekarang cari kode berikut ini ]]></b:skin> (tekan ctrl f pada browser anda untuk mempermudah pencarian)
• letakkan kode css dibawah ini di atas kode merah
  .buatpermalinkblogger
  {border: 1px solid #EFF0F1;
  padding: 5px;
  background: #ffffff;-moz-border-radius:5px;
  
  .buatpermanlinkblogger a
  {background:none;}
  img.float-right {margin: 5px 0px 0 10px;}
  img.float-left {margin: 5px 10 px 0 0 px;}
• setelah itu cari kode <data:post.body/>
• setelah anda menemukan kode tersebut, hapuslah kode tersebut dan ganti dengan kode di bawah ini
  
  <b:if cond-'data:blog.pageType == &quot;item&quot;'>
  <p><data:post.body/></p>
  <div class='buatpermainblogger'>
  <center><small>Anda sedang mencari artikel tentang <strong><u><data:blog.pageName/></u><strong> dan anda bisa menemukan artikel <data:blog.pageName/> ini dengan url <strong><data:post.url/></stromg>,anda boleh menyebar luaskannya atau mengcopy paste-nya jika artike; <strong>data:blog.pageName/></strong> ini sangat bermanfaat bagi teman-teman anda,namun jangan lupa untuk meletakkan link <u><aexpr:href='data:post.url'><data:blog.pageName/></a></u> sebagai sumbernya.</small></center></div><b:else/>
  <p><data:post.body/></p>
  </b:if>
  

• kemudian simpan dan lihatlah hasilnya :)

Gimana SOBAT?? GAMPANG BUKAN???
Cara membuat permalink pada blog readmore
untuk memasang permanlink pada blog yang sudah memakai sistem html readmore, sedikit berbeda. berikut adalah caranya:

• Masuklah ke blogger anda
• Kemudian masuklah ke bagian rancangan dan kemudian pilih semat edit html
• kemudian jangan lupa untuk mencentang tulisan expand template widget
• pada cara di permalink di atas anda disuruh untuk mencari kode berikut <data:post.body/>

untuk yang sudah memasang readmore kode di atas akan ada dua, sehingga akan terlihat seperti ini kode tersebut

• <b:if cond='data:blog.pageType == "item"">
  <style>.fullpost{display:inline;}</style>
  <p><data:post.body/></p>
  <b:else/>
  <style>.fullpost{display:none;}</style>
  <p><data:post.body/></p>
  <a expr:href='data:post.url'><strong>Selengkapnya...</strong></a></p>
  </b:if>
  
• anda tinggal sisipkan kode permalink SEO anda di bawah kode berikut ini:
  
• <b:if cond='data:blog.pageType == "item"">
• <style>.fullpost{display:inline;}</style>
• <p>data:post.body/></p>
  
• maka permalink anda tidak akan terlihat pada homepage, hanya akan terlihat saat anda membuka posting blog.

Cukup mudah bukan cara membuat permalink di blogspot?

jika anda mengalami kesulitan, silahkan berkomentar saja :)

Cara Mendisable Klik Kanan & CTRL+U pada Keyboard

Cara/setting untuk mematikan/menon-aktifkan klik kanan dan block/select isi blog dan penekanan select Ctrl-A bisa pake script yang belibet, maupun memanfaatkan fungsi-fungsi html itu sendiri yang sangat simpel.

Fungsi-fungsi ini berguna jika si empunya blog tidak menginginkan blognya dikopi paste secara gampangan tanpa minta ijin, alias tulisan postingan kita tidak mudah dikopi paste. Walaupun dengan usaha/cara trik-trik lain bisa membuka/memblok/mengkopi-paste isi blog juga. Tapi cara dibawah, lumayanlah bisa mengurangi tindakan korupsi eeeh... kopi-paste. Penjelasan Fungsi html yang dipakai :

oncontextmenu='return false;'

adalah untuk mematikan menu klik kanan

onkeydown='return false;'

adalah untuk mematikan tombol/keyboard Ctrl-A, Ctrl-U (page source) dan tombol keyboard lainnya eeeh... kalo ngelihat page source dari menu masih kok. Cara melihat page source pada web/blog yang mematikan fungsi klik kanan mouse, klik kiri mouse dan penekanan keyboard (Ctrl+A, Ctrl+U) adalah : jika pakai firefox, buka menu View, lalu pilih Page Source (Ctrl+U). Hasilnya adalah tulisan postingan dalam 1 baris panjaaaaang. Cari aja postingannya ndiri...

onmousedown='return false;'

adalah untuk mematikan klik select mouse

'return false'

adalah untuk mematikan fungsi yang diinginkan

Cara men-disable klik kanan dan CTRL+U pada keyboard

Masuk ke edit html
Cari <body>
Gantikan kode tersebut dengan kode dibawah ini

<body oncontextmenu='return false;' onkeydown='return false;' onmousedown='return false;'>

Anda bisa memilih 1 fungsi aja atau 2 fungsi atau ketiga-tiganya, terserah deh... anda yang punya blog kok.

sumber: http://ranctea.blogspot.com/2011/01/cara-mendisable-klik-kanan-ctrlu-pada.html

Cara Menghilangkan Proteksi Klik Kanan

Saya yakin pastinya sudah banyak sobat blogger yang menjumpai blog yang menggunakan proteksi script anti klik kanan. Pasti kesal dong pas mau mengcopy tutorial atau script yang diperlukan eh ternyata klik kanan pada mouse tidak berfungsi sama sekali. Mau ngetik ulang malas dan bikin ribet ujung-ujungnya ngedumel dalam hati.."sumpah..gue gak bakalan 2x ngunjungi blog elu..!!" ha ha. Men-disable klik kanan di halaman blog memang sengaja dimaksudkan untuk menghindari aksi tukang copas yang tidak bertanggung jawab, main asal copy saja tanpa mau menyertakan link sumber artikel yang dicopy mentah-mentah. Sebenarnya inti dari script anti klik kanan adalah menonaktifkan javascript sehingga klik kanan pada mouse tidak bisa difungsikan. Nah untuk menghilangkan proteksi klik kanan ini sangat mudah, sobat hanya perlu menonaktifkan javascript pada browser anda.

Membuka Disable Klik Kanan di Firefox :

1. Klik menu Tools kemudian pilih Option.
2. Klik tab Content, hilangkan tanda centang pada tulisan "Enable Javascript".

Membuka Disable Klik Kanan di Chrome :

1. Klik Tool > Option > Under the Hood > Content Setting.
2. Pilih opsi "Do not allow any site to run Javascript".

Membuka Disable Klik Kanan di Opera :

1. Klik Menu > Setting > Preferences 
2. Klik tab Advance
3. Pada bagian Content, hapus tanda centang pada Enable Javascript.

Itulah tadi sedikit trik bagaimana cara membuka disable klik kanan di blog. Semoga bisa membantu sobat blogger yang sudah 'bete' gara-gara ngga bisa copas script tutorial atau widget yang diperlukan untuk blognya. Namun kalau sobat mengcopy artikel orang lain dengan tujuan untuk memposting ulang di blog anda, sebaiknya cantumkanlah link sumber artikel tersebut sebagai bentuk penghargaan kita terhadap hasil karya intelektualitas orang lain. Sebagaimana yang pernah disampaikan oleh Tukang Pos bahwa "...mencantumkan link sumber tidak akan mengurangi kualitas sebuah artikel/postingan !". Salam Blogger.

sumber: http://rayhanzhampiet.blogspot.com/2011/11/tips-membuka-disable-klik-kanan-pada.html

Cara mudah membuat scroll halaman pada sidebar atau

halaman blog

Mungkin tips semacam ini sudah banyak di posting oleh blogger-blogger pendahulu, tapi saya yakin masih banyak blogger-blogger pemula yang belum mengerti dan bahkan agak mengabaikan tips semacam ini.

Biasanya scroll halaman di perlukan pada saat jumlah postingan anda sudah banyak dan berniat untuk membuat daftar isi pada sidebar blog anda, atau untuk membuat daftar link teman yang jumlahnya sudah terlalu banyak. Kalau tidak dibuatkan scroll halaman, pastinya akan memakan banyak tempat pada sidebar blog anda.

Contoh scroll halaman :

Contoh 1

Cara membuat scroll

Cara membuat scroll

Cara membuat scroll

Cara membuat scroll

Contoh 2

 Lombok dihati 
 Lombok dihati
 Lombok dihati
 Lombok dihati

Apakah anda berminat membuatnya?? Silahkan copy kode dibawah, dan pastepada Widget teks biasa/HTML blog anda, atau kalau anda ingin menampilkannya pada postingan anda, silahkan paste pada halaman ”New Post” anda (paste pada halaman mode HTML bukan Visual) 

div style=”overflow:auto;width:190px;height:130px;background-color:#004D61;text-align:center;border:0solid #999999;padding:0;”>

<p style=”text-align: center;” align=”center”><span style=”font-size:13pt;”><a href=”http://lombokdihati.wordpress.com/2011/07/22/cara-mudah-membuat-scroll-halaman-pada-sidebar-atau-halaman-blog/“>Cara Membuat Scroll</a></span></p>

Untuk Contoh nomor 2 diatas, silahkan Copy kode dibawah.

dan untuk mendapatkan link Gravatar(warna hijau), klik kanan gambar Gravatar teman anda, kemudian klik Copy Image Address Selanjutnya Paste pada tulisan yang berwarna hijau dibawah.

<div style=”overflow: auto; width: 250px; height: 100px; background-color: #00 ce d1; text-align: left; border: 1px solid #999999; padding: 1px;”>

<p class=”MsoNormalCxSpFirst” style=”line-height: normal; text-align: left;”><em><span style=”font-size: 12pt; font-family: ‘Arial’, sans-serif; color: #0070c0;”><a href=”http://lombokdihati.wordpress.com/“><img src=”http://1.gravatar.com/avatar/545b58eb8abe5ec34002506012e1a4e8?s=32&amp;d=wavatar&amp;r=G” alt=”Nyoman CNd ” /></a> </span></em><span style=”font-size: 12pt; font-family: ‘Arial’, sans-serif; color: #0070c0;”><a href=” http://lombokdihati.wordpress.com/” target=””_blank””>Lombok dihati</a></span><em></p>

• Angka yang berwarna merah adalah lebar scroll (sesuaikan dengan lebar sidebar blog anda)
• Angka yang berwarna biru adalah tinggi scroll
• Angka yang berstabillo kuning adalah warna dasar dalam scroll. untuk memilih warna dasar silahkan klik disini
• Center(tengah)adalah posisi tulisan/gambar dalam areal scroll (anda bisa ganti dengan left=kiri atau right=kanan)
• Angka yang berwarna hijau adalah ketebalan garis tepi (kalau anda tulis angka  ”0”  itu artinya scroll halaman anda tanpa ada garis tepi)

• Angka yang berstabillo ungu  adalah warna garis tepi.

Setelah semua anda sesuaikan, kemudian jangan lupa klik tombol simpan. Selanjutnya anda login ke Beranda blog anda, dan lihatlah hasilnya.

Cara Membuat Text Berjalan Pada Postingan Blog

Langsung saja ke triknya gan:

Untuk membuat teks berjalan caranya sangat mudah, dalam bahas HTML disebut Marquee.

Berikut Ini Cara dari Marquee Teks:

Berjalan Dari Kanan Ke Kiri

Format yang ini merupakan marquee standar agar teks anda bisa berjalan secara default berjalan dari kanan ke kiri.

Tag Html:

<marquee>TEKS PUNYA ANDA</marquee>

Contoh:

APW SITE BLOG

Berjalan Dari Kiri Ke Kanan

Format ini kebalikan dari format yang pertama yaitu membuat teks berjalan dimulai dari kiri ke kanan :

Tag Html:

<marquee direction="right">TEKS PUNYA ANDA</marquee>

Contoh:

APW SITE BLOG

Berjalan Bolak Balik (Kiri Ke Kanan / Kanan Ke Kiri)

Format ini membuat teks berjalan bolak-balik memantul kiri ke kanan dan kanan ke kiri.

Tag Html:

<marquee behavior="alternate">TEKS PUNYA ANDA</marquee>

Contoh:

APW SITE BLOG 

Berjalan Dari Bawah Ke Atas

Format ini membuat teks anda berjalan dari bawah ke atas.

Tag Html:

<marquee direction="up">TEKS PUNYA ANDA</marquee>

Contoh:

APW SITE BLOG

Berjalan Dari Atas Ke Bawah

Format membuat teks berjalan dari atas ke bawah.

Tag Html:

<marquee direction="down">TEKS PUNYA ANDA</marquee>

Contoh:

APW SITE BLOG

Membuat Text Berhenti Jika Diarahkan Oleh Mouse

Jika kita arahkan mouse pada teks tersebut maka text tersebut akan berhenti.

Tag Html:

<marquee onmouseover="this.stop()" onmouseout="this.start()">TEKS PUNYA ANDA</marquee>

Contoh:

APW SITE BLOG

Anda bisa menerapkan format ini pada ke text berjalan di atas dengan menambahkan kode Html pada tag pembuka.

<marquee behavior="alternate" onmouseover="this.stop()" onmouseout="this.start()">TEKS PUNYA ANDA</marquee>

Contoh

APW SITE BLOG

Mengatur Kecepatan Text Berjalan

Untuk mengatur kecepatan menggunakan perintah:

scrollamount="10"

Untuk mengatur kecepatan teks ganti angka pada bertanda petik diatas ("10"), semakin kecil nilai ditulis maka motion akan semakin lambat dan semakin besar nilai yang dibuat juga semakin cepat motion teks yang akan muncul.

Tag Html:

<marquee scrollamount="20">TEKS PUNYA ANDA</marquee>

Contohnya:

APW SITE BLOG

Mengatur Batas Ruang Text Berjalan

Untuk mengatur batas ruang menggunakan perintah:

width="100%" height="100"

Badingkan contoh berikut height="40" dan height="80"

Contoh

<marquee direction="up" width="100%" height="40">Teks Anda</marquee>

APW SITE BLOG

<marquee direction="up" width="100%" height="80">Teks Anda</marquee>

APW SITE BLOG

SELAMAT MENCOBA

Cara Membuat Scroll Bar didalam Posting

wah keren juga ya kalau di dalam posting ada scrollbarnya kalau anda penasaran, langsung saja lihat cara berikut ini. caranya cukup mudah kok

-login terlebih dahulu -masuk ke tata letak &gt;&gt; edit HTML

-beri tanda centang pada "Expand Template Widget"
-cari kode ]]&gt; kemudian copy dan letakkan code berikut diatasnya :

.scrollbox {
height:100px;
width:400px;
overflow:auto;
}
-lihat text yang berwarna merah itu adalah ukuran scrollbar . . anda bisa menggantinya dengan ukuran yang anda inginkan... -simpan template

-pada saat anda posting, letakkan isi posting yang akan di scrollbar di antara code<div class="scrollbox"> dan </div> 

-sebagai contoh ,

<div class="scrollbox">

ini contoh yang saya maksud, ini adalah isi dari postingan yang berada di dalam scrolbar. ini contoh yang saya maksud, ini adalah isi dari postingan yang berada di dalam scrolbar. ini contoh yang saya maksud, ini adalah isi dari postingan yang berada di dalam scrolbar. ini contoh yang saya maksud, ini adalah isi dari postingan yang berada di dalam scrolbar. ini contoh yang saya maksud, ini adalah isi dari postingan yang berada di dalam scrolbar. ini contoh yang saya maksud, ini adalah isi dari postingan yang berada di dalam scrolbar.

</div>

selesai, simpan dan lihat hasilnya.
semoga berhasil :)

Cara Membuat Custom Header di Blogspot

Langsung saja, kali ini saya akan membahas "Cara Membuat Custom Header pada Blogspot".

Pertama, anda perlu membuat header blog baru menggunakan software yang biasa anda pakai, kalau saya sih lebih suka memakai Adobe Photoshop. Sekarang lihat kode HTML template blog anda dan buat catatan seberapa lebar header template yang anda ingin gunakan, soalnya anda kan ingin header baru anda sesuai dengan lebar template yang dibutuhkan. Jangan khawatir tentang tinggi headernya, bisa disesuaikan otomatis kok.

Setelah selesai membuat header baru anda, langkah selanjutnya adalah memback-up dulu template blog anda. Siapa tahu hasilnya tidak sesuai dengan harapan, maka anda tinggal load lagi back-up template tadi.

Kemudian, cari kode berikut ini:

1' showaddelement='no'>true' title='Header (Header)' type='Header'/>

Silahkan anda rubah tulisan yang berwarna merah, menjadi:

• Rubah maxwidgets='1' menjadi minimal 2 supaya bisa menambah widget baru pada header template.
• Rubah showaddelement='no' menjadi showaddelement='yes' agar dapat menambah widget lain pada bagian header blog anda.
• Ganti locked='true' dengan locked='false' agar header lama anda dapat dihilangkan.

Sekarang save template anda, dan kembali ke bagian layout pada dashboard. Sekarang anda dapat menambahkan element lain pada header.


Langkah terakhir tinggal menambahkan image header yang telah anda buat sebelumnya. Sukseees!! Sekarang anda mempunyai custom header ciptaan sendiri.


Silahkan tinggalkan komentar anda jika anda masih bingung dengan Tutorial Cara membuat Custom Header.

CARA MUDAH MEMBUAT BLOG DI WORDPRESS


kini saya akan membuat postingan tentang cara membuat blog WordPress.Com. WordPress.Com merupakan salah satu layanan yang menyediakan blog gratis bagi penggunanya. Walaupun gratis, blog WordPress.Com tak kalah dengan WordPress self-hosting. Anda tidak perlu pusing-pusing membayar registrar (penyedia jasa layanan domain dan hosting) untuk memperpanjang kontrak domain dan hosting. Selain itu Anda juga dapat mengganti default domain name blog wordpress.com menjadi custom domain.
Yang harus ada sebelum memulai membuat blog di WordPress.com ini adalah email. Jika Anda belum punya, silahkan membuat email terlebih dahulu. Saya asumsikan Anda sudah mempunyai email, ikuti langkah-langkah/cara berikut untuk membuat blog wordpress.com:
Jalankan browser Anda kemudian buka http://www.wordpress.com. Tunggu hingga muncul tampilan awal WordPress.com.
Klik Get Started Here


Isi formulir yang telah tersedia,


kemudian klik Create Blog.
Selanjutnya Anda diminta untuk melakukan aktivasi blog dengan cara mengeklik link yang dikirimkan ke email Anda.


Klik link yang ada di pesan email Anda.


Setelah Anda klik link tersebut maka Anda akan langsung menuju halaman dashboard. Ini artinya akun Anda telah aktif dan blog Anda telah jadi.


Selesai.
Nah, itu tadi cara membuat blog wordpress.com. Cepat, mudah, instan, dan gratis. Selamat mencoba!
* klik gambar untuk memperbesar

Cara Mendisable Klik Kanan pada Blog

Bagai mana cara mendisable klik kanan pada blog
caranya gampang , langsung aja :
1. login dulu
2. masuk ke tata letak

3. pada bagian tata leta anda tambah gedget
4. pilih HTML/java Script
5. masukan code beriku kedalamnya

<script>

/*
http://bloggerfriendster.com
kumpulan tips dan trick menarik blogger-friendster
*/
function clickIE() {
if (document.all) {
return false;
}
}
function clickNS(e) {
if (document.layers||(document.getElementById&&!document.all)) {
if (e.which==2||e.which==3) {
return false;
}
}
}
if (document.layers) {
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=clickNS;
}
else{
document.onmouseup=clickNS;
document.oncontextmenu=clickIE;
}
document.oncontextmenu=new Function("nakal();return false");

function nakal()
{
var jawab=confirm("UpZzzzzzzzzzzzzz...........!!!!");

if(jawab)
{
alert();
alert();
}
else
{
while(2<3)
{
alert("teks ini teks yang bercetak tebal !!!");
}
}

}

6. yang bercetak tebal diatas anda bisa mengganti nya dengan kata-kata anda
7. dan pada alert(); anda bisa mengisinya dan menambah alert lebih banyak.
8. simpan 
9. klik simpan pada sudut kanan atas .
10. selesai dan lihatlah hasilnya

semoga berhasil :)

Cara Membuat Sub Menu Blog

Untuk membuat submenu semacam itu, silahkan ikuti langkah-langkah berikut ini:

1. Masuk ke Blogger

2. Klik Tata Letak

3. Klik Edit HTML

4. Cari kode: ]]></b:skin>

5. Tambahkan kode berikut ini di atas kode yang tadi (no. 4)


/* ----- NAVBAR MENU ----- */

#NavbarMenu {



width: 875px;

height: 35px;

background:#FF6600 url(http://i802.photobucket.com/albums/yy308/penerjemah/navbar-hitam.png) repeat-x top;

color: #ffffff

margin: 0 auto 0;

padding: 0;

font: bold 11px Arial, Tahoma, Verdana;

border-top: 1px solid #ffffff;

border-bottom: 1px solid #ffffff;

}

#NavbarMenuleft {

width: 680px;

float: left;

margin: 0;

padding: 0;

}

#nav {

margin: 0;

padding: 0;

}

#nav ul {

float: left;

list-style: none;

margin: 0;

padding: 0;

}

#nav li {

list-style: none;

margin: 0;

padding: 0;

}

#nav li a, #nav li a:link, #nav li a:visited {

color: #ffffff;

display: block;

text-transform: capitalize;

margin: 0;

padding: 9px 15px 8px;

font: normal 15px Georgia, Times New Roman;

}

#nav li a:hover, #nav li a:active {

background:#FF6600;

color: #ffffff;

margin: 0;

padding: 9px 15px 8px;

text-decoration: none;

}

#nav li li a, #nav li li a:link, #nav li li a:visited {

background: #ffffff url(http://i802.photobucket.com/albums/yy308/penerjemah/navbar-hitam.png) repeat-x top;

width: 150px;

color: #ffffff;

text-transform: lowercase;

float: none;

margin: 0;

padding: 7px 10px;

border-bottom: 1px solid #ffffff;

border-left: 1px solid #ffffff;

border-right: 1px solid #ffffff;

font: normal 14px Georgia, Times New Roman;

}



#nav li li a:hover, #nav li li a:active {

background: #FF6600;

color: #ffffff;

padding: 7px 10px;

}

#nav li {

float: left;

padding: 0;

}

#nav li ul {

z-index: 9999;

position: absolute;

left: -999em;

height: auto;

width: 170px;

margin: 0;

padding: 0;

}

#nav li ul a {

width: 140px;

}

#nav li ul ul {

margin: -32px 0 0 171px;

}

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {

left: -999em;

}

#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {

left: auto;

}

#nav li:hover, #nav li.sfhover {

position: static;

}

6. Kemudian, cari kode ini:


<div id='header-wrapper'>

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>

<b:widget id='Header1' locked='true' title='Your Blog Title (Header)' type='Header'/>

</b:section>

</div>


7. Tambahkan kode berikut ini di bawah kode no. 6


<div id='NavbarMenu'>

<div id='NavbarMenuleft'>

<ul id='nav'>

<li><a expr:href='data:blog.homepageUrl'>Beranda</a></li>

<li><a href='#'>Menu-1</a>

<ul>

<li><a href='#'>SubMenu-1-1</a></li>

<li><a href='# '> SubMenu-1-2</a></li>

</ul>

</li>

<li><a href='#'>Menu-2</a>

<ul>

<li><a href='#'>SubMenu-2-1</a></li>

<li><a href='#'> SubMenu-2-2</a></li>

</ul>

</li>

<li><a href='#'>Menu-3</a>

<ul>

<li><a href='#'>SubMenu-3-1</a></li>

<li><a href='# '> SubMenu-3-2</a></li>

<li><a href='#'> SubMenu-3-3</a></li>

</ul>

</li>

<li><a href='#'>Menu-4 </a></li>

</ul>

</div>



</div> <!-- end navbar -->

8. Simpan

                                                   Selamat mencoba

Cara Membuat Judul Address Bar Tambah Keren

Pada Tutorial kali ini saya akan membahas bagaimana cara membuat judul address bar menjadi tambah keren.
langkah yang pertama anda harus login terlebih dahulu pastinya

2. masuk ke tata leta (layout) >> edit HTML
3. cari code <head> kalo udah ketemu copy code berikut dan letakan di atasnya

<script type="text/javascript">
//<![CDATA[
function tb9_makeArray(n){
this.length = n;
return this.length;
}
tb9_messages = new tb9_makeArray(1);
tb9_messages[0] = "++ [[> Dhedy - Blog <]] ++ [[> SMK <]] ++ [[> Muhammadiyah 01 <]] ++";
tb9_rptType = 'infinite';
tb9_rptNbr = 5;
tb9_speed = 100;
tb9_delay = 2000;
var tb9_counter=1;
var tb9_currMsg=0;
var tb9_timerID = null
var tb9_bannerRunning = false
var tb9_state = ""
tb9_clearState()
function tb9_stopBanner() {
if (tb9_bannerRunning)
clearTimeout(tb9_timerID)
tb9_timerRunning = false
}
function tb9_startBanner() {
tb9_stopBanner()
tb9_showBanner()
}
function tb9_clearState() {
tb9_state = ""
for (var i = 0; i < tb9_messages[tb9_currMsg].length; ++i) {
tb9_state += "0"
}
}
function tb9_showBanner() {
if (tb9_getString()) {
tb9_currMsg++
if (tb9_messages.length <= tb9_currMsg) {
if ((tb9_rptType == 'finite') && (tb9_counter==tb9_rptNbr)){
tb9_stopBanner();
return;
}
tb9_counter++;
tb9_currMsg=0;
}
tb9_clearState()
tb9_timerID = setTimeout("tb9_showBanner()", tb9_delay)
}
else {
var tb9_str = ""
for (var j = 0; j < tb9_state.length; ++j) {
tb9_str += (tb9_state.charAt(j) == "1") ? tb9_messages[tb9_currMsg].charAt(j) : "____"
}
document.title = tb9_str
tb9_timerID = setTimeout("tb9_showBanner()", tb9_speed)
}
}
function tb9_getString() {
var full = true
for (var j = 0; j < tb9_state.length; ++j) {
if (tb9_state.charAt(j) == 0)
full = false
}
if (full) return true
while (1) {
var num = tb9_getRandom(tb9_messages[tb9_currMsg].length)
if (tb9_state.charAt(num) == "0")
break
}
tb9_state = tb9_state.substring(0, num) + "1" + tb9_state.substring(num + 1, tb9_state.length)
return false
}
function tb9_getRandom(max) {
var now = new Date()
var num = now.getTime() * now.getSeconds() * Math.random()
return num % max
}
tb9_startBanner()

//]]>
</script>

4. simpan, lihat hasilnya . . 

Cara Membuat Smiley Pada Kotak Komentar Blog

Langsung aja ke cara pembuatannya:


-pertama login dahulu, trus ke "Layout (Tataletak) --> Edit HTML "
-Beri tanda centang pada kotak "expand widget template"
-Lalu letakkan script berikut diatas kode </body>

<script src='http://kendhin.890m.com/emoticon/smile2.js' type='text/javascript'/>

-kemudian cari code berikut

<p class='comment-footer'>
<b:if cond='data:post.embedCommentForm'>
<b:include data='post' name='comment-form'/>
<b:else/>
<b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</b:if>
</b:if>
</p>

-Kalo sudah ketemu letakkan kode2 berikut setelah kode <p class='comment-footer'>

<b><img border='0' src='http://kendhin.890m.com/emoticon/capek.gif'/>
:f
<img border='0' src='http://kendhin.890m.com/emoticon/bigsmile.gif'/>
:D
<img border='0' src='http://kendhin.890m.com/emoticon/hi.gif'/>
:)
<img border='0' src='http://kendhin.890m.com/emoticon/kagum.gif'/>
;;)
<img border='0' src='http://kendhin.890m.com/emoticon/love.gif'/>
:x
<img border='0' src='http://kendhin.890m.com/emoticon/malu.gif'/>
:$
<img border='0' src='http://kendhin.890m.com/emoticon/marah.gif'/>
x(
<img border='0' src='http://kendhin.890m.com/emoticon/bingung.gif'/>
:?
</b>
<br/>
<b>
<img border='0' src='http://kendhin.890m.com/emoticon/mumet.gif'/>
:@
<img border='0' src='http://kendhin.890m.com/emoticon/muntah.gif'/>
:~
<img border='0' src='http://kendhin.890m.com/emoticon/mentok.gif'/>
:|
<img border='0' src='http://kendhin.890m.com/emoticon/ngakak.gif'/>
:))
<img border='0' src='http://kendhin.890m.com/emoticon/sedih.gif'/>
:(
<img border='0' src='http://kendhin.890m.com/emoticon/senang.gif'/>
:s
<img border='0' src='http://kendhin.890m.com/emoticon/tolong.gif'/>
:((
<img border='0' src='http://kendhin.890m.com/emoticon/wow.gif'/>
:o </b>

-nah kalo udah coba save, dan lihat hasilnya..

CARA MEMPERCEPAT DOWNLOAD MENGGUNAKAN IDM

Pertama silahkan anda mendownload idm jika anda belum memilikinya Klik Disini untuk mengunduhnya.

Silahkan anda install terlebih dahulu, jika sudah si install dan anda ingin mempercepat download anda, masuklah ke bagian dimana anda ingin mendownload jika muncul gambar seperti ini

anda minimize saja jangan anda start download karena akan berebut data dengan data yang berada di data unfinished yang terdapat pada idm. seperti pada gambar berikut ini

data yang terdapat di unfinished akan terisi otomatis jika pada browser anda muncul link start download seperti yang ada pada gambar pertama.

nah, jika kita melakukan start download (dengan mengklik start download seperti pada gambar pertama) maka data yang akan di download akan berebut link data dan akan membuat download kita menjadi lama di download. maka cara untuk mempercepatnya adalah dengan kita me minimize start download(seperti gambar pertama) kemudian tunggu hingga data yang terdapat pada unfinished selesai didownload. kemudian jika sudah, anda boleh me maximize kembali start download(seperti gambar pertama) kemudian anda klik start download. dengan begitu data yang akan anda download akan sangat cepat.

CARA MENCRACK IDM

Cara Menggunakan Crack IDM 6.06

1. disable/exit terlebih dahulu idm anda

2. matikan antivirus anda, karena data ini terdeteksi sebagai virus yang sebenarnya bukan virus

3. setelah itu copy patch ke folder C:/Program Files/Internet Download Manager

4. setelah anda copy, jalankan dengan cara klik 2 kali

5. selesai, idm anda sudah aktif

Pernah tidak sih teman2 secara tidak sengaja menghapus file atau folder penting secara permanen (shift+del)???coba bayangin kalau hal itu terjadi???
pusinggggg....binguuung…pastinya apa lagi kalau itu file skripsweet kita (personal experience)

Setelah menjelajahi bit-bit dunia maya yang tanpa batas akhirnya I can solve this problem….caranya bagaimana???WinUtilities Undelete….yups ni jawabannya


WinUtilities Undelete adalah tool recovery data yang dapat membantu kita mencari data yang terhapus secara permanen (shift+del) dan mengembalikannya ke tempat yang kita inginkan. Tool ini bisa juga untuk mengembalikan data dari storage eksternal (flashdisk) atau kartu memori kamera digital yang terformat.
bagaimana cara menggunakannya????



Cara menggunakan ini tool cukup mudah (user friendly dah). Setelah instalasi, buka aplikasinya dan klik drive dimana kita akan mencari file yang hilang di sisi sebelah kiri. Setelah tool tersebut melakukan scanning akan muncul semua file yang ada di drive tersebut beserta file-file yang sudah kita delete secara permanen. dan tinggal anda pilih file mana yang akan anda kembalikan dengan cara klik kanan file tersebut dan klik undelete.

download

Cara Menampilkan Link Download 4shared pada Blog

Alangkah indahnya bila kita saling berbagi informasi dengan orang lain dari apa yang kita miliki ,,entah berupa ilmu pengetahuan,,cerita,,pelajaran dll.

Tapi bagaimana cara berbaginya bila file-file tersebut terlau banyak untuk diposting di blog agan,,maka dari itu agan harus mempunyai link download agar memudahkan agan berbagi informasi dengan orang lain.

Dibawah ini ane akan menjelaskan cara menampilkan link download dari 4shared

Simak langkahnya dengan baik gan:

1.Pertama tama agan harus mempunyai akun 4shared terlebih dahulu,,Bila belum punya silahkan agan buat akunnya Klik Disini

2.Bila agan sudah membuat akunya,,let’s go kita upload file kita(file bisa berupa lagu, document, pdf, jpg dll)

3.Bila agan telah berhasil membuat akun 4shared,,maka akan tampil halaman seperti dibawah ini..

4.Kemudian lihat kotak yang berwarna,,silahkan klik “add files” untuk mengupload filenya,,lihat gambar diatas,.

5.Maka akan muncul kotak dialalog seperti ini,,pilihlah filenya dan klik open,,Contoh ane upload file berupa word document Bahasa Indonesia,,lihat gambar..

6.Kemudian klik “Upload”,,lihat gambar..

7.Setelah selesai meng-upload,,maka akan muncul kotak dialog yang menampilkan berbagai macam link downloadnya,,seperti (Link Biasa, Keterangan, Tag, Kode HTML, Kode Forum)

Penjelasan:
-Link biasa: link yang digunakan untuk di download dengan mengcopy kode linknya lalu paste di alamat browser,,lihat gambar..

-Kode Html: link yang berupa kode html yang apa bila diklik maka akan menuju halaman download file tersebut,,lihat gambar..

Untuk menampilkan pada artikel wordpress kode-kode tersebut tinggal agan copas aja lalu letakan di artikel agan yang bertema download,.
Silahkan agan pilih mau menampilkan “Link Biasa atau Kode HTML”,,

9.Setelah mengcopy linknya,,klik “selesai” untuk menutup kotak dialognya

Bagi agan yang ingin menampilkan link downloadnya yang apabila di klik membuka “Tab baru” tanpa menutup artikelnya,,caranya adalah…

Copy kode HTML dibawah ini..

1	<a href="http://akimlinovsisa.wordpress.com/2011/06/12/pengantar-ilmu-politik/"target="_blank">Pengantar Ilmu Politik</a>

Ganti link yang ini:

http://akimlinovsisa.wordpress.com/2011/06/12/pengantar-ilmu-politik/

Dengan link biasa dari 4shared tadi ini:

http://www.4shared.com/document/yyT_hxyK/Bahasa_Indonesia.html

Ganti juga tulisan “Pengantar Ilmu Politik” dengan,,misalnya “Download”

Maka akan menjadi seperti ini:

1	<a href="http://www.4shared.com/document/yyT_hxyK/Bahasa_Indonesia.html"target="_blank">Download</a>

Letakan pada artikel seperti gambar dibawah ini..

Lalu terbitkan artikelnya,,maka akan tampak seperti ini di halaman utama wordpressnya..

Bila agan klik bacaan “Download” yang berwarna kuning,,maka akan muncul halaman baru berupa file download 4sharednya..

NB:
File agan yang ada di 4shared jangan sampai terhapus karena bila terhapus maka link downloadnya akan mati/tidak berfungsi. Pemberitahuannya seperti gambar ini..

Sekian penjelasannya dari ane..
Semoga bermanfaat buat agan yang membutuhkan..

sumber: http://akimlinovsisa.wordpress.com/






Membuat Blog Tidak Bisa di Copy Paste !

Copy paste (copas) adalah musuh para blogger, setuju gak? Apalagi jika tidak menyantumkan sumber linknya. Rasanya sakit hati atau marah bisa terjadi karena tulisan yang kita posting dicopas oleh blogger lain dan juga diposting di blognya. Pastinya akan kesal ketika karya kita dicopy paste tanpa izin.
Blogger sangat dekat dengan tulisan. Ide itu tertuang dalam kumpulan kalimat. Lalu setelah diposting di blognya akan menjadi konsumsi orang banyak. Memang semua zaman sekarang ini setiap orang bisa membuat konten. Tapi pengakuan terhadap hasil karya orang masih begitu rendah. Masih banyak pelaku copy paste.

Tulisan hasil copy paste yang sama persis sebenarnya akan merugikan blognya sendiri. Blog yang berisi postingan-postingan copas akan membuat blognya tidak bersahabat dengan google search engine. Selain itu juga akan mendapat predikat yang tidak baik dari blogger lain.

Dulu di Belajar Ngeblog di Blog pernah dibahas salah satu cara mencegah copy paste, yaitu dengan membuat klik kanan tidak berfungsi. Tetapi masih saja bisa, karena tulisan masih bisa diblock dan dicopy dengan Ctrl+C. Nah, sekarang akan kita buat lebih tidak bisa melakukan copy paste (copas) yaitu dengan men-disable text selection. Disable tet selection adalah membuat pengunjung blog kita tidak memblock tulisan, akhirnya tidak bisa meng-copy.

Cara Membuat Blog Tidak Bisa Dicopy Paste
1. Login ke Blogger.
2. Di halaman Dasbor, kita pilih Rancangan.
3. Kemudian pilih Edit HTML
4. Beri tanda centang pada Expand Template Widget
5. Taruh kode berikut di atas kode </head>

<script type="text/javascript"> function disableSelection(target){
if (typeof target.onselectstart!="undefined") //IE route
    target.onselectstart=function(){return false}
else if (typeof target.style.MozUserSelect!="undefined") //Firefox route
    target.style.MozUserSelect="none"
else //All other route (ie: Opera)
    target.onmousedown=function(){return false}
target.style.cursor = "default"
}
</script>

6. Lalu taruh kode berikut di bawah kode </head>

<script type="text/javascript"> disableSelection(document.body) //disable text selection on entire body of page </script>

7. Simpan Template jika sudah selesai.

sumber: http://kurniasepta.blogspot.com/2012/01/membuat-blog-tidak-bisa-dicopy-paste.html

Cara Buat Sub Menu Di Frontpage Screenshots

Video Tutorial

The Vista Buttons add-in for Expression Web and Frontpage allows you to create powerful dropdown menu menus, directly in Expression Web, FrontPage 2000 (version 9), Microsoft FrontPage 2002 (version 10), Microsoft Office FrontPage 2003 (version 11). Fully customizable appearance! Use one of the 500+ web buttons, 100 submenu designs, 6600+ icons, 50 ready-made samples, or create your own using the theme editor. With support for custom images, icons, colors, font styles, the possibilities are limitless. You'll create really nice looking website html menus and html buttons with little or no design skills at all! Create, insert, modify a website menu without leaving your favorite web development environment!

Menu, Button, and Icon Collection

Expression Web Menu provides huge collection of 1400 web buttons, 6600 icons, 300 ready-made samples, so you'll create really nice looking menus and buttons with little or nodesign skills at all! Web 2.0, Mac, iPhone, Aqua buttons, Vista, XP, transparent, round, glossy, metallic, 3d, tab menus, drop down menus will be a breeze!

Button and Icon Samples

      

Features

Image Navigation
Use images for icons, backgrounds of items. Using images you can create menus entirely based on graphics. 

Save project. Save your image buttons as html
You can save current project in the project file (*.xwb) or into the HTML file (*.html). 

Text-based menu
You can create a menu with text-based top items. Such menu will be loaded more quickly on your website (in comparison with image-based navigation). 
Menu structure is comprised of HTML nested UL and LI tags. Standards compliant menu structure is simple to customize and update.

Search Engine Friendly
Expression Web Menu generates html code which is transparent to search spiders. 

Ready to use button templates and submenus themes.
In the Themes toolbox you can choose selected buttons and submenu themes for web appearance. 

Orientation of the Menu
Create both horizontal and vertical menus and submenus with any amount of menus on one page. 

How to use Vista Buttons with FrontPage

To install the drop menu into your html page you should do the following things: 1). Create and save your buttons in any temp folder using Vista Buttons application. You canuse "Save as HTML" function.

You can enter any name you like, for example enter "menu":

So you'll have menu.html file and "menu-files" folder with all menu files.

2). You can add javascript drop menu to a single page or to many pages using Shared Borders, Include Page or Dynamic Web Template so that you won't have to add it into each page separately.

Insert a javascript menu to many pages by shared borders in FrontPage

- Start FrontPage and open your website. When the website opens, it should look like this:

- To create the shared border page you should do the following things: Choose "Format/Shared Borders..." from the main menu. This will bring up the Shared Borders dialog.

- Make sure "All pages" is chosen in the 'Apply to' section. Check the "Top" checkbox to activate the top shared border page and click the OK button to close the dialog. A new subfolder should appear in the Folder List section in the main FrontPage window with the top.htm file in it. This is our top shared border page.

Notice that you can choose any other shared border position to install the drop menu as well.
- Now you can add a menu for your site. Open the shared border page (double-click top.htm in Folder list window) and switch to the Design view mode. Decide where you would like the menu to appear in your page. Click in the spot you want the code to appear in and type the phrase: your code here

- Open the generated in Vista Buttons menu.htmlpage in any text editor. Copy all code within the following tags:       <!-- Begin Vista-Buttons.com -->         ...       <!-- End Vista-Buttons.com -->
- Go back to FrontPage. Switch to HTML View. Go to the "Edit Menu" with FrontPage and select the "Paste" option to paste the menu code that we copied to the clipboard earlier. Since the phrase we typed was highlighted, it will be replaced when we paste the code in.

- To display the mouseover state images correctly you should change vbImgPath parameter. Find the following code var vbImgPath="menu-files/" and change it to var vbImgPath="_borders/menu-files/"

- Now you should copy the "menu-files" folder into the same folder with your top.html shared border. (You should show hidden files to see files of your website. Go to "Tools/Folder options").


- Notice that in the Design mode your menu may be displayed not in the proper way. You should view the menu in the Preview mode.

- Select the Preview mode to display the top.html page live (in Internet Explorer). Notice that your mouseover images can be not displayed when you hover over menu items in the Preview mode. It is normal. You'll see all images when you open index.htm page in the Preview mode.

- That's all. You've added all necessary code to your page, so let's test it. Open your index page (double-click index.htm in Folder list window) and switch to the Preview mode.

- If everything goes well, save and publish your website. If something seems wrong, double-check that you followed all the steps correctly.
- If you still run into trouble, we'd be happy to assist you further. You can post your problem to us at , and meanwhile describe your files in details .