Cara membuat tabel di Blog tanpa Coding

Membuat tabel dalam sebuah artikel bagi sebagian blogger mungkin merupakan hal yang sulit, karena bagi kita yang belum paham kode-kode HTML tentu akan kebingungan. Sebenarnya bisa saja kita membuat tabel dengan mengcopy paste dokumen tabel yang sudah kita buat di Microsoft word atau Excel. tapi jika sobat blogger memiliki koneksi internet yang lelet, terkadang tidak bisa terpublikasi. Mengapa bisa tidak terpublikasi? Karena tabel atau dokumen yang langsung kita copy paste dari microsoft word / Excel tadi sebenarnya mengandung kode-kode rumit. Terkadang pula tabel yang sudah kita copas dari excel, ketika di masukkan ke posting blog tidak menjadi sebuah tabel yang diinginkan / tidak ada garisnya.

Jika sobat sudah memakai software/aplikasi Windows Live Writer, membuat tabel akan mudah dilakukan, karena dalam toolsnya sudah ada pembuat tabel. Berbeda dengan blogger yang belum ada.

Buat sobat yang menemui kendala dalam pembuatan tabel di blog karena belum mengenal kode-kode HTML/CSS tabel, mungkin bisa mengikuti cara berikut ini.

1. Buatlah terlebih dulu tabel artikel kita di MS word/excel.

2. Blok/Highlight tabel yang sudah jadi tadi, kemudian copy.

3. Lalu Masuk ke http://tableizer.journalistopia.com/

4. Paste dokumen tabel tadi di dalam for.

Paste your cells from Excel, Calc or other spreadsheet here:

5. Jangan lupa mengatur ukuran huruf, jenis huruf dan warna header tabel di posting blog.

6. Jika sudah selesai, lihat preview kodenya di bagian bawah, Klik Tableize it!

7. Tunggu sebentar, maka Akan di dapat kode HTML untuk tabel yang siap dimasukkan ke dalam posting blog.

8. Langkah berikutnya adalah copy kode yang di dapat di form

9. Masuk ke pembuatan artikel, Silakan masukkan kata atau kalimat yang dikehendaki
 
Klik menu HTML di samping menu Compose.

Memasukkan kode yang sudah di copy tadi pada tempat yang dikehendaki

10. Kembali ke menu Compose untuk memasukkan kalimat atau kata-kata yang lainnya, seandainya tabel berada di tengah postingan.


Sebagai contoh bisa dilihat pada tabel di bawah adalah hasil Tableizer.

No	Nama Tutorial	KODE	Keterangan
1	Cara membuat tabel	HTML
2	Cara membuat tabel	CSS 3
3	Cara membuat tabel	CSS 5

Cukup mudah bukan? Memang untuk pewarnaan hanya bisa di header tabel saja. Silakan sobat coba-coba.

Cara Membuat / Mengganti Favicon / Site Icon Blog

Favorit Icon atau yang disingkat Favicon adalah sebuah gambar kecil di address bar. Terletak disebelah kiri nama blog ataupun judul posting blog yang sedang kita buka. favicon bawaan blogspot biasanya dilambangkan dengan huruf B dalam kotak berwarna orange. Seorang blogger mengganti faviconnya mungkin bisa jadi agar terlihat lebih indah, keren dan profesional, hehehe. Lihat Gambar di Bawah.

Ada 2 cara untuk mengganti favicon, cara pertama ialah secara default dan ini cukup mudah dilakukan sedangkan cara kedua ialah dengan membuat favicon secara online kemudian mengupload gambar favicon itu di hosting/tempat penyimpanan image online (misal di google code). Yuk kita simak sama-sama caranya.

Cara Pertama;

1. Buatlah dan Siapkan gambar yang akan dijadikan favicon, persegi bujur sangkar misalnya ukuran 32x32 pixel atau berapapun yang penting harus persegi.

2. Masuk ke Rancangan > Tata Letak > Lihat ada kata Favicon di atas header, Klik link Edit.

3. Cari gambar dengan klik Telusuri lalu klik simpan.

4. Favicon blog sobat sudah berubah. hehehe

Cara kedua;

1. Masuk ke genfavicon.com  atau ke www.favicon.cc
 
2. Buat favicon di  situ. sebagai contoh saya akan membuat favicon di genfavicon.

3. Masukkan gambar baik lewat url gambar ataupun menguploadnya (disini saya menguploadnya) lalu Klik Upload image

4. Jika sudah diupload bisa Select Size untuk menentukan ukuran gambar. atau juga memotongnya/crop (crop & preview) sesuai tampilan yang kita inginkan.

5. Download favicon Image. Lalu upload ke hosting gambar, disini Saya menguploadnya ke google code.

6. Buka Dasbor > Menu Template > edit HTML > centang expand template, cari kode  <b:skin><![CDATA[. Lalu masukkan alamat url favicon blog yang telah di upload di hosting image tadi, tepat di atas kode  
<b:skin><![CDATA[.  diantara kode biru dibawah.

<link href=' masukkan alamat tempat hosting favicon ' rel='shotcut icon'/>

sebagai contoh lihat kode di bawah ini.

<link href='http://julak-project.googlecode.com/files/animated_Favicon.gif' rel='shotcut icon'/>
 <b:skin><![CDATA[

pada kode berwarna merah diatas, adalah alamat saya menyimpan/hosting gambar favicon blog ini.

7. Jika sudah klik pratinjau, lalu save template. Lihat perubahannya.

Jika sobat mau tau cara membuat file hosting image, javascript maupun dokumen lain di google code termasuk menyimpan gambar favicon silahkan kunjungi postingan cara membuat file hosting di google code

Nah bagaimana sobat sudah berhasil mengganti faviconnya, terlihat lebih profesional, keren dan ... bagus khan? hehehe selamat mencoba. Salam Blogger.

Cara Membuat Menu Vertikal di Blog

Sobat blogger pasti sudah tahu apa yang saya maksud. Pada tutorial kali ini Julak mau berbagi tentang cara membuat menu navigasi dropdown vertikal, Sobat bisa lihat di sidebar kanan sebagai contohnya. Caranya cukup mudah hanya tinggal memasukkan kode ke dalam gadget. Menu vertikal ini cukup unik karena akan bergeser turun saat cursor mouse diarahkan ke menu.

Berikut kodenya

<style type="text/css">
* {
  margin: 0px;
  padding: 0px;
}
nav {
  font-family: Helvetica, Arial, sans-serif;
  line-height: 1.5;
  margin: 50px auto; /*for display only*/
  width: 300px;
  -webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
     -moz-box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
          box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
}
.menu-item {
  background: #fff;
  width: 300px;
}
/*Menu Header Styles 1*/
.menu-item h4 {
  color: #fff;
  font-size: 15px;
  font-weight: 500;
  padding: 7px 12px;
  background: #9DB6D7;
}
.menu-item h4 a {
  color: white;
  display: block;
  text-decoration: none;
  width: 300px;
}
/*Menu Header Styles 2*/
.menu-item h4 {
  border-bottom: 1px solid rgba(0,0,0,0.3);
  border-top: 1px solid rgba(255,255,255,0.2);
  color: #fff;
  font-size: 15px;
  font-weight: 500;
  padding: 7px 12px;
  background: #a90329; /* Old browsers */
  background: -moz-linear-gradient(top, #a90329 0%, #8f0222 44%, #6d0019 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a90329), color-stop(44%,#8f0222), color-stop(100%,#6d0019)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #a90329 0%,#8f0222 44%,#6d0019 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #a90329 0%,#8f0222 44%,#6d0019 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #a90329 0%,#8f0222 44%,#6d0019 100%); /* IE10+ */
  background: linear-gradient(top, #a90329 0%,#8f0222 44%,#6d0019 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#6d0019',GradientType=0 ); /* IE6-9 */
}
.menu-item h4:hover {
  background: #cc002c; /* Old browsers */
  background: -moz-linear-gradient(top,  #cc002c 0%, #6d0019 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#cc002c), color-stop(100%,#6d0019)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  #cc002c 0%,#6d0019 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #cc002c 0%,#6d0019 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #cc002c 0%,#6d0019 100%); /* IE10+ */
  background: linear-gradient(top,  #cc002c 0%,#6d0019 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc002c', endColorstr='#6d0019',GradientType=0 ); /* IE6-9 */
}
.alpha p {
  font-size: 13px;
  padding: 8px 12px;
  color: #aaa;
}
/*ul Styles*/
.menu-item ul {
  background: #fff;
  font-size: 13px;
  line-height: 30px;
  list-style-type: none;
  overflow: hidden;
  padding: 0px;
}
.menu-item ul a {
  margin-left: 20px;
  text-decoration: none;
  color: #0A0A0A;
  display: block;
  width: 250px;
}
/*li Styles*/
.menu-item li {
  border-bottom: 1px solid #eee;
}
.menu-item li:hover {
  background: #eee;
}
/*ul Styles*/
.menu-item ul {
  background: #B2D8E0;
  font-size: 13px;
  line-height: 30px;
  height: 0px; /*Collapses the menu*/
  list-style-type: none;
  overflow: hidden;
  padding: 0px;
}
/*ul Styles*/
.menu-item ul {
  background: #fff;
  font-size: 13px;
  line-height: 30px;
  height: 0px;
  list-style-type: none;
  overflow: hidden;
  padding: 0px;
  /*Animation*/
  -webkit-transition: height 1s ease;
     -moz-transition: height 1s ease;
       -o-transition: height 1s ease;
      -ms-transition: height 1s ease;
          transition: height 1s ease;
}
.menu-item:hover ul {
  height: 115px;
}
</style>
<nav>
    <div class="menu-item">
      <h4><a href="http://namablog.com" target="_blank"">Membuat Blog</a></h4>
      <ul>
        <li><a href="http://namablog.com" target="_blank">Membuat Email </a></li>
        <li><a href="http://namablog.com" target="_blank">Membuat tabel </a></li>
        <li><a href="http://namablog.com" target="_blank">Promosi Blog</a></li>
       <li><a href="http://namablog.com" target="_blank">Setelan Blogger</a></li>
       <li><a href="http://namablog.com" target="_blank"> Membuat Gmail</a></li>
    </ul>
    </div>
 
    <div class="menu-item">
      <h4><a href="masukkan URL/Link postingan">Widget</a></h4>
      <ul>
    <li><a href="masukkan URL " target="_blank">Cara Pasang widget</a></li>
    <li><a href="masukkan URL " target="_blank">Cara Buat Laman Statis</a></li>
    <li><a href="masukkan URL " target="_blank">Cara Ganti Favicon</a></li>
    <li><a href="masukkan URL " target="_blank">Ganti Template Blog</a></li>
    <li><a href="masukkan URL " target="_blank">Cara Ubah Background Blog</a></li>
    </ul>
    </div>

    <div class="menu-item">
      <h4><a href="masukkan URL/Link postingan disini" target="_blank"">Widget</a></h4>
      <ul>
    <li><a href="masukkan URL disini" target="_blank">Cara Pasang Gadget</a></li>
    <li><a href="masukkan URL disini" target="_blank">Menu Vertikal</a></li>
    <li><a href="masukkan URL disini" target="_blank">Cara Ganti Favicon</a></li>
    <li><a href="masukkan URL disini" target="_blank">Ganti Template Blog</a></li>
    <li><a href="masukkan URL disini" target="_blank">Ubah Background Blog</a></li>
      </ul>
    </div>

    </nav>


Cara memasang

1. Masuk ke Dasbor Blog >> Tata Letak >> Tambahkan Gadget >> Pilih HTML/Javascript

2. Masukkan kode di atas.

Yang perlu sobat perhatikan antara lain;

1. Ukuran lebar menu disini adalah 300px, jangan lupa disesuaikan dengan ukuran sidebar blog sobat dgn mengurangi atau menambahnya.

2. Jumlah URL/Post maksimal 5 (saya gak tahu juga, kok cuma bisa segitu, hehe maklum super gaptek). Jika sobat mengisi dengan 6 Link, gak bakalan tampil semua.

3. Untuk menambah navigasi, silahkan copy saja kode yang sudah saya beri warna merah tebal sebagai contoh, kemudian ganti URL dan Judul Post

4. Kode berwarna hijau, sebagai judul/anchor text, sesuaikan dengan artikel sobat.

5. Untuk pewarnaan menunya silakan utak atik sendiri yee, hehehe. contoh pewarnaan nya ada pada kode color: #0A0A0A; masuk aja ke Color Generator untuk mengetahui kode warna

6. Selamat Mencoba. Salam Super.

Cara memasukkan video youtube ke blog

Jika sobat Super Gaptek ingin tahu cara upload video ke Youtube, silakan buka Cara Memasukkan Video ke Youtube, nah pada postingan ini adalah cara memasang video youtube ke blog.

Gambar merupakan sebuah hiasan blog. Tanpa sebuah gambar blog seakan mati. Fungsi gambar sendiri adalah mendeskripsikan sebuah artikel. Apa jadinya artikel jika tanpa gambar, apalagi blog seperti Tutorial Blogspot seperti blog Super Gaptek. Gambar menjadi panduan buat pengguna yang masih gaptek dan baru memulai.

Begitu pula halnya video. Malah dengan video akan lebih mudah dalam mengikuti tutorial yang diberikan. 

Kamu yang sekedar sharing video pun bisa memasangnya di blog.

Memasukkan video ke blog sederhananya saya bagi dua saja yaitu langsung menguploadnya ke blog dari koleksi video di komputer dan meng"embed" kode video dari youtube kemudian memasang kode tadi di blog. Kamu juga bisa mengikuti tutorial cara upload video ke youtube di postingan sebelumnya.

1. Cara upload video ke posting blog

• Langkah pertama adalah klik entri baru di dasbor blog untuk membuat artikel baru.
• Ketikkan beberapa kata yang sesuai dengan judul blog
• Saatnya memasukkan video ke dalam artikel blog.
• Klik ikon Video disamping icon gambar dan Link

akan muncul tampilan untuk mengunggah video, Klik Pilih video untuk di unggah, Cari file video didalam folder komputer/laptop kamu. Pilih / klik video lalu klik Open. KLik Unggah

Proses upload video terlihat pada gambar di bawah, lama upload tergantung ukuran video dan jaringan internet yang dipakai.

Jika sudah selesai tampilannya seperti dibawah, dan proses upload video dari komputer ke blog selesai.

Kelemahan cara ini adalah loading blog akan terasa lebih lambat di banding jika kita terlebih dulu menguploadnya ke youtube lalu di embed ke blogger. Namun jika Anda mau mau mencobanya dipersilahkan karena tidak ada yang melarangnya, hehehe.

Di bawah ini contoh video hasil upload dari komputer

B. Cara pasang video dari youtube.

Cara memasukkan video dari youtube ke blog ialah dengan cara mengambil kode, istilahnya embed. Lalu mempaste kode embed tadi pada menu HTML saat membuat artikel blog. Namun jika ingin memasang video nya ke sidebar gadget/widget langsung di masukkan saja.

Masuk ke youtube.com

Cari video yang diinginkan di kotak pencarian.

Jika sudah ketemu videonya klik Bagi

Tunggu sebentar, Klik SEMATKAN, akan muncul KODE yang akan kita copy ke postingan blog.

copy kode yang muncul,

Kembali ke blogger saat membuat artikel

Masuk ke menu HTML (Klik HTML samping compose)

Kamu bisa mengubah ukuran tampilan videonya dengan mengubah width / lebar dan height / tingginya, untuk disesuaikan dengan ukuran halaman postingan blog.
sedangkan untuk mengetengahkan video tambahkan kode

<div align="center">
Kode VIDEO

</div>

Kembali ke menu Compose, Klik compose.

Tampilannya akan kelihatan hitam seperti dibawah, Proses menyematkan atau embed video youtube selesai

Diatas adalah contoh hasil embed video dari youtube  penjelasan dari Matt Cutts tentang bagaimana cara kerja search engine Google, silakan di perhatikan penjelasan "Sidin" jika paham bahasa Inggris, heheh

Cara memasukkan / upload gambar ke blog

Sobat blogger punya koleksi video dan membagikannya ke teman? Atau sudah pernah di upload ke Youtube? Bagaimana cara memasukkan video ke blog? Atau punya koleksi foto dan gambar dan ingin memasukkannya ke postingan blog. Yuk kita ikuti cara-caranya di bawah ini:

Cara memasukkan gambar ke blog

Memasukkan gambar bisa dilakukan dengan 2 cara baik dipostingan ataupun dengan menambah gadget (dipasang di sidebar/footer/header).

a. memasukkan gambar di dalam artikel blog

Silakan masuk ke dasbor klik entri baru untuk membuat postingan terbaru.

Jika ingin memasang gambar tepat di bawah judul blog atau di atas artikel bisa langsung klik icon gambar disamping kata Link

Jika ingin masukkan gambar setelah paragraf tertentu silakan ketikkan dulu kalimat yang dikehendaki

gbr, 1 memasukkan gambar

Jika ingin memasukkan gambar dari koleksi foto di komputer, pilih upload > Pilih file > cari di folder komputer foto yang ingin diupload. jika sudah muncul ) seperti gambar 2 di bawah, klik add selected.

gambar 2 cara pasang gambar di posting blog dengan upload

Jika ingin memasukkan gambar dari koleksi yang sudah dihosting misalnya di Picassa atau google code pilih from Picassa web album atau From a URL, sebagai contoh disini saya akan memasang gambar dari URL hosting di google code.

Caranya:

• Pilih From a URL
• Masukkan URL / Link di form yang tersedia
• Jika sudah muncul preview gambarnya Klik Add Selected

memasukkan gambar di postingan blog dengan URL

Selesai dan Gambar di postingan blog sudah masuk

b. Memasang foto di sidebar/footer

 

Tidak jauh berbeda dengan cara pertama tadi, hanya saja kita memasukkan gambar dengan menambahkan gadget lalu pilih GAMBAR.

Masuk ke dasbor > Tata Letak > Pilih / dan Klik link Gambar atau tanda Plus (+) akan muncul tampilan di bawah ini

Caranya;

1. Sobat boleh memberi judul boleh juga tidak
2. Keterangan gambar berfungsi "alt image" jika link yang dituju masih berupa internal link (link di blog yg sama, saya sarankan masukkan keterangan gambar)
3. Hubungan, boleh di isi link URL tertentu baik keluar atau keluar blog, terserah sobat
4. Pilihan gambar, sama seperti cara a. di atas, jika ingin mengupload dari komputer pilih dari komputer, jika dari web/URL, masukkan URL
5. Centang susutkan gambar jika ukuran lebar sidebar sebesar 300pixel

Nah demikian tadi 2 cara memasukkan gambar ke dalam blog, semoga bisa membantu kamu yang baru memulai ngeblog. Salam Super Gaptek.

Bersambung ke Cara Memasukkan Video ke Blog

Koleksi Javascript / PHP For Blogging Tools 2

Artikel ini merupakan kelanjutan dari posting terdahulu yaitu Kumpulan Kode Javascript Untuk Perkakas Nge Blog dimana pada post itu sudah saya share kode javascript untuk kode warna, pengecek halaman yang terindeks google tools auto submit blog dan auto submit sitemap. Pada posting ini saya akan berbagi kode javascript / php untuk; pengkompres kode CSS / css compressor, auto backlink generator code, dan facebook finder ID.

A. Kode php javascript pengecek pagerank google (pagerank checker tools)

<br /><script src="http://www.mypagerank.net/services/pagerankbutton/servicepr_js.php"></script>

B. Kode javascript untuk memasang tool auto backlink.

<br /><form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=<span style="color: red;">blogbelajar2</span>', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" style="border: 1px solid #ccc; padding: 3px; text-align: center;" target="popupwindow"><br />Enter your email address:<br /><input name="email" style="width: 140px;" type="text" /><br /><input name="uri" type="hidden" value="<span style="color: red;">blogbelajar2</span>" /><input name="loc" type="hidden" value="en_US" /><input type="submit" value="Register" /><br />And add your URL <i>"enjoy"</i></form><br /><iframe frameborder="0" height="1150" src="http://verifiedfile.com/seo/" width="650"></iframe></div></div>

Pengaturan Penting!:

• Untuk mengubah lebar dan tinggi kotak / form lihat width=550 dan height=520, kemudian ubah  sesuai kehendak Sobat
• Lihat kode warna merah blogbelajar2 Sobat harus mengganti alamat feedburner.com dengan alamat feedburner blog milik sobat sendiri. Jika belum tau cara membuat feedburner silakan buka artikel cara membuat akun mendaftar dan memasang  feedburner.com di blog

C. Kode Javascript Facebook Finder ID

 

Tools ini tentunya berguna jika sobat sebagai pengguna facebook sudah terlanjur mengganti username halaman facebook atau akun pribadi facebook dengan nama (tidak dengan angka) lihat artikel Cara merubah username facebook dengan nama. Namun ingin mengetahui kode ID angka akun facebook. Berikut kodenya:

<br /><form action="https://graph.facebook.com/?id=" method="get" target="_blank"><br /><input class="textinput" name="id" size="35" type="text" /><br /><input class="buttonsubmit" name="submit" type="submit" value="Get Facebook ID" /></form>

D. CSS Compressor code tools.

Tools ini mempunyai fungsi untuk mengcompress atau memampatkan kode CSS di template blog agar ukurannya menjadi berkurang sehingga loading blog menjadi ringan.

<br /><div class="cssform"><br /><form action="http://www.cssdrive.com/compressor/compress.php" method="POST" name="form1"><br /><br />Untuk membuat loading blog lebih cepat kita perlu mengcompress kode CSS dalam template blog kita, nah disini Ane ada CSS Compressor yang bisa digunakan untuk mengcompress kode CSS kita. Terima Kasih sudah berkunjung ke blogbelajar2.blogspot.com <br /><br /><script type="text/javascript">var mymode = "normal"; </script><br />Switch to <b><a href="http://www.cssdrive.com/index.php/main/csscompressoradvanced/">Advanced mode</a></b> instead for greater customization.<br /><br /><b>Compression mode:</b> (<b><a href="javascript:void(0)">?</a></b>)<br /><br /><input name="mode" onclick="Javascript:comp_whatMode('light')" type="radio" value="light" /> Light<br /><br /><input checked="checked" name="mode" onclick="Javascript:comp_whatMode('normal')" type="radio" value="normal" /> Normal<br /><br /><input name="mode" onclick="Javascript:comp_whatMode('super')" type="radio" value="compact" /> Super Compact<br /><br /><b>Comments handling:</b> (<b><a href="javascript:void(0)">?</a></b>)<br /><br /><input name="comments" type="radio" value="0" /> Don't strip any comments<br /><input name="comments" type="radio" value="1" /> Strip ALL comments<br /><br /><input checked="checked" name="comments" type="radio" value="2" /><br />Strip comments at least <input name="chars" size="1" type="text" value="4" /><br />chars long (NOT counting line breaks within comment)<br /><br /><b>Insert CSS code:</b><br /><br /><textarea class="csscodearea" cols="50" name="script" rows="15" style="height: 450px;">

Selamat berblogging ria. Silakan dicoba kode-kode javascript dan php gratis untuk anda pelanggan setia Blogger Super gaptek

Cara memasang tweet terbaru di blog

Widget ini adalah untuk menampilkan tweet terakhir dari postingan blog, yaa semacam update status di facebook lah. Sebetulnya widget ini bisa saja kita dapatkan di twitter namun buat sobat yang belum tau caranya dan gak mau repot silahkan memakai kode-kode dibawah ini untuk menampilkan streaming tweet di blognya. Berbeda dengan widget twitter follower box, yang memnampilkan follower, maka gadget ini menampilkan tweet terbaru dari anda dan postingan blog sobat.

Cara menambahkan update tweet ini sebagai berikut:

1. Masuk ke blogger

2. Dasbor > Tata Letak > Tambahkan gadget > HTML/Javascript

3. Copy dan paste kode berikut ini di dalam form yang tersedia.

<div id="twitter-ticker"><div id="top-bar"><div id="twitIcon"><img src="http://julak-project.googlecode.com/files/blogbelajar2tweet1.png" width="64" height="64" alt="Twitter icon" /></div><h2 class="tut">My Tweets</h2></div><div id="tweet-container"><img id="loading" src="http://julak-project.googlecode.com/files/loadingtweetblogbelajar2.gif" width="16" height="11" alt="Loading.." /></div><div id="scroll"></div></div><style>/* CSS Document */h2.tut{/* This is the "MY TWEETS" title */    color: white;font-family: "Myriad Pro", Arial, Helvetica, sans-serif;font-size: 16px;padding: 12px 0 0 58px;text-transform: uppercase;/* The CSS3 text-shadow property */    text-shadow: 2px 1px 6px #333;}#twitter-ticker{/* Styling the ticker */    width: 300px;height: 400px;background: url(http://julak-project.googlecode.com/files/blogbelajar2.blogspot.comtweet2.png) no-repeat #f5f5f5;color: #666666;display: none;/* Rounded corners */    -moz-border-radius: 10px 10px 6px 6px;-khtml-border-radius: 6px;-webkit-border-radius: 6px;border-radius: 6px;text-align: left;}#tweet-container{/* This is where the tweets are inserted */    height: 230px;width: auto;overflow: hidden;}#twitIcon{/* Positioning the icon holder absolutely and moving it to the upper-left */    position: absolute;top: -25px;left: -10px;width: 64px;height: 64px;}#top-bar{height: 45px;background: url(http://julak-project.googlecode.com/files/blogbelajar2.blogspot.comtweet3.png) repeat-x;border-bottom: 1px solid white;position: relative;margin-bottom: 8px;/* Rounding the top part of the ticker, works only in Firefox unfortunately */    -moz-border-radius: 6px 6px 0 0;}.tweet{/* Affects the tweets */    padding: 5px;margin: 0 8px 8px;font-family: calibri;border: 1px solid #F0F0F0;background: url(http://julak-project.googlecode.com/files/blogbelajar2transparent.png);width: auto;overflow: hidden;}.tweet .avatar, .tweet .user, .tweet .time{float: left;}.tweet .time{text-transform: uppercase;font-size: 10px;color: #AAAAAA;white-space: nowrap;}.tweet .avatar img{width: 36px;height: 36px;border: 2px solid #eeeeee;margin: 0 5px 5px 0;}.tweet .txt{/* Using the text container to clear the floats */    clear: both;}.tweet .user{font-weight: bold;}a, a:visited{/* Styling the links */    color: #00BBFF;text-decoration: none;outline: none;}a:hover{text-decoration: underline;}#loading{/* The loading gif animation */    margin: 100px 95px;}.jScrollPaneContainer{position: relative;overflow: hidden;z-index: 1;}.jScrollPaneTrack{position: absolute;cursor: pointer;right: 4px;top: 0;height: 100%;background: #ddd;}.jScrollPaneDrag{position: absolute;background: #999;cursor: pointer;overflow: hidden;}.jScrollPaneDragTop{position: absolute;top: 0;left: 0;overflow: hidden;}.jScrollPaneDragBottom{position: absolute;bottom: 0;left: 0;overflow: hidden;}a.jScrollArrowUp{display: block;position: absolute;z-index: 1;top: 0;right: 0;text-indent: -2000px;overflow: hidden;/*background-color: #666;*/    height: 9px;}a.jScrollArrowUp:hover{/*background-color: #f60;*/}a.jScrollArrowDown{display: block;position: absolute;z-index: 1;bottom: 0;right: 0;text-indent: -2000px;overflow: hidden;/*background-color: #666;*/    height: 9px;}a.jScrollArrowDown:hover{/*background-color: #f60;*/}a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover{/*background-color: #f00;*/}</style><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script><script type="text/javascript" src="http://julak-project.googlecode.com/files/blogbelajar2tw%20.js"></script><script type="text/javascript" src="http://julak-project.googlecode.com/files/blogbelajar2twittertick2%20.js"></script><script type="text/javascript" src="http://julak-project.googlecode.com/files/blogbelajar2twitterticker3%20.js"></script><script type="text/javascript">var tweetUsers=['supergaptech'];</script>

Silakan ganti username akun twitter supergaptech dengan username twitter Anda sendiri
Yang mau lihat live demonya di sini

Monggo yang pengen coba...
Ada juga widget twitter follower box looh...

Aplikasi Ramalan Cinta Buat Remaja

Halo apa kabar sobat blogger, Julak sourie punya koleksi gadget terbaru neeh. Siapa tau ada yang mau pake. Namanya Gadget Ramalan Cinta si Cupid, hehehe... Ada yang coba ngeramal hubungan cintanya dengan seseorang, atau pacar sekarang, atau selingkuhan (ups gak boleh yaa) Gak perlu ke dukun atau Deddy Corbuzier, cukup di sini aje. 

Oke silakan masukkan nama kamu dan pasangan kamu di form yang tersedia. Disini bisa saya kasih contoh adalah ramalan percintaan antara Surti Versus Tejo, xixixi... 100% looh cinta mereka. 

Ini gadget ramalan cinta tampilan yang kedua

Cara pakainya masukkan aja nama kamu dan pasangan kamu lalu klik Calculate.


Atau sobat mau pasang di blog sobat bisa juga, berikut kodenya;

<br /><div align="center"><br /><embed height=<span style="color: red;">"300"</span> rel="nofollow" src="http://www.swfstore.co.uk/uploads/acbd44e841/lovemeter.swf" width=<span style="color: red;">"300"</span>></embed></div>

Ini gadget ramalan cinta tampilan yang kedua

<br /><div style="text-align: left;"><div align="center"><br /><embed <span style="color: red;">height="400"</span> rel="nofollow" src="http://www.swfstore.co.uk/uploads/acbd44e841/cupidslovecalculator.swf" <span style="color: red;">width="500"</span>></embed></div></div>

Silakan atur tinggi dan lebar widget nya sendiri yaa...
Lihat kode yang berwarna merah height untuk ukuran tinggi dan width untuk lebar gadget.

Cara Pasangnya bisa di samping cukup masuk dasbor Tata letak > Tambahkan gadget > Html / javascript

Trus masukkin deh tuh kode.

Kalo mau pasang di postingan atau laman statis jangan lupa masuk ke menu HTML editor

Cara Mengatur dashboard / setelan blogger tampilan baru

Seberapa penting setelan dashboard blogger. Jawabnya sangat penting, karena dari sinilah dasar-dasar SEO blog diawali. Kita bisa mengatur berbagai fitur yang disediakan oleh blogger dengan cara yang cukup mudah, walau ada juga fitur-fitur yang juga berisiko jika kita tidak mengetahuinya.

Dalam tutorial kali ini, saya akan memberikan contoh cara pengaturan dashboard dengan tampilan baru. Mengapa tampilan baru? Banyak kelebihan dasbor terbaru jika dibandingkan dengan tampilan lama. Terutama dalam hal optimasi search engine.

Nah bagaimana cara pengaturan dashboard blogger versi terbaru? Mari kita simak sama-sama. 

Dasbor blogger terdiri dari beberapa tab, yaitu;

1. Ikhtisar

Dalam menu ini terdapat statistik, jumlah komentar, jumlah pageviews terbaru, jumlah post dan jumlah follower serta berita terupdate dari Blogger Buzz. 

2. Menu Post

Di sini ditampilkan seluruh post baik yang sedang dalam proses (draft), Terjadwal maupun yang sudah diposting. Disini juga kita bisa mengedit posting artikel yang sudah pernah dipublikasikan. Kita juga bisa mengatur jumlah post yang ingin ditampilkan perhalaman, 10, 25, 50, 100. Kita juga bisa memilih per label / kategori tertentu yang ingin di tampilkan serta menghapus halaman yang sudah dibuat. 

3. Menu Laman

Pada menu ini bisa dilihat seluruh halaman yang telah dibuat. Untuk pengaturan dan cara membuat laman silakan buka Cara membuat laman 

4. Menu Komentar

Disini bisa kita lihat seluruh komentar baik yang sudah diterbitkan, kategori komentar spam maupun yang dalam proses moderasi.

5. Tab statistik

Pada tab ini bisa dilihat statistik kunjungan terbaru, perharian, mingguan, bulanan maupun secara keseluruhan dari awal dibuatnya blog. Ada juga fitur sumber lalulintas asal kunjungan. Untuk tab pemirsa adalah negara asal pengunjung.

6. Earning Tabs / Penghasilan

Earning tab berfungsi sebagai alat pendaftaran google adsense. Earning tab hanya muncul jika bahasa di atur ke dalam bahasa Inggris (untuk blog lama). Silakan buka artikel Cara memunculkan earning tab di dasbor blog berbahasa Indonesia

7. Tata Letak 

Fitur ini berfungsi untuk mengatur letak gadget-gadget yang berada di sidebar, footer, maupun di bawah posting blog. Silakan geser / drag gadgetnya dengan cara Mengklik Gadget > Tahan > Geser ke tempat yang diinginkan. Selain itu juga untuk menghapus gadget-gadget yang telah digunakan.

8. Template

Tab ini berguna untuk mengganti template blog hasil unduhan, memback up / download template, dan mengubah ukuran halaman post, sidebar, menambah elemen gadget khususnya untuk template default blogspot. serta pengaturan untuk tampilan seluler, mobile.

9. Setelan.

Nah Ini yang utama. Ada beberapa fitur di dasbor tampilan baru yang tidak terdapat di dasbor tampilan lama. Yuk kita simak sama-sama.

A. Setelan Dasar

1. Untuk setelan dasar bisa di atur sebagai berikut;

• Judul adalah berfungsi untuk mengubah nama blog, misalnya punya saya ini Membuat Blog Ala Super Gaptek, silakan klik link edit, lalu masukkan nama blog sobat klik simpan perubahan. Jangan terlalu sering ganti nama, malahan kalau bisa jangan diganti sejak pertama kali dibuat. Kalaupun mau ganti adalah saat pertama bikin blog yaitu baru beberapa artikel dibuat.

• Deskripsi, boleh dikosongkan, kalaupun mau diisi, samakan dengan meta tag deskripsi blog (lihat di setelan preferensi penelusuran) 

• Privasi adalah untuk mengatur apakah blog boleh diakses search engine google atau tidak, silakan pilih Ya pada kedua item.

2. Penerbitan

• Menu ini adalah untuk mengganti URL blog, misalnya punya saya adalah blogbelajar2.blogspot.com. Saran saya JANGAN PERNAH DIGANTI URL blog Anda.

• Selain itu juga untuk mengubah arah penerbitan post, jika suatu saat Anda ingin membeli domain, misalnya .com , .net . web.id , .info dll.

3. Izin

• Penulis blog Untuk mengatur siapa saja yang boleh membuat tulisan atau artikel di blog Anda. Jika mau silakan klik Tambahkan Penulis, Masukkan email Google teman yang diundang untuk menulis di blog kita.

• Pembaca blog pilih Siapapun, jika ingin seluruh orang yang berkomentar.

B. Setelan Pos dan Komentar

• Post ; silakan atur berapa jumlah postingan di halaman utama / homepage blog. Pilih Posting.

• Untuk setelan komentar selengkapnya silakan buka sebab mengapa blog sepi komentar

• Tampilkan gambar dengan lightbox pilih Ya

• Bagikan ke Google Plus pilih Ya (jika akun blogger anda sudah terintegrasi dengan akun google plus)

C. Setting Bahasa dan Pemformatan

• Setelan bahasa jika ingin menampilkan earning tab silakan pilih Inggris - english

• Aktifkan transliterasi pilih dinonaktifkan

• Format silakan atur waktu dimana anda tinggal, ini cukup mudah.

D. Pengaturan preferensi penelusuran

• Tag meta; Deskripsi silakan klik edit kemudian masukkan deskripsi blog. Ini juga berfungsi agar meta tag deskripsi setiap halaman posting blog bisa berfungsi, untuk penjelasan selengkapnya silakan buka Cara menambahkan meta tag deskripsi blogger versi terbaru

Kesalahan dan pengalihan

• Pesan Khusus untuk Laman Tidak Ditemukan klik Edit > masukkan kata-kata yang dikehendaki

• Pengalihan Khusus; untuk mengatur pengalihan halaman ke halaman lain (redirect) di pencarian google

• Untuk perayapan dan pengindeksan (crawl and indexing) biarkan gak perlu diedit kecuali anda punya keahlian alias sudah master. hehehe

E. Setelan Lainnya

Alat Blog

• Impor blog adalah fitur untuk memasukkan entri / posting blog dan komentar dalam format .xml. Saya sendiri kurang begitu paham  cara kerja fitur ini. 

• Ekspor blog adalah alat untuk mendownload seluruh isi blog, dengan tujuan untuk memindahkan isi blog ke blog layanan lain, misalnya wordpress dan untuk disimpan di hard disk komputer saja.

Umpan situs

• bolehkan umpan blog pilih Penuh

• Posting URL pengubahan arah feed di isi jika sudah membuat akun di feedburner.com

• Aktifkan tautan lampiran bisa Ya boleh juga tidak

Konten Dewasa

• Pilih Ya jika blog Anda memuat konten dewasa, pilih tidak jika tidak ada konten berbau gituan, hehehe

Google Analytics

• ID properti web analytics di isi kode yang diberikan saat mendaftarkan blog di google analytics

Panjang juga yaa... nah mudahan artikel cara pengaturan dasbor blogger ini bisa membantu saudara blogger mania di mana saja Anda berada.

Cara Memasang Alexa Rank dan Pagerank Widget di Blog

Pada posting di bulan April lalu saya sudah menjelaskan apa yang dimaksud alexa rank dan pagerank. Yaitu suatu sistem perangkingan situs, website atau blog. Nah pada kesempatan ini saya akan membuat tutorial cara memasang widget alexa dan pagerank google di di blog kita.

Seorang blogger memasang gadget rangking diblognya ada beberapa tujuan, ada yang sekedar iseng, ada yang ingin pamer, ada juga demi tujuan bisnis. Misalnya ada seseorang yang ingin memasang iklan  bisa jadi orang tersebut tertarik memasang iklan karena pagerank atau alexa rank yang bagus. Jika kita ingin mengikuti program PPC pun terkadang mereka melihat dari pagerank atau alexa rank blog kita. Yaa semua sih tergantung niat lagi. Apapun tujuannya semua terserah mereka. hehehe

A. Memasang  alexa di blog.

Sebelum kita lebih jauh melangkah, ada beberapa tahapan dalam cara ini; a) membuat akun di alexa, b) mendaftarkan blog dan mengklaim blog di alexa.com, c) mengambil kode javascript widget alexa untuk dipasang di blog.

1. Membuat akun / mendaftar di Alexa.

Bisa dengan 2 cara lewat akun facebook atau via email.

Silakan masuk ke alexa.com

Klik Create an account, di sini agar lebih mudah kita membuat akun atau login via facebook, > klik  login with facebook

Akan muncul pop up / jendela / window baru > Masuk menggunakan akun facebook. akun Selesai dibuat.

2. Mendaftarkan situs / add site ke alexa.com dan klaim blog

Klik link / Masuk ke Site Tools >>  Klik Edit Your Listung (link terletak di bawah)

Gambar 2. SITE TOOLS

Masukkan URL alamat lengkap blog kita, contoh disini saya masukkan http://julaksample.blogspot.com/ lalu klik Edit site listing

Akan muncul perintah klaim blog dulu


Pilih option2 :Add your Alexa verification ID to the home page of blablabla.blogspot.com.

Silakan copy kode yang saya kurungi pada gambar di atas pilih nomor 1 atau 2 sama saja.

sebagai contoh saya copy yang nomor 2 kodenya adalah sebagai berikut;

<meta name="alexaVerifyID" content="AcTMdvmd2aGJ3BhWxqn7Ipo_5qY" />

Kemudian masuk ke akun blogger > Dasbor > Template > Edit HTML > Lanjutkan > Centang expland template widget.

cari kode <head> lalu masukkan kode tadi dibawahnya sehingga ;

<head>
<meta name="alexaVerifyID" content="AcTMdvmd2aGJ3BhWxqn7Ipo_5qY" />

atau bisa juga masukkan tepat di atasnya kode  <b:skin><![CDATA[/*

Lalu Simpan Template

Kembali ke Alexa  tadi Klik Verify My ID, tunggu sebentar, jika sobat tadi sudah menyimpan meta tag klaim blog di alexa, maka akan muncul your site is succesfully claimed.  

Klik continue (di pojok kanan bawah)

Saatnya memasukkan nama blog, deskripsi blog, Pilih negara (bagian kanan) Boleh juga masukkan nama pemilik blog, alamat dll. Jika selesai Klik Save and Continue Skip

akan muncul

Congratulations! You have claimed http://blogkamu.blogspot.com/

3. Mengcopy kode widget alexa untuk blog

 

Kembali ke Site Tools (lihat gambar 2 diatas)

Klik alexa site widgets

Masukkan kembali URL blog kita, Kemudian Klik Build Widget

copy kode yang ada, silahkan pilih tampilan preview di samping, sebaiknya yang ukuran kecil saja

 

Masuk Kembali ke akun blogger

Dasbor > Tata Letak > Tambahkan gadget> HTML/Javascript > paste kode yang diberikan tadi > Simpan. 

Selesai dan widget alexa rank sudah terpasang di blog sobat.

 

B. Memasang gadget pagerank Google di blog

 

Sebetulnya banyak situs penyedia widget pagerank namun sebagai contoh di sini saya akan membuat widget di prchecker.info karena menurut saya proses nya cukup mudah. Oh ya sebelum mengambil kodenya bisa juga sobat cek dulu pagerank google sobat. Caranya masukkan url lalu klik Check PR.

Silakan masuk ke www.prchecker.info

Klik salah satu gambar tampilan pagerank yang diinginkan

 Kemudian masukkan Anti bot code di samping kiri > Klik Generate Now.

Setelah sobat mencopy kode tadi:
Masuk ke akun blogger > Tata Letak > Tambahkan Gadget > HTML/javascript > pastekan code yang di dapat > Simpan > simpan setelan.

Selesai. Akhirnya pagerank google dan alexa widget pun terpasang di blog sobat. Memang saat memasang kode alexa rank cukup ribet, tidak seperti pasang pagerank. Jika gagal coba terus. Yaa sekalian belajar, hehehe. Silakan dicoba.

Menjawab pertanyaan teman-teman kok No Data alexanya, ya wajar namanya juga baru, jika traffic kunjungan dan links in (link masuk) ke blog biasanya rangking global, dalam 5 hari sudah muncul angkanya, biasanya kisaran 20 jutaan kemudian akan terus menurun (makin kecil) seiring perkembangan blog kita. sedangkan link ini adalah jumlah ink yang masuk ke blog kita.

Buat sobat yang mau meningkatkan kualitas alexa rank bisa membuka Tips mengecilkan/menguruskan alexa

Memasang Gadget Jam Flash Unik di Blog

Hallo Guys.... Apa kabar neeh. Ane punya koleksi jam digital kereen looh untuk blog kalian ada yang mau gak yaa? Neeh berikut tampilannya. Banyak looh... Tapi ini berformat flash jadi jam nya jangan dipasang banyak-banyak yaa entar loading blog jadi berat...

1. Jam dan kalender

 

Kodenya ini:

<span class="fullpost"><img src="//img2.blogblog.com/img/video_object.png" style="background-color: #b2b2b2; " class="BLOGGER-object-element tr_noresize tr_placeholder" id="BLOGGER_object_1" data-original-id="BLOGGER_object_1" /> </span>

2. Jam silver berputar

 

Kodenya html nya;

<span class="fullpost"><img src="//img2.blogblog.com/img/video_object.png" style="background-color: #b2b2b2; " class="BLOGGER-object-element tr_noresize tr_placeholder" id="BLOGGER_object_3" data-original-id="BLOGGER_object_3" /> </span>

3. Jam Analog plus digital

 

<span class="fullpost"><img src="//img2.blogblog.com/img/video_object.png" style="background-color: #b2b2b2; " class="BLOGGER-object-element tr_noresize tr_placeholder" id="BLOGGER_object_5" data-original-id="BLOGGER_object_5" /> </span>

4. Clicking Digital Clock

Yang ini bisa bunyi lhoo kalo di klik

<span class="fullpost"><img src="//img2.blogblog.com/img/video_object.png" style="background-color: #b2b2b2; " class="BLOGGER-object-element tr_noresize tr_placeholder" id="BLOGGER_object_7" data-original-id="BLOGGER_object_7" /> </span>

 

5. Beautiful Analog Clock with Black outline

 

<span class="fullpost"><img src="//img2.blogblog.com/img/video_object.png" style="background-color: #b2b2b2; " class="BLOGGER-object-element tr_noresize tr_placeholder" id="BLOGGER_object_9" data-original-id="BLOGGER_object_9" /> </span>

 

6. Wooden Clock Light Brown Outline

<span class="fullpost"><img src="//img2.blogblog.com/img/video_object.png" style="background-color: #b2b2b2; " class="BLOGGER-object-element tr_noresize tr_placeholder" id="BLOGGER_object_11" data-original-id="BLOGGER_object_11" /> </span>

Cara memasangnya; Masuk akun blogger Dasbor > Tata Letak > Tambahkan Gadget > Pilih HTML/Javascript Silakan copy masukkan kode di dalam blockquote dalam kotak kuning di atas, lalau paste di form add gadget tadi. Kalo mau meletakkan gadgetnya tepat ditengah silakan tambahkan kode <div align="center"> ........ </div> contohnya; 

<div align="center">

<object><param name="movie" value="http://flash-clocks.com/free-flash-clocks-for-websites/free-flash-clock-15.swf"><embed src="http://flash-clocks.com/free-flash-clocks-for-websites/free-flash-clock-15.swf" width="150" height="150" wmode="transparent"> </embed></object> 

</div>

Kalo ada yang belum tau cara menambah gadget silakan buka halaman Cara Menambah Gadget di Blogger. Bagaimana sobat suka? Silahkan pilih salah satu deech. Happy Blogging ! 

Cara membuat laman statis di blogspot

Hayyaaa.... Pas buka-buka google Analytics eeh ada yang masuk dengan kata kunci cara menambah laman di blog dan yang tertuju bukannya ke halaman yang dimaksud, Malah masuk ke Cara menambahkan meta deskripsi terbaru blogger, hehehe  Laah emang gak ada tutorialnya kok.

Yaa namamnya manusia terkadang lupa. Mungkin juga kesalahan saya yang menganggap bahwa itu pekerjaan yang sangat mudah dilakukan. Sehingga kita melupakan satu hal, masih banyak yang baru belajar dan asing dengan namanya blog dan fitur-fiturnya. 

Laman statis di blogspot biasanya dibuat untuk menu daftar isi, about me/us yang menjelaskan tentang keterangan si pemilik blog, Link exchange / Tukar link, term & conditions dan fungsi lain.  Perbedaan halaman statis dengan halaman posting biasa terletak pada url dan kemampuan index dari search engine, sangat jarang google mengindex static page ini. Untuk URL bedanya seperti pada contoh:

http://blogbelajar2.blogspot.com/p/daftar-isi.html 

atau

http://blogbelajar2.blogspot.com/p/kode-warna.html

Contoh diatas adalah url laman statis blogger, sedangkan di bawah ini adalah contoh halaman posting:

http://blogbelajar2.blogspot.com/2012/04/cara-menambahkan-meta-deskripsi-blogger.html

http://blogbelajar2.blogspot.com/2012/05/memasang-widget-mode-energy-saver-untuk.html

Nah sudah tau pasti bedanya, yaa antara huruf "p" yang artinya page untuk halaman statis dan tahun / bulan posting pada url nya (untuk halaman posting biasa)


Oke dech tak perlu panjang lebar, langsung saja kita ikuti bagaimana cara menambah laman statis di blogger.

1. Pertama masuk ke akun Blogger

2. Silakan buka dasbor > Klik Laman > Klik Laman Baru > Klik Laman Kosong (tambahkan teks dan media)

3. Akan muncul tampilan seperti kita menulis artikel posting blog

• Masukkan judul posting laman, misalnya About Me, atau Daftar Isi Atau Privacy Policy
• Isikan kalimat dan kata-kata dalam posting laman
• Pastikan jika ingin memasang kode javascript, kode teks area Klik menu HTML, bukan compose
• Jangan lupa masukkan deskripsi penelusuran di samping kanan letaknya (akan ada jika sobat sudah mengaktifkan fitur meta deskripsi blogger) 
• Terakhir klik publikasikan
• SELENGKAPNYA LIHAT GAMBAR

4. Pengaturan

• Pada Tampilkan laman sebagai pilih > Jangan tampilkan, Ini jika sobat mau memasangnya secara manual di menu horizontal. Boleh ditampilkan juga di sidebar / tab samping atau di elemen header / tab atas. Namun jika di header biasanya jelek hasilnya, sedangkan jika di sidebar akan muncul menjadi menu vertikal. Saran saya buat dan pasang link laman di menu horizontal saja. Buka artikel Cara membuat menu navigasi horisontal drop down 

• Bagaimana cara memasang link laman di menu  horisontal? Silakan klik kanan pada link laman yang sudah dibuat, > Salin lokasi tautan/copy link location. Kemudian masukkan / paste link di menu horisontal yang telah di buat.

 Oke sobat sudah selesai membuat halaman di blogger? Mudah bukan? Silakan di coba.