Tampilkan postingan dengan label Informasi. Tampilkan semua postingan
Tampilkan postingan dengan label Informasi. Tampilkan semua postingan

Meta Tag Seo Friendly dan Valid HTML5


Meta Tag Seo Friendly dan Valid HTML5 - Nah, kalian sudah tau kan, Apa Itu Meta Tag ? , kalo belom tau bisa cari di google :D Oke.
langsung aja deh,ikuti cara berikut :

  •  Pergi dan Login ke www.blogger.com
  • Kemudian Pergi lagi ke Template > Edit HTML
  • Selanjutnya, cari kode <head> lalu, letakan kode dibawah ini dibawah kode <head> tadi.
kalau kode meta tag yg lama masih ada, silahkan dihapus terlebih dahulu.

<meta charset='utf-8'/>
<link href='URL Blog Mu' rel='canonical'/>
<b:if cond='data:blog.pageType == &quot;index&quot;'> <title><data:blog.pageTitle/> | Slogan Blog Kamu</title> <b:else/><title><data:blog.pageName/> | <data:blog.title/></title>
</b:if>
<meta content='Description untuk blog kamu' name='description'/>
<meta content='Keywords untuk blog kamu' name='keywords'/>
<meta content='index, follow' name='robots'/>
<meta content='Kode Verfikasi Google Webmaster' name='google-site-verification'/>
<meta content='Kode Verfikasi Bing' name='msvalidate.01'/>
<meta content='Kode Verfikasi Alexa' name='alexaVerifyID'/>
<meta content='2 days' name='revisit-after'/>
<meta content='general' name='rating'/>
<meta content='id' name='geo.country'/>
<meta content='Indonesia' name='geo.placename'/>
<meta content='Nama Pemilik Blog / Author' name='author'/>
<meta content='all' name='Slurp'/>
<meta content='width=device-width' name='viewport'/>
<link href='URL Blog Mu/favicon.ico' rel='icon' type='image/x-icon'/>
<link href='URL Blog Mu/atom.xml' rel='alternate' title='Atom' type='application/atom+xml'/>
<link href='URL Blog Mu/feeds/posts/default' rel='alternate' title='RSS Feeds' type='application/atom+xml'/>
  • Kemudian, kamu atur dulu itu yang saya beri warna hijau.
  • kalau sudah semua nya kamu atur, kemudian save template kamu.
  • Done.
hanya itu dan post ini bersumber dari X-press Community

Anti Click Kanan


Malam sob,udah lama nih gue gak posting disini.
ya maklum aja,lagi sibuk sama kuliah, (sok sibuk lu)

oke,malam ini gue mau share cara bikin anti click kanan di blog.
langsung aja ke caranya :
  • Cari kode </head>
  • Dan taruh kode dibawah ini diatas tag </head>
<!-- Anti Klik Kanan By Patuih D.Silence -->
<script src='http://goo.gl/aoWod' type='text/javascript'/>
<script src='http://goo.gl/9mAsF' type='text/javascript'/>
<!-- End Anti Klik Kanan By Patuih D.Silence -->

  •  Cari kode </body>
  • Dan taruh kode berikut diatas tag </body>
<div class='overlay' id='overlay' style='display:none;'/><div class='box' id='box'><a class='close' id='close'/></div>
okelah,sekian aja.
kalau ada yang ragu silahkan berkomentar aja,insyallah saya balas :v
Cara Membuat Menu Vertikal di Blog

Cara Membuat Menu Vertikal di Blog

Sobat blogger pasti sudah tahu apa yang saya maksud. Pada tutorial kali ini Smart Eeducation mau berbagi tentang cara membuat menu navigasi dropdown vertikal. 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.
 
Daftar Isi - Smart Education

Daftar Isi - Smart Education

Cara untuk mencari arah tanpa menggunakan Kompas - Smart Education


Cara untuk mencari arah tanpa menggunakan Kompas - Bepergian ke tempat asing, terutama hutan atau gunung, mengharuskan traveler untuk membawa kompas. Sayangnya, keberadaan benda yang satu ini sering terlupakan, bingung menentukan arah jika tersesat pun bisa membayangi Anda. Untuk menentukan arah mata angin, kompas memang sangat diperlukan. Tapi bagaimana kalau Anda lupa membawanya saat berada di tengah hutan? 
Agar dapat kembali ke tujuan semula, ikuti 7 tips cara menentukan arah tanpa menggunakan kompas. Inilah cara mudah menentukan arah tanpa menggunakan kompas: 
 

1. Jarum/Silet di permukaan air

http://hermawayne.blogspot.com

Ada cara yang paling umum digunakan seseorang untuk menentukan arah, yaitu membuat kompas sederhana. Caranya mudah, hanya bermodalkan jarum atau silet yang digosok ke permukaan kering, dan ditusukkan ke gabus. Gabungan silet dan gabus kemudian diletakkan di atas permukaan air, sehingga terlihat mengapung. Ujung silet atau jarum pada kompas sederhana ini selalu menunjuk ke arah utara atau selatan. 
 

2. Melihat kuburan Islam dan Kristen

http://hermawayne.blogspot.com

Jika berada di suatu pedesaan yang asing dan tersesat di sana. Anda bisa menentukan arah dengan melihat kuburan. Kuburan Islam dan Kristen selalu menunjukkan arah utara-selatan. Bagian nisan atau kepala yang selalu menghadap ke barat. Jadikanlah ini sebagai patokan dasar. Eits, tapi ingat, ini hanya berlaku di wilayah Indonesia saja. 
 

3. Masjid/Musholla

http://hermawayne.blogspot.com

Jika tidak menemukan kuburan, Anda bisa mencari tempat ibadah, seperti masjid. Anda bisa memanfaatkan arah kiblat atau arah sholat umat muslim. Di Indonesia, masjid selalu menghadap ke arah barat, karena ka'bah yang dijadikan kiblat umat muslim berada di barat Indonesia. Manfaatkan ini sebagai patokan dasar menentukan arah selanjutnya. 
 

4. Melihat jam dan posisi matahari

http://hermawayne.blogspot.com

Saat tersesat di suatu tempat tertutup seperti hutan, ada kalanya Anda sulit menentukan arah tanpa adanya kompas. Tapi jangan terburu panik, cobalah tenang dan lihat jam saat itu, kemudian lihat ke arah matahari. Penulisan 12 jam yang membulat mengikuti arah pergerakan matahari yang terbit dari timur dan tenggelam di barat. Jadi, setelah melihat jam, segera menghadap ke matahari. Jadikan posisi matahari yang terbit di barat sebagai patokan dasar. Anda pun bisa menentukan arah selanjutnya dengan menggunakan jam tangan.   


5. Bayangan benda

http://hermawayne.blogspot.com

Jika tersesat pada siang hari, lihatlah ke arah bayangan benda. Sama seperti menentukan arah dengan jam, letakkan benda tegak di permukaan tanah. Pada siang menuju sore, bayangan benda umumnya condong ke barat. Sebaliknya, jika tersesat pagi menjelang siang, bayangan benda umumnya condong ke arah timur. 
 

6. Memanfaatkan pohon

http://hermawayne.blogspot.com

Nah, untuk Anda yang tersesat di kawasan penuh pepohonan, cobalah cari pohon yang berbatang besar. Perhatikan setiap sisi batang pohon ini. Sisi pohon berbatang besar yang terkena sinar matahari dan tidak berlumut menunjukkan arah barat/timur. Jika tersesat pada malam hari, coba raba sisi pohon berbatang besar ini, dan rasakan suhunya. Cari sisi pohon yang terasa paling hangat. Sisi ini menunjukkan arah barat. 
 

7. Kelompok bintang Orion menunjukkan arah barat

http://hermawayne.blogspot.com

Hal yang paling menakutkan adalah tersesat di daerah asing pada malam hari. Saat itu penerangan sangat minim, ditambah tidak adanya kompas, bisa membuat siapa saja panik. Tapi coba manfaatkan keindahan alam lewat taburan bintang di langit. Carilah rasi bintang orion. Rasi bintang ini merupakan perpaduan 3 bintang terang. Jika dipadukan, ketiganya membentuk mirip ekor kalajengking dan selalu menunjuk ke arah barat.
Referensi dari Smart Education

4 Website Teraneh di Dunia - Smart Education



4 Website Teraneh di Dunia - Sebelumnya saya pernah memposting tentang Website Unik untuk Mengisi Waktu Kosong.Sekarang saya akan berbagi 4 Website Aneh di Dunia.Saya tidak tahu sebenarnya apa maksud dan tujuan pemilik website aneh tersebut.Walaupun website-website aneh tersebut tidak pernah membuat artikel,teknik SEO,dan lain-lain tetapi website tersebut mempunyai pagerank dan alexa rank yang bagus.Jika anda penasaran,langsung saja baca ini :

1. http://sometimesredsometimesblue.com/
Lho kok kosong??Ya sesuai namanya website ini memang sesuai namanya sometimes red sometimes blue  yang artinya kadang merah kadang biru,website ini memang kosong dengan background merah dan kadang-kadang biru.Jika anda reload berulang kali maka akan berubah merah atau biru.

2.http://hooooooooo.com/
Hooooooooo,ketika membuka website ini,anda akan disuguhi suara hooooooooo,setelah suara selesai kemudian akan redirect otomatis ke temannya situs temannya yang sama-sama aneh yang hanya berisi suara heeeeeeeey.

3. http://www.staggeringbeauty.com/ 
Ketika anda mengunjungi website ini,anda akan ditampilkan animasi seperti cacing yang bisa anda gerakkan dengan menggerakkan mouse pointer anda.

4. http://www.ismycomputeron.com/
Sesuai dengan namanya is my computer on yang artinya apakah komputerku hidup.Di dalam website ini hanya ada tulisan YES.Ya jelaslah kalau komputer kita mati mana bisa membuka website ini,dan tidak mungkin anda menemukan kata NO disini.

Itulah beberapa website aneh yang saya sendiri juga belum tahu tujuan website-website tersebut.
Selamat mencoba !

Sumber Smart Education

Cara Membuat Gambar Postingan Berputar Saat Disorot Mouse - Smart Education


Gambar Postingan



Ok tanpa panjang lebar yuk langsung saja ke intinya
Kali ini Admin akan berbagi sedikit tutorial blog, yaitu Cara Membuat Gambar Postingan Berputar Saat Disorot Mouse.

Berikut langkah-langkah nya :

1 login akun blogg
2. masuk ke rancangan
3. masuk ek EDIT HTML
4. Cari Kode </head> Letakkan script ini di atas kode </head>
<b:if cond='data:blog.url == data:blog.homepageUrl'><style>.post img{margin:10px;padding-left5px;width:100px;height:100px;text-align:center;-webkit-transition:All 2.346s ease;-moz-transition:All 2.346s ease;-o-transition:All 2.346s ease;-webkit-background-clip:padding-box;-webkit-box-shadow:0 0 0 3px #000cff;-moz-box-shadow:0 0 0 3px #000;box-shadow:0 0 0 3px #000cff;-webkit-border-top-left-radius:60px;-webkit-border-bottom-left-radius:60px;-moz-border-radius-topleft:60px;-moz-border-radius-bottomright:60px;border-top-left-radius:60px;border-bottom-right-radius:60px;-o-border-top-left-radius:60px;-o-border-bottom-right-radius:60px}.post img:hover{box-shadow:1px 1px 10px 3px rgba(0,0,220,0.6);border-radius:0;-webkit-transition:All 2.346s ease;-moz-transition:All 2.346s ease;-o-transition:All 2.346s ease;-moz-transform:rotate(360deg);-webkit-transform:rotate(360deg);-o-transform:rotate(360deg)}
</style></b:if>
Script bisa kamu Edit Sendiri ya :D

Bila ada yang di tanyakan Harap berkomentar Thanks !!

Referensi dari Smart Education

Faster Clean White Blogger Template - Smart Education

Setelah Sebelumnya Saya Share Sebuah Template, Kini Saya Akan Membagikan Template Yang Sedang Saya Pakai Di Blog Art Prieview
Berikut Screen Shotnya


Faster Clean White Blogger Template
Fitur Template :
  • Readmore Otomatis Dengan Gambar
  • Loading Cepat, Bersih
  • Tersedia Versi Mobile
  • Artikel Terkait,  Artikel Terkait Versi Mobile
  • Tombol Share Social Networking
  • Header 2 Kolom
  • Footer 3 Kolom
  • Thread Comment Keren
  • Form Search
  • Digital Clock
  • Masih Banyak Lainnya, Silahkan Dicek Sendiri ^_^
Jika Ada Masalah Silahkan Kontak Saya Via Facebook
Dimohon Untuk Tidak Merubah / Menghapus Credit Link Dari Saya, Terimakasih
Cukup Pendek Postingan Kali Ini Karena Saya Lagi Nggak Mood Menulis Sama Gak Punya Banyak Ide :v

Dimohon Untuk Menghargai Kreativitas, Untuk Tidak Menghapus Credit Link Di Template
Semoga Artikel Ini Bermanfaat !

referensi dari Smart Education
Back to Top