Template Blog

6:58 PM

Template Blog - Jalan Tikus Blog

Template Blog baru nih, siapa gak kenal jalantikus.com, itu loh web keren artikelnya sama templatenya, nggak heran para blogger dari dulu nyari template jalantikus untuk blog, sekarang udah hadir template jalantikus untuk blogger, wah pada seneng nih heheheh, tenang gratis kok gak usah bayar, tapi kalian harus ingat template ini tidak diperjual belikan, jika ingin menjual template jalan tikus hendaknya minta izin dulu sama pemilik web jalantikus, dan jangan menghapus credit link, dengan tujuan agar tidak di anggap plagiat, oh iya template nya tidak 100% mirip seperti jalantikus lo, lah terus? tenang aja template ini menurut saya udah 98% mirip dari template aslinya dan masih dalam pengembangan, jadi terus berkunjung ke omcuyu.blogspot.com untuk mengetahui update dari template jalantikus, ok langsung cek fitur templatenya, kalau penasaran bisa klik demonya hehehe

Fitur - Fitur Template Jalan Tikus Blogger Version :

- Responsive
- SEO (Search Engine Optimization)
- Top Menu Navigation With Font Awesome
- Social Media In Top Menu
- Show Hide Search Form
- Post Grid Mode
- 5 Kolom Footer
- Special Menu In Footerfix
- Special Social Media Homepage In Footerfix
- Ads Banner 728x90 / 970x90
- LargeWidget In Homepage
- Related Posts and Special Related Post
- Theme License By Jalantikus.com
- Share Post (Facebook, Google+, Twitter)
- Breadcrumbs
- Twitter Emoji Emoticon
- Konversi Kode
- And Much More...

Feature Post :

div id="featured-widget">
<div class="featured-wrapper">
<a href="#LINK-SOFTWARE"><img src="#LINK-GAMBAR"/></a>
<div class="featured-title"><a href="#LINK-SOFTWARE">SOFTWARE TITLE</a></div>
<span>PEMILIK SOFTWARE</span><br/>
<span><a href="#LABEL-LINK">LABEL</a></span><br/>
</div>
<div class="featured"><i class="fa fa-windows"></i> FEATURED</div>
</div>

<style>
/* CSS Featured Widget */
#featured-widget {width:140px;height:239px;background:#fff;border:1px solid #ddd;text-align:center;float:left;margin-right:20px;}
.featured-wrapper {margin:10px;}
.featured-wrapper img {width:88px;height:88px;padding-bottom:20px;}
.featured-title a{font-weight:bold;color:#222;font-size:15px;}
.featured-title {margin-bottom:10px;}
.featured-wrapper span {font-size:12px;color:#999;}
.featured-wrapper span a{font-size:12px;color:#999;}
.featured {background: #eee;padding: 10px;font-size: 10px;color: #888;margin-top: 40px;}
.featured .fa {color:#fff;padding:5px;float:left;text-align:left;margin-top:-5px;}
.featured .fa-android {background:#6ab344;border-radius:100%;}
.featured .fa-windows {background:#1f9cf4;border-radius:100%;}
@media screen and (max-width:640px) {#featured-widget {display:none;}}
</style>

6:35 PM

Cara Membuat Blog Valid HTML5

Tahap Pertama :

Mengedit HTML di dalam Post,
Agar gambar (image) bisa dibaca oleh search engine robots maka harus dilakukan perubahan

1. Pada bagian gambar (image) sebaiknya gunakan format .png
    Bungkus kode image dan berikan atrribut Tag />
    dengan menambahkan tag title="Titel Gambar" dan img alt="Kode Gambar"

    contoh :

<a href="URL Anda"><img alt="Titel Gambar" src="http://ajatshare.blogspot.com/blog-valid-html5.png" alt="Kode Gambar"/></a>

2. Hilangkan/hapus kode imageanchor="1" pada tag img.
Hilangkan/hapus kode border="0" pada tag img.

Tahap Kedua :

Mengganti kode template lama
Sebelum melakukan perubahan pada template, backup dulu template anda beserta widgetnya.
Hal ini dilakukan agar tidak terjadi kesalahan pada saat di check oleh validator.

1. Ganti kode :

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html b:version='2' class='v2' expr:dir='data:blog.languageDirection'xmlns='http://www.w3.org/1999/xhtml'xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data'xmlns:expr='http://www.google.com/2005/gml/expr'>
<head> 

ganti dengan

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<HTML>
<head>
<meta charset='utf-8'/>

2. Ganti kode :

<b:include name='nextprev'/>

ganti dengan

<b:if cond='data:blog.homepageUrl != data:blog.url'>

<b:include name='nextprev'/>
</b:if>

3. Ganti kode :

</html> dengan </HTML>

4. Ganti semua garis yang ada dalam kode css

/*-----Header------*/ menjadi seperti /* Header */

5. Cari kode

<center>

ganti dengan

<div style='text-align:center;'>

dan pada penutup elemennya </center> ganti dengan </div>

6. Cari kode: onClick ganti dengan onclick (huruf C ditengah menjadi huruf kecil)

7. cari kode

<span class='post-icons'>
<!-- email post links -->
<b:if cond='data:post.emailPostUrl'>
<span class='item-action'>
<a expr:href='data:post.emailPostUrl' expr:title='data:top.emailPostMsg'><img alt='' class='icon-action' height='13' src='http://img1.blogblog.com/img/icon18_email.gif' width='18'/></a>
</span>
</b:if>
<!-- quickedit pencil -->
<b:include data='post' name='postQuickEdit'/>
</span> <div class='post-share-buttons'>
<b:include data='post' name='shareButtons'/>
</div> </div>

kemudian ganti dengan:

<span class='post-icons'>
<!-- email post links -->
<b:if cond='data:post.emailPostUrl'></b:if>
</span>
</div>

8. Jika dicek terjadi kesalahan duplikat ID,

pada kode css : "#" ganti dengan "."
contoh : #artigo ganti dengan .artigo

pada kode html : <div id='artigo'> ganti dengan <div class='artigo'>

9. Mengganti kode pembuka dan penutup script dan style
cari kode :

<script>Kodescript </script>

ganti dengan

<script type='text/javascript'>Kode script</script>

cari kode :

<style>Kode CSS</style>

ganti dengan

<style type='text/css'>Kode CSS</style>

Tahap Ketiga :
Menghapus kode yang tidak valid HTML5 dalam template
1. Hapus kode ini:

   <div class='post-share-buttons goog-inline-block'>
   kode lain...
   </div>

2. Hapus Kode ini:

<b:includable id='postQuickEdit' var='post'>
  <b:if cond='data:post.editUrl'>
    <span expr:class='&quot;item-control &quot; + data:post.adminClass'>
      <a expr:href='data:post.editUrl' expr:title='data:top.editPostMsg'>
      <img alt='' class='icon-action' height='18' src='http://img2.blogblog.com /img/icon18_edit_allbkg.gif' width='18'/>
      </a>
     </span>
   </b:if>
</b:includable>

3. Hapus Kode ini:

<body><div></div>

4. Hapus Kode ini:

<b:include name='quickedit'/>
<b:include data='blog' name='all-head-content'/>

5. Hapus kode ini:

<a expr:name='data:post.id'/>

Tahap Keempat :

Hindari penggunaan widget berikut ini

1. Hindari Tag <center> jika pada Tahap Kedua poin (5) masih error.
2. Hindari pemasangan widget :
   - Google+ Followers
   - Pengikut
   - Share Button
   - Statistic (Penghitung jumlah pengunjung)

Itulah 4 (empat) tahapan Versi Lengkap Cara Membuat Blog Valid HTML5, semoga berhasil

Catatan :
Check Validasi agar template valid HTML5 hanya untuk halaman utama (homepage) saja.
Dan tidak bisa dilakukan pada template yang homepage berisi halaman penuh artikel.

9:40 PM

Cara Mengetahui Profile ID Facebook

Salah satu "masalah" yang harus dikuasai adalah soal nomor ID akun Facebook dan membuat aplikasi FB dan mengetahui App ID.

Gunanya Profil ID Facebook dan Facebook App ID adalah untuk kepentingan plugin sosial dan Sosial Media SEO.

Webisite Instansi/Perusahaan (Corporate Web) biasanya memanfaatkan fasilitas "Like" dan "Like Box" yang dipasang di sidebar atau di bawah tulisan.

Untuk kelancaran SEO Social Media ini, Facebook mengharuskan Anda mengetahui Facebook numeric user ID (Nomor identitas pengguna).

Di template Blog atau Website, biasanya sudah disediakan meta tags seperti berikut ini:

<meta content='YOUR-FACEBOOK-ID' property='fb:admins'/>
<meta content='YOUR-FACEBOOK-APP-ID' property='fb:app_id'/>

Tentu YOUR-FACEBOOK-ID dan YOUR-FACEBOOK-APP-ID itu harus diisi, misalnya menjadi begini:

<meta content='1234573657' property='fb:admins'/>
<meta content='2222768481031' property='fb:app_id'/>

Cara Mengetahui Profile ID Facebook
Gampang banget!

1. Buka saja http://findmyfacebookid.com/ untuk mengetahui Profil ID akun Facebook.
2. Silakan menuju https://developers.facebook.com/apps untuk membuat aplikasi FB dan mengetahui nomor ID-nya.

9:37 PM

Cara Mengganti Tulisan Older Post Dengan Angka

Cara Mengganti Tulisan Older Post Dengan Angka :

Masuk ke desain template anda, kemudian ke "Edit HTML"
Setelah itu cari kode ini ]]></b:skin> kalo sudah ketemu taruh script dibawah ini sebelum kode tersebut

.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #cccccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #cccccc;
background-color:#cccccc;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #cccccc;
background: #cccccc;
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #cccccc;
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#333333;
}

Setelah itu cari kode ini </body> kemudian taruh script dibawah ini sebelum kode tersebut.

<b:if cond='data:blog.pageType != "item"'>

<b:if cond='data:blog.pageType != "static_page"'>

<script type='text/javascript'>

var pageCount=5;

var displayPageNum=5;

var upPageWord ='Previous';

var downPageWord ='Next';

</script>

<script src='http://bloggergadgets.googlecode.com/files/blogger_pagenavi_min.js' type='text/javascript'/>

</b:if> </b:if>

Jika sudah silahkan dilihat hasilnya.

Template Blog - Jalan Tikus Blog

Fitur - Fitur Template Jalan Tikus Blogger Version :

Cara Membuat Blog Valid HTML5

Cara Mengetahui Profile ID Facebook

Cara Mengganti Tulisan Older Post Dengan Angka

Advertisert

Popular Posts