Sabtu, 24 Juli 2010

Cara Menyembunyikan Profil di Blogger

Menyembunyikan Profil di Blogspot: "

  • Menyembunyikan Profil


Sekali lagi ya,ini untuk pemula,dan bagi yang belum tahu bagaimana menyembunyikan profil pribadi pada Blog.

Seperti yang pernah saya lakukan sebelumnya,menyembunyikan profil pada blog ini,tapi setelah di pikir lagi,gimana bisa dapet temen klo profil kita tidak tersedia.Pelajaran Blog

Untuk melihat profil yang saya maksud,adalah seperti ini,klik disini.

Untuk blogspot,yang masih asli biasanya,anda tinggal ke Bagian 'Mengenai Saya' dan klik 'Lihat Profil Lengkapku' (Untuk blogspot berbahasa Indonesia).


Nah,jika sudah tahu yang dimaksud,sekarang ke topiknya,ya,menyembunyikan profil,atau pasnya tidak mengaktifkan profil.

Anda tinggal disuruh pergi ke Dashboard,pilih disebelah kiri atas tulisan 'Edit Profil'.
Setelah itu,akan muncul jendela baru bertuliskan 'Edit Profil Pengguna'.

Contreng checkbox pertama 'Bagi-pakai profil saya',untuk menyembunyikan Profil,dan Kosongkan jika anda ingin menyembunyikannya.Lalu Simpan.

  • Menyembunyikan Daftar 'Blog Saya'


Maksudnya,saat anda melihat profil,baik profil sendiri atau orang lain,(profil yang saya maksud profil seperti diatas),disitu akan terlihat deretan daftar blog yang anda buat.
Nah dalam hal ini,kita akan menyembunyikan daftar blog yang tidak ingin kita tampilkan.

Sebenarnya saya mempunyai banyak blog,tapi saya hanya menampilkan Daftar Blog dari Blog ini,anda bisa lihat sendiri tadi khan?

Nah untuk menyembunyikannya,sama dengan langkah di atas.
Pergilah ke Dashboard,lalu pilih Edit Profil,selanjutnya contreng check box 'Bagi-pakai profil saya',dan cari tulisan 'Tampilkan blog saya' dan klik tulisan bergaris bawah 'Pilih blog untuk ditampilkan'.
Selanjutnya contreng partai pilihan kamu,Hus !!Pelajaran Blogsalah lagi,maksudnya contreng blog yang ingin di tampilkan.
Lalu Simpan.
Dan selanjutnya lihat Profil Anda,meskipun anda telah membuat banyak blog,tapi pada profil hanya akan muncul blog yang anda contreng tadi.Pelajaran Blog

Baca Juga Yang Ini..


CSS

Apa itu CSS?: "

Untuk kesekian kalinya,Pelajaran Blog,akan merepotkan lagi Bapak Supono.

Ya,karena mungkin pusing akan penjabaranya,CSS,pengertian CSS,anda bisa baca disini.

Tapi,Pelajaran Blog,nggak mau dong dibilang nggak modal lagi,he..he..
Contoh simple sebuah CSS,anda bisa lihat ilustrasi di bawah ini:


Jika dengan HTML,saya menuliskan sebuah kalimat:

Apa Itu CSS?

Maka saya akan menuliskan kode:

<font-size="12px";font-family="arial"><b>Apa itu CSS?</b></font>


Tapi dengan CSS,kita bisa menghemat penerapan kode,hanya dengan mengatur atribut kalimat yang akan kita tulis,di bagian atas kode <HEAD>,pada halaman HTML anda.

Contoh,tulisan Apa itu CSS? di atas,akan saya tulis memakai CSS.
Pertama,saya meletakkan kode ini di atas kode <Head> pada halaman HTML saya.

<style type='text/css'>
#Contoh {
color:black;
font-size:12px;
font-weight: bold;
font-family: arial;
}
</style>


Setelah itu,saya menuliskan kode di bawah ini sesudah kode <Head>

<script type='text/javascript'/>
<div id="Contoh">
Apa Itu CSS?
</div>


Hasilnya akan seperti ini :

Apa Itu CSS?

Sama khan ?Nah itu penjelasan dikit tentang CSS.
Kurang Jelas,anda bisa pelajari CSS di http://learn-css-tutorial.com/.

Baca Juga Yang Ini..


Disable Copy Paste

Disable Copy dan Paste pada IE: "

Sebelumnya,saya juga pernah memposting tentang Disable Right Click,nah kali ini kita akan membahas Disable Copy dan Paste,suatu halaman Blog,meskipun ini hanya bekerja baik pada Browser Internet Explorer (IE)


Jika kita sedang membutuhkan suatu artikel dari sebuah Blog,dan ingin mengcopy artikel tersebut,tapi !!234@!

Kok nggak bisa ya..??Pelajaran Blog

Nah sebenarnya teknik semacam itu hanya menyelipkan beberapa kode pada :


<body>

Maksudnya?

Coba anda pergi ke Dashboard,lalu pilih Tata Letak,selanjutnya pilih Edit HTML.

Cari kode berikut:


<body>

Jika sudah ketemu,hapus kode tersebut dan ganti menjadi seperti di bawah ini:

<body ondragstart="return false;" ondragstart="return false" onselectstart="return false">

Lalu Simpan.

Untuk melihat hasilnya,silahkan buka halaman blog anda pada browser IE,dan coba blok artikel anda,apa yang terjadi?Pelajaran Blog

Baca Juga Yang Ini..

Rabu, 21 Juli 2010

Cara Membuat Daftar Isi di Blogspot

Membuat Daftar Isi pada Blog: "

Hallo!! baru sempet update lagi nich! Membuat Daftar Isi,berhubung 3 hari pulang ke kampung Purworejo,he..he..

Tapi disini aku tidak mau ngomongin soal pengalaman aku waktu di kampung,ntar panjaaang dech ceritanya..Buat Daftar tentang Isi

Langsung aja yach! sesuai judul artikel pelajaran kali ini,kita akan membuat Daftar Isi Pada Blog,contohnya anda sudah bisa melihat Daftar Isi pada Blog ini.

Sebelumnya,dari mana saya dapat artikel ini? ya..dari senior kita semua tentunya,
Kang Rohman
di Blog Tutorialnyanya.

Siapa sich yang belum pernah berkunjung ke Blog nya?Isi dari Daftar Blog

Meskipun demikian,Pelajaran Blog,tanpa mengurangi etika sopan santun Blogging,akan menjabarkan lagi,bagaimana sich membuat Daftar Isi pada Blog.


Langkah pertama,Pergi Dashboard lalu pilih Tata Letak,selanjutnya pillih Edit HTML.
Selanjutnya,beri contreng Partai pilihan kamu,..

Hus ! bukan maksudnya,contreng tulisan Expand Widget Template,seperti di bawah ini :

Daftar Isi Dibuat

Selanjutnnya,cari kode di bawah ini:

<b:include data='post' name='post'/>

Untuk mempermudah pencarian,tekan Ctrl+F pada Keyboard anda,pakai keyboard khan?
Setelah ketemu kode diatas,Hapus kode tersebut,lalu ganti dengan kode di bawah ini :

<b:if cond='data:blog.homepageUrl !=
data:blog.url'>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'>
<div style="padding:6px 0 6px
5px;border-right:1px solid
#ccc;border-bottom:1px solid
#ccc;margin-bottom:2px;background:#EAE9E9;color:#406A0E;">
<data:post.title/></div></a>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>


Lalu Simpan Template.

Apakah dah selesai?

Ya belum dong! Kalau dah selesai,gimana caranya bisa ngliat daftar isi blog?

Nah! Untuk melihat Daftar Isi Blog,kita harus membuat Link terlebih dahulu,yang mana saat link di klik akan menuntun kita ke halaman khusus Daftar Isi tersebut.

Anda bisa menggunakan seperti contoh di bawah ini:

Untuk link berupa text:
Daftar Isi Blog

Anda bisa gunakan kode berikut :

<a href="http://NAMABLOGANDA.blogspot.com/search?max-results=100">Daftar Isi Blog</a>

Untuk Link berupa form:


Anda bisa gnakan kode berikut :

<form action="http://NAMABLOGANDA.blogspot.com/search?max-results=100" target="_blank"><input value="Daftar Isi Blog" type="submit"></form>

Jangan lupa! kode yang berwarna merah,tuliskan alamat Blog anda sendiri.

Sebenarnya,masih banyak pilihan yang bisa anda buat link untuk Daftar Isi Blog,caranya hanya dengan menambahkan Element Baru/Add New Widget dan pilih HTML/Javascript lalu tuliskan kode link pilihan anda (anda bisa memakai contoh di atas).

Lalu apa arti tulisan '100' yang berwarna hijau di atas ?
Angka '100' pada kode diatas,menentukan berapa jumlah judul yang akan di tampilkan untuk Daftar Isi tiap halaman,klo saya menuliskan '50',ya nantinya akan ada '50' judul yang akan di tampilkan pada setiap halamannya.

Udah jelas khan?Pelajaran Blog

Baca Juga Yang Ini..


Membuat Navbar Blog Auto Hide / Auto Hide Navbar Blogger

Navbar Blog Fleksible: "
Membuat navbar Blog Fleksibel,saya bingung mau ngasih judul apa,so..itu aja kali ya..:)Pelajaran Blog
Maksudnya apa nich?

Maksudnya,Navbar Blog hanya akan muncul hanya saat mouse diarahkan di atasnya,ya seperti Navbar pada Blog ini.
Meskipun ini hanya akan berfungsi baik di Mozilla Firefox.Pelajaran Blog

Untuk kodenya sederhana,Pilih Dashboard,lalu pilih Tata Letak,selanjutnya pilih Edit HTML.
Setelah itu cari kode berikut :

]]></b:skin>

Kalau sudah ketemu,letakkan kode dibawah ini diatas kode tersebut

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



Setelah itu Simpan,dan lihat hasilnya di browser Mozilla Firefox.Pelajaran Blog

Baca Juga Yang Ini..


Membuat Menu Navigasi dengan CSS


Membuat menu navigasi,adalah pelajaran yang paling banyak di pertanyakan oleh blogger-blogger pemula,termasuk saya beberapa hari yang lalu.

Disini kita akan membahas tentang bagaimana membuat menu makanan 4 sehat 5 sempurna,

Hus !! bukan,maksudnya Menu Navigasi dengan CSS.Pelajaran Blog

Tapi tidak seperti kebanyakan,biasanya mereka meletakkan di bawah kode <body>,tapi di sini kita akan meletakkan kodenya di Element HTML/Javascript yang baru.

Apa itu CSS? kita akan bahas beberapa hari lagi,berhubung yang kita bahas kali ini Menu Navigasinya.


Seperti apa sich contoh Menu Navigasi?

Navigasi pada web / blog,sesuai dengan namanya,yaitu untuk menuntun jalan,supaya web / blog lebih mudah di telusuri.

Contoh bentuk fisiknya seperti di bawah ini :







Untuk membuatnya kali ini,kita minta bantuan CSS,apa itu CSS,kita bahas naa..ant :
(,tadi sudah di omongiiin!!!! #$%#!
Pelajaran Blog.

Cara membuatnya sederhana sekali,berhubung kita dengan bantuan CSS,kita tak perlu membuat tabel untuk Menu Navigasi seperti di atas.

Tapi,yang paling surprise buat gw waktu aku jalan-jalan ke Blok-M,tiba-tiba aku ngliat yang belum pernah...OOee!!Ngemeng aja!ntar aja ceritanya ngapa !!

Ok! berhubung ntar malah tambah bikin rusuh suasana,kan dapet dosa tuh!,kalo dosa,kita masuuk Nera...@#$@#$@!!gUBRAK! gw bilang ntar ya ntar ceritanyaaa!!Pelajaran Blog

Ya..ya.ntar aja ceritanya ya..Ok langsung ke topik,kita hari ini.

Langkah pertama,pergi ke Dashboard (untuk blogspot),lalu pilih Tata Letak,selanjutnya pilih tab Edit HTML.
Lalu cari kode ]]></b:skin>,jika sudah ketemu,tepat diatasnya,letakkan kode di bawah ini :

#NavbarMenu { background: #000; width: 400px; height: 10px; font-size: 11px; font-family: Trebuchet MS, Tahoma, Verdana; color: #fff; margin: 0px; padding: 0px; } #NavbarMenuleft { width: 400px; 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 { background: #222222; height: 15px; color: #fff; display: block; font-size: 11px; font-family: trebuchet ms, ; text-transform: none; text-decoration: none; margin: 0; padding-top:6px; padding-bottom:5px; padding-left:13px; padding-right:13px; border-right: 1px solid #000; } #nav li a:hover, #nav li a:active {background: #222222; color: #ffffff; margin: 0; padding-top:6px; padding-bottom:5px; padding-left:13px; padding-right:13px; text-decoration: none; } #nav li li a, #nav li li a:link, #nav li li a:visited { background: #ffffff; width: 150px; color: #222222; font-size: 11px; font-family: trebuchet ms,; font-weight: normal; text-transform: none; float: none; margin: 0; padding: 7px 10px; border: 1px solid #000; } #nav li li a:hover, #nav li li a:active { background: #222222; 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; }

Jika kode sudah anda letakkan,lalu Simpan Template.
Selanjutnya pilih Tab Tata Letak,dan buat Element Baru / Add New Widget,pilih HTML / Javascript.
Lalu letakkan kode di bawah ini pada halaman HTML / Javascript yang baru saja anda pilih.


<ul id='nav'>
<li><a href='http:///'>Menu 1</a></li>
<li><a href='http:///'>Menu 2</a></li>
<li><a href='http:///'>Menu 3</a></li>
<li><a href='http:///'>Menu 4</a></li>
</ul>


Jika kode sudah anda letakkan,lalu pilih Simpan,dan anda bisa langsung lihat hasilnya.

Untuk http:/// ,anda isi dengan alamat URL yang akan di tuju,sedagkan untuk Menu 1,2,3,4 ,Untuk tulisan yang akan tampil,sedangkan jika ingin menambahkan satu kolom lagi,anda tinggal menulis satu baris lagi,baris yang mana?

Copy aja salah satu kode :

<li><a href='http:///'>Menu 4</a></li>,dan paste persis di bawahnya.

Sekarang tinggal nglanjutin cerita di Blok-M tadi,jadi gini nich..@#$@#%$! Gubrak !Pelajaran Blog

Baca Juga Yang Ini..

Cara Menampilkan Kode HTML ke Posting

Menampilkan kode pada artikel: "

Hallo! Update lagi nih! Pelajaran Blog
Lagi musim naikin Page Rank maupun Traffic,kita harus rajin mosting..betul ga?
Meskipun postingan banyak yang Tong kosong nyaring bunyinya yang penting bermanfaat.


Meletakkan kode di dalam postingan,sebenarnya hanya masalah penyesuaian saja,maksudnya,agar sang blog
tidak dibikin bingung,makanya kode yang ingin kita tampilkan pada postingan harus di parse dulu.

Apa jadinya kalau tidak di Parse?

Jika kode yang ingin kita tampilkan tidak di parse terlebih dahulu,maka saat kita akan mempublikasikan,akan ada peringatan kesalahan format dan bahkan kode tidak tampil,sekalipun berhasil di publikasikan,betul ga?Pelajaran Blog
Untuk mengantisipasinya ya hanya memparse kodenya.

Parse ! Parse ! apaan sich ?

Parse menurut saya pribadi,ya hanya mengganti karakter kode menjadi notasi lain,misal :
Untuk tanda-tanda di bawah ini :

  • < notasinya : &lt;
  • > notasinya : &gt;
  • & notasinya : &amp;
  • ' notasinya : &quot;
  • ± notasinya : &plusmn;
  • Spasi notasinya : &nbsp;

Contoh:
Saya ingin menampilkan kode <body> pada posting,maka saya saat memosting harus menuliskan &lt;body&gt;.Jelas khan ?Pelajaran Blog

Contoh lain,saya ingin pembaca mengcopy kode berikut :

<html>
<head>
</head>
<body>
<a href="http://pelajaran-blog.blogspot.com/">Klik Disini</a>
</body>
</html>


Maka,saya dalam memposting harus menuliskan sebagai berikut :

&lt;html&gt;
&lt;head&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;a href=&quot;http://pelajaran-blog.blogspot.com/&quot;&gt;Klik Disini&lt;/a&gt;
&lt;/body&gt;
&lt;/html&gt;


Parse kode,..bener ga sich artinya kaya' gitu ? Gubrak !Pelajaran Blog

Baca Juga Yang Ini..