DUNIA REMAJA: BLOG

Tampilkan postingan dengan label BLOG. Tampilkan semua postingan

Sabtu, 14 April 2012

memasang meta tags diblog

di 04.37 Label:TUTORIAL BERITA, BLOG, UNIK

cara menyampaikan infomasi penting ke search engine mengenai informasi suatu halaman, Ada banyak meta tag sesuai dengan standar HTML 4.0 dari World Wide Web Consortion, tapi sebenarnya yang betul-betul dipakai oleh search engine hanya 3, description, keyword, dan robots. Mengenai penjelasan meta tags karena sudah terlalu banyak yang menulis hal ini jadi om pilih aja salah satu situs terbaik yang bisa dipercaya, informasi yang om ambil berasal dari alamat ini http://www.promosi-web.com/ (semua penjelasan tidak ada pengeditan sebagaimana aslinya)

Meta Tag Description

Meta tag description digunakan untuk memberikan gambaran umum mengenai isi dari halaman web Anda. Ukurannya disarankan tidak lebih dari 200 karakter. Dan usahakan agar description ini bisa menjadi
kalimat-kalimat yang letaknya di awal halaman web page yang bersangkutan. Contoh penulisan meta tag description adalah sebagai berikut :
<meta name="description" content="Promosi-web.com is a search engine tutorial that explain how to get
top rangking in all major search engine and get high traffic for your web site. Available in Bahasa
Indonesia.">

Beberapa search engine seperti Nothern Light dan Google tidak memakai meta tags sebagai deskripsi hasil pencariannya. Yang mereka gunakan adalah kalimat-kalimat awal yang ada pada halaman tersebut.
Itulah sebabnya kenapa saya sarankan agar Anda menggunakan isi dari meta tag description sebagai kalimat pembuka. Dan jika bagian paling awal dari web Anda berupa sebuah menu, maka deskripsi yang
ditampilkan pada hasil pencarian Northern Light adalah seperti ini :
Home | Products and Service | Contact Us | About Us ...welcome to our online store, the best place on the
web to...

Meta Tag Keyword

Meta tag keyword sangat penting keberadaannya, karena menentukan kata kunci apa yang bisa menemukan halaman web tersebut pada search engine. Sintak dasar dari meta tag keyword adalah
sebagai berikut :
<meta name="keywords" content="keyword1 keyword2 keyword3 ...">
atau ada juga yang menulis dengan pemisah tanda koma :
<meta name="keywords" content="keyword1, keyword2, keyword3, ...>

Keduanya berfungsi sama dan tidak ada pengaruhnya pada search engine. Tujuan pemakaian tanda koma agar keyword-keyword tersebut lebih mudah dibaca. Yang perlu diperhatikan disini adalah jangan
mengulang sebuah kata lebih dari 3 kali, karena akan dianggap spamming. Contoh pemakaian meta tag keyword yang salah adalah :

<meta name="keywords" content="bali, bali hotels, travel in bali, bali island, bali weather>
Disini terlihat sekali bahwa kata "bali", diulang lebih dari 3 kali. Contoh berikut ini tidak akan dianggap spamming oleh search engine :
<meta name="keywords" content="bali hotels travel bali island bali weather">
Yang tak kalah pentingnya mengenai keyword adalah jangan membuat keyword yang tidak ada hubungannya dengan isi halaman web Anda. Hal ini juga akan dianggap spamming. Misalkan web Anda
memuat informasi mengenai pariwisata di Bali, jangan sekali-kali menambahkan "MP3" atau "Britney Spears" sebagai keyword hanya karena keyword-keyword ini merupakan keyword favorit di internet dan
banyak dicari orang.

Meta Tag Robots

Tujuan utama penggunaan meta tag robots adalah untuk menentukan halaman web yang mana bisa diindex oleh spider dan halaman web mana yang tidak. Tag ini sangat berguna sekali terutama jika seuatu
website memakai frame untuk navigasinya. Tentunya kita tidak ingin menampilkan menu-menu dalam frame untuk dibaca oleh search engine. Format dasar dari meta tag robots adalah sebagai berikut :
<meta name="robots" content="index | noindex | follow | nofollow">
Sebagai contoh, jika Anda ingin agar spider membaca main page, dan menelusuri semua link yang ada maka tambahkan perintah berikut ini :
<meta name="robots" content="index follow">
Dengan perintah ini spider akan meng-index main page Anda dan menjadwalkan untuk mengindex halaman-halaman lain yang bisa dicari melalui hyperlink (<a href="">).
Perintah berikut ini akan menginstruksikan agar spider tidak meng-index maupun menelusuri link yang ada pada suatu halaman web.
<meta name="robots" content="noindex nofollow">

Lalu bagaimana memasang Meta Tags di Blogger :

Untuk memasang Meta tag diBlogger caranya cukup mudah, pertama masuk ke Edit HTML kemudian copy paste kode dibawah ini, biasanya kode meta tags diletakan dibawah kode <title><data:blog.pageTitle/></title> dan jangan lupa merubah kode warna merah di bawah sesuai dengan deskripsi blog kamu.

Mengatur Link pada Sub Pages

di 04.31 Label:TUTORIAL BERITA, BLOG, UNIK

pada link pada menu page, sub page, sub sub page dan sub sub sub page akan berawalan <li> dan berakhir pada </li>

Berikut di bawah ini adalah ilustrasinya :

<div id='NavbarMenu'>
  <ul id='nav'>
    <li><a expr:href='data:blog.homepageUrl'>Home</a></li>

    <li><a href='#'>Page</a>
      <ul>                                 /* ------> awal menu pada sub page */
        <li><a href='#'>Sub Page #1    »</a>
          <ul>                             /* ------> awal menu pada sub sub page */
            <li><a href='#'>Sub Sub Page #1    »</a>
              <ul>                         /* ------> awal menu pada sub sub sub page */
                <li><a href='#'>Sub Sub Sub Page #1</a></li>
                <li><a href='#'>Sub Sub Sub Page #2</a></li>
              </ul>                         /* ------> akhir dari menu pada sub sub sub page */
            </li>
            <li><a href='#'>Sub Sub Page #2</a></li>
            <li><a href='#'>Sub Sub Page #3</a></li>
          </ul>                             /* ------> akhir menu pada sub sub page */
        </li>
        <li><a href='#'>Sub Page #2</a></li>
        <li><a href='#'>Sub Page #3</a></li>
        <li><a href='#'>Sub Page #4</a></li>
        <li><a href='#'>Sub Page #5</a></li>
      </ul>                                 /* ------> akhir menu pada sub page */
    </li>

    <li><a href='#'>About Me</a></li>
  </ul>
</div>

Ket :

Tulisan # Ganti dengan alamat link. diikuti nama link tersebut yaitu dengan mengganti tulisan sub page, sub sub page dan sub sub sub page yang ada di sampingnya.

Kode " " adalah "spasi" untuk membatasi jarak dengan kode "»" yang berarti tampilan "»" jadi pada kode "Sub Sub Page #1    »" nantinya akan tampil menjadi "Sub Sub Page #1 »"

Tulisan NavbarMenu dan nav adalah pemanggil dari kode css pada template. jadi sesuaikan nama tersebut dengan kode css yang anda miliki pada template anda.

Jika belum mempunyai kode css tersebut mungkin anda harus membuatnya terlebih dahulu sesuai ukuran template anda. tetapi saran dari Trik Tips Tutorial agar anda memakai template yang sudah disertai sub pages pada templatenya kemudian anda tinggal mengedit linknya seperti yang diterangkan di atas.

Cara Menghilangkan Tanda Obeng dan Tang di Blog

di 04.28 Label:TUTORIAL BERITA, BLOG, UNIK

Tanda tersebut sebenarnya bukan merupakan suatu masalah, karena tanda tersebut hanya muncul jika pemilik blog sedang login di account blognya dan hanya muncul di komputer orang tersebut. Jadi orang lain tidak bisa melihatnya. Dan kalau pemilik blog tersebut sudah "sign out" maka tanda tersebut tidak akan muncul lagi.

Cara menghilangkan seperti dibawah ini:

#. login ke akun blogger kamu
#. masuk ke rancangan--> edit html --> centang kolom expand widget template
#. cari kode ini

]]></b:skin>

#. copy dan paste kode dibawah ini tepat diatas kode nomer 3 tersebut

.quickedit{
display:none;
}

#. Klik tombol Simpan Template dan lihat hasilnya .

#. Selesai.

Membuat Blog Cepat Terindeks Di Google

di 04.21 Label:TUTORIAL BERITA, BLOG, UNIK

Ketika anda membuat blog baru anda ingin blog anda cepat terindeks di google. Dengan terindeks di google berarti blog anda memiliki kemungkinan untuk dimunculkan dalam hasil pencarian yang dilakukan oleh google.

Berikut merupakan Tips dan Trik agar blog atau website anda cepat terindeks di google.

# Daftar di Google Webmaster Tool

Untuk dapat terindeks di google, sebaiknya anda mendaftarkan blog anda di webmaster tool milik google. Google Webmaster tool merupakan salah satu masukan buat google untuk melakukan updating terhadap database indeks nya.

# Buat Sitemap ,Buat peta situs anda dalam sebuah file sitemap.xml (atau nama file lain bila anda sudah mahir) lalu upload/ letakkan saja di website anda. Submit alias beritahu google webmaster tentang peta situs yang anda telah buat ini.

# Buat Pembatas akses Google Robot ,Batasi pengaksesan google robot yang mengakses situs anda. Simpan data pembatasan akses tersebut pada robot.txt dan upload pada website anda. Dengan pembatasan terhadap google robot maka waktu yang dibutuhkan google robot ketika mengumpulkan data (crawling) dari website anda dapat berjalan lebih cepat.

# Lakukan Ping ,Jangan lupa untuk menggunakan layanan ping yang telah disediakan di berbagai website, misalnya _www.pingler.com .Ping dilakukan untuk memberitahu bahwa anda memiliki blog atau setidaknya memiliki posting baru.

# Backlink Berkualitas ,Bila blog anda belum terindeks, carilah backlink berkualitas dari blog yang sudah terindeks dengan dofollow. Yah kalo kata orang dulu, kalo kita bergaul dengan yang pintar, sedikit banyak kita akan ketularan pintar juga

Menerapkan Kode Analytics AdSense?

di 04.16 Label:TUTORIAL BERITA, BLOG, UNIK

ASAC (Kode Analytics AdSense) merupakan potongan kode tambahan yang harus ditempatkan di HTML halaman Web jika Anda ingin menghubungkan account AdSense dengan beberapa domain dalam profil Google Analytics.

Perlu diketahui bahwa ASAC harus ditempatkan di atas Kode pelacakan AdSense dan Google Analytics agar account AdSense dapat diterapkan dengan benar ke beberapa domain.

Contoh Kode Analytics AdSense ditunjukkan di bawah ini. Bidang indeks properti dan nomor account akan diisi secara otomatis setelah Anda menghubungkan account.

 <script>
 window.google_analytics_uacct = "UA-accountnumber-propertyindex";
 </script>

Tempat menempelkan kode AdSense di HTML

di 04.14 Label:TUTORIAL BERITA, BLOG, UNIK

Setiap dokumen HTML terdiri atas tag dalam tanda kurung yang memberitahukan peramban web bagaimana cara menampilkan elemen HTML. Semua elemen HTML dimulai dengan tag pembuka (< >) dan diakhiri dengan tab penutup (). Struktur dasar dokumen HTML adalah sebagai berikut:

<HTML>

<HEAD>
</HEAD>
<BODY>

</BODY>
</HTML>

Tag <HTML> pembuka memperingatkan peramban bahwa ini adalah awal dari dokumen HTML.
Tag <HEAD> pembuka berisi informasi tajuk dan tidak tampak ketika Anda melihat laman di peramban. Teks apa pun yang ditampilkan di antara tag BODY (<BODY> dan </BODY>) akan ditampilkan di peramban Anda.
Tag </HTML> penutup memperingatkan peramban bahwa ini adalah akhir dari dokumen HTML.
Agar iklan muncul dengan benar, Anda harus menempatkan kode iklan di antara tag <BODY> pembuka dan tag </BODY> penutup dari kode sumber Anda.
Jika Anda mengalami masalah dalam menemukan tag <BODY>, coba tekan tombol 'CTRL' dan 'F' pada PC, atau tombol 'COMMAND' dan 'F' pada Mac untuk membuka kotak teks Find. Selanjutnya ketik '<BODY' (tanpa tanda petik) untuk menemukan tag pembuka atau '</BODY' (tanpa tanda petik) untuk menemukan tag penutup, lalu klik Find.
Menemukan tag <BODY > perlu dilakukan, karena Anda harus menempelkan kode AdSense di antara tag <BODY> dan tag </BODY> pada dokumen.

Membuat unit iklan Adsense

di 04.12 Label:TUTORIAL BERITA, BLOG, UNIK

Untuk membuat unit AdSense baru, Anda dapat mengelolanya lewat akun Anda, sesuai dengan petunjuk berikut.

Masuk ke akun Anda di http://www.google.com/adsense.
Kunjungi tab Iklan saya.
Pada bilah samping, pilih produk. Jika Anda hanya ingin menampilkan iklan pada situs web Anda, pilih "Iklan konten".
Klik +Baru.
Beri nama dan ubahsuaikan unit iklan Anda.
Tampilkan detail setelan.
Klik Simpan dan dapatkan kode.
Salin dan tempelkan kode iklan ke kode sumber HTML laman Anda, tempat iklan ingin ditampilkan. Jika Anda tidak mengetahui caranya, Anda dapat meninjau Panduan Implementasi Kode.

Setelah situs Anda disimpan, iklan akan tampil dalam beberapa saat. Jika nanti Anda ingin mengubah setelah unit iklan ini, Anda dapat mengeditnya dari daftar iklan konten di bawah tab Iklan saya.

Cara Membuat SubMenu di Blogger

di 04.09 Label:TUTORIAL BERITA, BLOG, UNIK

- Klik Tata Letak

-Klik Edit HTML

-Cari kode: ]]></b:skin>

-Tambahkan kode berikut ini di atas kode ]]></b:skin>

/* ----- 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;

}

cari kode ini:

<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>

Tambahkan kode berikut ini di bawah kode no. 6

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

<ul>

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

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

</ul>

</li>

<ul>

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

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

</ul>

</li>

<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>

</ul>

</div>

</div>

Simpan

Cara Membuat Menu di Blogspot dengan List-O-Matic

di 04.04 Label:TUTORIAL BERITA, BLOG, UNIK

Membuat postingan dengan Judul/Title: Depan, Tentang, dan Portofolio, dengan demikian kita akan mempunya 3 halaman dengan url http://nama.blogspot.com/depan.html, http://nama.blogspot.com/tentang.html dan http://nama.blogspot.com/portofolio.html. Selanjutnya ikuti langkah-langkah pembuatan menu secara otomatis menggunakan List-O-Matic. Setelah semua langkah di lakukan, kamu akan di beri 2 jenis kode yaitu HTML dan CSS.
Here is the HTML for this list:

<div id="navcontainer">

<ul id="navlist">

<li><a href="http://nama.blogspot.com/depan.html">Depan</a></li>

<li><a href="http://nama.blogspot.com/tentang.html">Tentang</a></li>

<li><a href="http://nama.blogspot.com/portofolio.html">Portofolio</a></li>

</ul>

</div>

Copy kode HTML dan masukkan lewat Add a Page Element – HTML/JavaScript dan letakkan dimana kamu pengen menunya muncul.
Here is the CSS for this list:

#navlist ul

{

margin-left: 0;

padding-left: 0;

white-space: nowrap;

}

#navlist li

{

display: inline;

list-style-type: none;

}

#navlist a { padding: 3px 10px; }

#navlist a:link, #navlist a:visited

{

color: #fff;

background-color: #036;

text-decoration: none;

}

#navlist a:hover

{

color: #fff;

background-color: #369;

text-decoration: none;

}

Sedangkan untuk kode CSS harus di copy dan di letakkan dalam kode template. Di halaman template blog kamu, pilih Edit HTML, letakkan kode CSS dari List-O-Matic tadi sebelum kode ]]></b:skin> dan save template.

IP Tracker Pada Blog

di 03.58 Label:TUTORIAL BERITA, BLOG, UNIK

Sesuai namanya, IP tracker atau pelacak alamat IP, tool ini berfungsi untuk melacak alamat IP (Internet Protocol) pengunjung blog anda. Pelacak alamat IP ini juga bisa melacak browser serta operating system yang dipakai oleh pengunjung.

Alamat IP adalah alamat komputer anda dalam jaringan LAN (Local Area Network) maupun WAN (Wide Area Network). Yang dimaksud dengan LAN adalah jaringan komputer yang mencakup wilayah kecil, seperti di kampus, rumah. Sedangkan WAN adalah jaringan komputer yang mencakup area yang lebih besar, seperti jaringan komputer antar wilayah, kota, atau bahkan negara.
Salah satu penyedia tool pelacak IP adalah www.ipnow.org, gratis Tampilannya di blog seperti gambar di bawah ini:
1. Kunjungi situs www.ipnow.org.

Pada halaman muka, lihat pada bagian Custom Images. Terdapat beberapa pilihan bentuk tampilan yang bisa disesuaikan dengan blog anda. Lalu akan tampil halaman untuk mengatur warna latar belakang (background color) dan warna font (text color). Setelah itu klik pada tombol Create My Image.

Setelah anda mendapatkan kodenya, selanjutnya anda tinggal menempelkannya di blog anda. Caranya adalah sebagai berikut:
@. Masuk dan login ke www.blogger.com.
@. Masuklah pada halaman Dasbor.
@. Klik menu Tata Letak.
@. Klik menu Tambah Gadget.
@. Klik pada link menu HTML/JavaScript.
@. Pada bagian Judul, ketikkan judul menu yang dibuat. Misal : IP Anda.
@. Pada bagian konten, copy (Ctrl+C) kode yang sudah anda dapatkan di atas dan tempel (Ctrl+V) di sini.
@. Klik tombol Simpan jika sudah selesai.
@. Lihat blog anda untuk melihat hasilnya.

MEMASANG KOTAK PENCARIAN

di 03.50 Label:TUTORIAL BERITA, BLOG, UNIK

Adanya kotak pencarian pada blog, akan mempermudah pengunjung menemukan artikel yang dibutuhkan. Berikut ini langkah-langkah untuk memasang kotak pencarian:

Masuk ke halaman dashboard, pilih layout (tata letak)

Lalu klik Add Gadget (Tambah Gadget)

Lalu pilih HTML/JavaScript.

Pada kotak Content (Konten) masukkan kode berikut: <form action="http://NamaBlogAnda.blogspot.com/search" method="get"> <input class="textinput" name="q" size="30" type="text"/> <input value="search" class="buttonsubmit" name="submit" type="submit"/></form>

Ganti NamaBlogAnda dalam kode di atas dengan nama blog anda. Angka 30 setelah kode size dapat anda ubah sesuai panjang kotak yang diinginkan. Semakin besar angka semakin panjang kotak.

Akhiri dengan klik tombol Save.

Hasilnya adalah seperti pada gambar di bawah ini.

MEMBUAT RECENT COMMENT

di 03.46 Label:TUTORIAL BLOG

berikut ini kita akan membuat Recent Comments agar menampilkan komentar terakhir pada blog . Perbedaan dengan Recent Post terletak pada feed url, yaitu http://namablog.blogspot.com/feeds/comments/default. Berikut tutorialnya :

#Klik Layout. Pada Page Element (Elemen Halaman) pilih Add a gadget (Tambah gadget).kita pilih feed

Akan tampil kotak dialog Configure Feed (Konfigurasi feed). Masukkan alamat feed untuk postingan yaitu http://namablog.blogspot.com/feeds/comments/default Ganti namablog dengan nama blog yang kita miliki.