Cara memperbagus tags h2, h3, dan h4 Dengan CSS

Cara memperbagus tags h2, h3, dan h4 Dengan CSS

Hallo Sobat Blogger Kali Ini Saya Akan Membagikan  Tutor Cara memperbagus tags h2, h3, dan h4 Dengan CSS Langsung Saja  Kita Simak Tutorya


Cara memperbagus tags h2, h3, dan h4 Dengan CSS
  • Heading H2 Itu Judul post Sobat Blogger. Jika Sobat Blogger ingin membuat Sebuah judul Di Dalam Post Lagi
  • Subheading h3 Itu Sub bab H2
  • Minor heading h4 Itu Sub H3
Gambar di Bawah  Merupakan screenshot dari hasil Cara memperbagus tags h2, h3, dan h4 Dengan CSS.. Semuanya berjumlah 11 style. Langsung Saja Kita Ke tutorialnya Sobat :
  • Masuk ke akun Blogge
  • Masuk ke Bagian Template Lalu Edit Template
  • Cari Kode Yang Berwarna Merah  ]]></b:skin>  Atau </style> Dengan menggunakan Tombol CTRL+F Agar Lebih Cepat
  • Simpan kode style CCS Yang dibawah pilihan Sobat Blogger diatas kode ]]></b:skin> Atau </style>
  • Save Template jika sudah selesai.

Langsung saja Liat screenshot Tinggal Pilih Yang Agan Suka



  Heading Style 1 :
     .post h4 {     background-attachment: scroll;     background-color:white;background-image: url("http://2.bp.blogspot.com/-GZCR82-F- bU/UTnAhdjJ9eI/AAAAAAAAbXI/Fy0CjGpYCMM/s1600/h2.png");     background-position: 4px 50%;     background-repeat: no-repeat no-repeat;     border: 3px solid;     border-radius: 60px 60px 60px 60px;     box-shadow: 0 1px 3px, 1px 1px 0 inset;     color: #333333;     font-family: inherit;     font-size: inherit;     font-size-adjust: inherit;     font-stretch: inherit;     font-style: inherit;     font-variant: inherit;     font-weight: inherit;     line-height: 1;     list-style: none outside none;     margin: 15px 3px;     outline: medium none;     padding: 3px 10px 3px 30px;     text-shadow: 0 1px 0;     text-transform: uppercase;     vertical-align: baseline; }

  Heading Style 2
    .post h4 {     background-attachment: scroll;     background-color: white;
    background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisrtKRLnPVGi0UoM0e7GzOVtBUwp8ioD_5Grw9XBneXspbtceuRF277qUdxY6_WseC0AqGh9jQRBDbJ4ChsQE4DmQ_dcsTBIQk8PUG5j92q7sr__KdKjyxWFJ6vHoz5Eqccadw9qFHSfRy/s1600/h2.png");
        background-position: 0 50%;     background-repeat: no-repeat no-repeat;     border: 3px solid #0D7005;     border-radius: 14px 14px 14px 14px;     box-shadow: 3px 3px 3px #ABABAB;     color: #25991C;     font-family: Lobster,cursive;     font-size: 26px;     font-weight: normal;     margin: 0 0 1em;     padding: 0 1px 4px 34px;     position: relative;     text-shadow: 1px 1px 0 #000000;     text-transform: capitalize; }



Heading Style 3
    .post h4 {border-bottom: 1px dotted #4E555A;border-top: 1px dotted #4E555A;color: #4E555A;padding: 3px;}



Heading Style 4 :
    .post h4{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg94mAYQAOIFr98V9Ayy-EiG4b6U-yiu__lt3-nmctmY0pv1NgpN4YNQRSib_6jJB08KDsGnF5_kil1h6p2oL3fhXayhB922HLq3_YSL0JOhHvSl8FW-teX59Ar0FENMfNcmePuSacpsHo6/s1600/h2.png") no-repeat scroll 4px center transparent;border: 3px solid #C8C800;border-radius: 60px 60px 60px 60px;box-shadow: 0 1px 3px #C6C6C6, 1px 1px 0 rgba(255, 255, 255, 0.4) inset;color: #A5A503;font-family: 'lobster',sans-serif;font-size: 19px;font-weight: bold;line-height: 1;margin: 15px 3px;padding: 3px 10px 3px 30px;text-shadow: 0 1px 0 #CCCCCC;text-transform: uppercase;}

Heading Style 5 :
    .post h4 {
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHW9436tFv-8LraliYWxmZn2yUauKEW1RHjDgGC4rLVa_emZvnDB-4AM3ijwU6AY1JYZtgiIpmSswtiU0UKX3vV6tsLzDG2YCcXBvvncCnrMOOHnpaI-dPnJHRClxQxRbfFyo8z8SrB9ae/s1600/star.png") no-repeat scroll 5px center transparent;
    clear: both;color: #662D2D;font-family: 'Oswald',sans-serif;font-size: 26px;font-weight: bold;line-height: 1.2;margin: 25px 5px;padding: 6px 10px 2px 40px;text-shadow: 0 1px 0 #CCCCCC;text-transform: uppercase; }

Heading Style 6 : a very commonly used style in many blogs
    .post h4{color:#0080ff;border-top:1px dotted #0080ff;border-bottom:1px dotted #0080ff;padding:3px;}


Heading Style 7 : CSS3 radius
    .post h4{text-align: center;font-weight:bold;border:solid 5px #999c3b;font-size:14px;-moz-border-radius-topleft: 75px;-moz-border-radius-topright:75px;-moz-border-radius-bottomleft:5px;-moz-border-radius-bottomright:5px;-webkit-border-top-left-radius:75px;-webkit-border-top-right-radius:75px;-webkit-border-bottom-left-radius:5px;-webkit-border-bottom-right-radius:5px;border-top-left-radius:75px;border-top-right-radius:75px;border-bottom-left-radius:5px;border-bottom-right-radius:5px;padding:3px}

Heading Style 8 : all round edge


    .post h4{text-align: center;font-weight:bold;border:solid 5px #0fc7ff;font-size:14px;-moz-border-radius-topleft: 75px;-moz-border-radius-topright:75px;-moz-border-radius-bottomleft:75px;-moz-border-radius-bottomright:75px;-webkit-border-top-left-radius:75px;-webkit-border-top-right-radius:75px;-webkit-border-bottom-left-radius:75px;-webkit-border-bottom-right-radius:75px;border-top-left-radius:75px;border-top-right-radius:75px;border-bottom-left-radius:75px;border-bottom-right-radius:75px;}


Heading Style 9 : with weird shadow
    .post h4{line-height: 1em;color: #91b9ff;font-weight:bold;font-size: 17px;text-shadow:0px 0px 0 rgb(-365,-325,-255), 0px -1px 0 rgb(-620,-580,-510),0px -2px 1px rgba(0,0,0,1),0px -2px 1px rgba(0,0,0,0.5),0px 0px 1px rgba(0,0,0,.2);}

Heading Style 10 : with invisible shadow
    .post h4{ font-size: 14px; font-weight: bold; text-shadow: 0px 0px 35px #000000;}


Heading Style 11 : with hover effect
    .post h4 {color:#0000ff;border-left:10px solid #0000ff;border-right:10px solid #0000ff;padding:3px 5px 3px 20px;border-radius:15px;-moz-border-radius:15px;box-shadow:0px 0px 13px #0000ff;-webkit-box-shadow:0px 0px 13px #0000ff;-moz-box-shadow:0px 0px 13px #0000ff;}.post h3, .post h4:hover {color:#f01a1a;border-left:10px solid #f01a1a;border-right:10px solid #f01a1a;box-shadow:0px 0px 13px #f01a1a;-webkit-box-shadow:0px 0px 13px #f01a1a;-moz-box-shadow:0px 0px 13px #f01a1a;}

Keterangan
Jika Soabt Blogger Ingin Mengganti .post h4  Yang diatas  dengan  .post h2, post h3, .post h4 (memasang diketiga tags H2 H3 H4)

1 Tutorial Lagi Cara Mempercantik Bullet List di Blog

Cara Mempercantik Bullet List di Blog

Cara Mempercantik Bullet List di Blog

Hallo Sobat Blogger Kali Ini Saya Akan Membagikan Trick Cara Mempercantik Bullet List di Blog Agar Enak Di pandang dan post rapian & Menjadi indah artikel blog Kita.

Cara Mempercantik Bullet List di Blog

  •   Cari kode ]]></b:skin> gunakan/tekan F3 pada keyboard untuk mempercepat pencarian
  •   Masukkan  kode dibawah ini tepat diatas ]]></b:skin>

Kode  Untuk Bullet List dan Efek Hover

    .post ul {
    margin: 5px 0px 5px 10px;padding: 0 0 0 20px;list-style-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCIm9WrtfuKdy9mbbtIJqvCUmX-JGQJqPMK00rAZe9cM5MnqBrEpHKW3ljnRL0w5zX0NxB1Z4mhgsDfg4oKxYRIzB2DBglWIgOXqJCtXBGs0x2nBJ8q1Ra0m8cEgNyYYInGpRVwzllGUKy/s1600/bullet_blue_arrow.png);}
    .post li {
    margin: 0 0 0 10px;padding: 3px;
    }
    .post li:hover {
    list-style-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGnRAK4g6aEIXGrfTLVeHlTIDy4YJgtUUFwub80tTjR0SccK3pe3q_R3qMQA8cLLEQ5LDJxIE9ELv2bLAif0yI9E_VAmsmBHNHuirvDkmKuHh8e11ntU-g4KMjtnRHyleaOQ4aB_yQndI/s12/Ul%2520li%2520hover.png);cursor: pointer;
    }

Kode Yang Berwarna Merah URL Gambar Bullet  Dan Warna Biru adalah alamat url hover Jika Sobat Blogger Ingin Mengganti Gambar Bullet List Klik Di Sini
Cara Mengatasi Error Ups, Itu Kesalahan Pada OpenID

Cara Mengatasi Error Ups, Itu Kesalahan Pada OpenID

Hallo Sobat Blogger Selamat Pagi Kali ini Saya Admin HIKAMEDITION Akan Berbagi Tutorial Cara Mengatasi OpenID Error Ups Itu Kesalahan ,Buat Para Blogger yang kesulitan menggunakan openID,  Yang mengalami kegagalan Menggunakan Komentar OpenID "Error Ups Itu Kesalahan" Termasuk Admin Juga Kali Ini Saya Sudah Tau Cara Mengatasi OpenId "Ups Itu Kesalahan" Itu Di sebabkan Oleh Nya erroyang ditimbulkan oleh openID server yang dimiliki oleh blogger.com Langsung Saja Kita Ikuti Langkah-langkah Cara Memperbaikinya


Berikut cara Memperbaiki OpenID yang error Ups itu kesalahan:
1. Langkah Pertam Sobat blogger masuk openid.stackexchange.com
2. Dan Langkah Kedua Pilih Register  Dan Isi konfirmasi pendaftaran

Cara Mengatasi Error Ups, Itu Kesalahan Pada OpenIDCara Mengatasi Error Ups, Itu Kesalahan Pada OpenID

3. Langkah Ketiga Setelah Sobat Blogger register selesai, Cek di email sobat
4. Langkah Keempat Masuk ke Dasbord blog sobat Blogger, Pilih template > Edit HTML
5. Copy kode berikut di bawah <head> Tau Diatas </head>
 
<link rel='openid2.provider' href='https://openid.stackexchange.com/openid/provider' />
<link rel='openid2.local_id' href='https://openid.stackexchange.com/user/Your ID Number' />
silahkan ganti yang Tulisan Your ID Number Denagn  IDteregistrasi di stackexchange6. Simpan template
  


Cara Mengatasi Error Ups, Itu Kesalahan Pada OpenID
  • Cara Mengatasi Error Ups, Itu Kesalahan Pada OpenID

7. Langkah Ketujuh Selesai dan silahkan coba di komentar
JANGAN CUMA DOWNLAD DOANG TAPI JANGAN LUPA TINGGALKAN KOMENTAR ANDA TUNJUKAN BAHWA ANDA PENGUNJUNG YANG BIJAK TRIMAKSIH SALAM ADMIN Dan Jangan meng-COPAS dan menyerbarluaskan Artikel Kami Jika ingin menduplikasi artikel ini diharapkan anda untuk mencantumkan link. Jika Anda sampai melanggar, Anda berarti telah melanggar UUD 1945 No. 19 Tahun 2002 Tentang Hak Cipta !
Download Template Fastest Magz V3 Terbaru Free

Download Template Fastest Magz V3 Terbaru Free

Download Template Fastest Magz V3 Terbaru Free
Hallo Sobat Blogger ,Ane HIkam Mau Bagi Template Fastest Magz V3 Terbaru Gratis  Lo Sebelum Downlaod  biasakan follow dulu blog Hikam Edition Dan lalu berkomentar Nah Gampangkan Tuk Dapetin Tamplet cara ini adalah suatu cara berterimakasih kepada saya selaku peniru template Fastest Magz V3 ini,


Fastest Magz Blogger Template Fastest Magz
Fitur-Fitur Dari Template Fastest Magz V3 Terbaru Gratis  :

  1.     Elegant Design
  2.     Responsive Design
  3.     Cross Browser Optimization
  4.     Fast Loading
  5.     Valid HTML5
  6.     Rating and Recipe Rich Snippet tidak dipasang lagi
  7.     Facebook Comment
  8.     Custom Error Page
  9.     Quick Search Form sudah dipasang (terbaru)
  10.     Three different colors option (blue, red, and green)
  11.     Smooth Back To Top
  12.     Dan masih banyak lagi

Admin hanya mempunyai modal Template Fastest Magz Versi 2.2 Admin UBah Menjadi Versi 3 Tapi Mirip DAn Sama Piturnya Tamplet Ini Admin bagikan Secara gratis karena Admin tidak membelinya melainkan meniru. Bagi Sobat Blogger yang punya saran/kritik silahkan berkomentar dibawah Ini Gan Di JAmin Aman Gan HEhehe

Download
Click To Download
File Size: 25 KB


Jika Ada Masalah Hubung Admin Via Twitteer  dan Fb

JANGAN CUMA DOWNLAD DOANG TAPI JANGAN LUPA TINGGALKAN KOMENTAR ANDA TUNJUKAN BAHWA ANDA BLOGGER YANG BIJAK TRIMAKSIH SALAM ADMIN 

Pass hikamv3

d
Cara Membuat Tampilan Scrollbar Dengan Efek Persentase pada Blog

Cara Membuat Tampilan Scrollbar Dengan Efek Persentase pada Blog

Haloo Sobat Blogger Admin Mau Bagi Tutorial Cara Membuat Tampilan Scrollbar Dengan Efek Persentase pada Blog Langsung Saja Kita KTP

Langkah Pertama Kita Mulai Sobat


  1. Login ke akun blogger Sobat.
  2. Kemudiat Edit Template
  3. Copy kode dibawah ini. Dan Letakan K CSS ini di atas ]]></b:skin> atau </style>
 #scroll {
display: none;
position: fixed;
top: 0;
right: 20px;
z-index: 500;
padding: 3px 8px;
background-color: #222222;
font-size:13px;
color: #fff;
border-radius: 3px;
}
#scroll:after {
content: " ";
position: absolute;
top: 50%;
right: -8px;
height: 0;
width: 0;
font-size:13px;
margin-top: -4px;
border: 4px solid transparent;
border-left-color: #ccc;
}
4. cari Kode Ini  <body> atau <body
5. Dan Pastekan kode dibawah kode  

 <div id='scroll'></div>
6. Langkah Terakhir Cara Koe Ini  </body> dan Patekan Kode Di Bawah Ini Di Atas Kode  </body> 
<script type='text/javascript'>
//<![CDATA[
var scrollTimer = null;
$(window).scroll(function() {
   var viewportHeight = $(this).height(),
       scrollbarHeight = viewportHeight / $(document).height() * viewportHeight,
       progress = $(this).scrollTop() / ($(document).height() - viewportHeight),
       distance = progress * (viewportHeight - scrollbarHeight) + scrollbarHeight / 2 - $('#scroll').height() / 2;
    $('#scroll')
        .css('top', distance)
        .text(' (' + Math.round(progress * 100) + '%)')
        .fadeIn(100);
    if (scrollTimer !== null) {
        clearTimeout(scrollTimer);
    }
    scrollTimer = setTimeout(function() {
        $('#scroll').fadeOut();
    }, 1500);
});
//]]>
</script>
Jika Sobat Ingin Mengubag Warna Nya CaRi Kode Ini  background-color: #222222; Dan border-left-color: #ccc;
Gampang Kan Sobat Selamat Mencoba Semoga Berhasil Tidak Membuat Blog Berat


JANGAN CUMA Coba  DOANG TAPI JANGAN LUPA TINGGALKAN KOMENTAR ANDA TUNJUKAN BAHWA ANDA BLOGGER YANG BIJAK TRIMAKSIH SALAM ADMIN

Cara Membuat Iklan Baris Seperti Google Adsense

Cara Membuat Iklan Baris Seperti Google Adsense

Assalammualaikum Sobat Blogger Admin Mau Bagi Tutorial Cara Membuat Iklan Baris Seperti Google Adsense Langsung Saja Kita KTP
  1. Login ke akun blogger Sobat.
  2. Kemudiat Edit Template
  3. Copy kode dibawah ini. Dan Letakan K CSS ini di atas ]]></b:skin> atau </style> 
 /* Iklan Google Adsense
----------------------------------------------- */

#Google-Adsense {
  width:304px;
  height:259px;
  background-color:white;
  position:relative;
  overflow:hidden;
  margin:0 auto;
}
#Google-Adsense h2.iklan-header {
  cursor:pointer;
  background-color:white;
  background-image:none;
  font:normal 20px Verdana, Tahoma,Serif;
  color:blue;
  border-top:1px solid #d8d8d8;
  padding:10px;
  margin:0 0;
  position:relative;
  text-transform:none;
  letter-spacing:0;
}
#Google-Adsense h2.iklan-header:first-child {
  border-top:none;
}
#Google-Adsense h2.active {
  display: none;
}
#Google-Adsense h2.iklan-header:before{
  content:"";
  width:0;
  height:0;
  position:absolute;
  top:20px;
  right:15px;
  border:5px solid transparent;
  border-color:#b2b2b2 transparent transparent;
}
#Google-Adsense div {
  height:100px;
  padding:10px 70px 10px 10px;
  font:normal 13px Verdana, Tahoma,Serif;
  color:white;
  border-top:1px solid #d8d8d8;
}
.judul {
  font:normal 20px Verdana, Tahoma,Serif;
  color:blue;
  margin:0 0 5px 0;
}
a.judul{
  font:normal 20px Verdana, Tahoma,Serif !important;
  color:blue !important;
  text-decoration:none;
  display:inline-block;
}
a:hover.judul {
  font:normal 20px Verdana, Tahoma,Serif !important;
  color:blue;
  text-decoration:underline;
}
.isi-iklan a{
  font:normal 13px Verdana, Tahoma,Serif;
  color:green;
  text-decoration:none;
  display:block;
  margin-bottom:10px;
}
.isi-iklan a:hover{
  color:green;
  text-decoration:none;
}
.isi {
  padding-top:15px;
  color:#222;
  text-align:left !important;
}
.panah-besar {
  background: #4d90fe;
  border-radius: 50%;
  cursor: pointer;
  height: 34px;
  float: right;
  margin-right: -60px;
  margin-top: -40px;
  width: 34px;
  text-align: center;
  line-height: 34px;
}
.panah-besar:hover {
  background: #4472bd;
}
.info-icon {
  width:15px;
  height:15px;
  position:absolute;
  top:0;
  right:0;
  cursor:pointer;
}
.info-iklan {
  background:#d3d3d3;
  width:100px;
  height:15px;
  border-bottom-left-radius:4px;
  position:absolute;
  top:0;
  right:0;
  color:#000;
  font:normal 11px Arial,Sans-Serif;
  text-align:left;
  overflow:hidden;
  padding-right:19px;
  padding-left:5px;
  display:none;
}

 4. Simpan kode Di Bawah ini pada Widget HTML / JavaScript

  <div id="Google-Adsense">
    <!-- iklan ke 1-->
    <div data-header="Pasang Iklan di Sini">
        <span class='isi-iklan'><a class='judul' href='http://hikamedition.blogspot.com/p/blog-page_5.html' target='_blank'>Pasang Iklan di Sini</a>
            <a href='http://blog.kangismet.net/2012/12/pasang-iklan-di-blog-kang-ismet.html' target='_blank'>Hikamedition</a>
            <span class='isi'>Pasang iklan Anda di sini, hanya 5 ribu / bulan Promo.
            <a class='panah-besar' href='http://hikamedition.blogspot.com/p/blog-page_5.html' target='_blank'><img style='margin-top:7px;margin-left:2px;width:12px;height:19px' alt='arrow' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0M98m9LZi_5OKQXfwJxfoynv5ohqcTwqzNgsDNGS0hz-xx7YC3H9hE4kF1U2wZaUvMbgnFVb-chM3GGIsC2utSAbcvBWDr6nfDxsn0C_QN79EyCDpLGUHg8dqRf95u6c6A9SZ0KZwo3k/s1600/icon_chevron_white.png'/></a></span>
        </span>
    </div>
<!-- iklan ke 2-->
    <div data-header="Pasang Iklan di Sini">
        <span class='isi-iklan'><a class='judul' href='http://hikamedition.blogspot.com/p/blog-page_5.html' target='_blank'>Pasang Iklan di Sini</a>
            <a href='http://blog.kangismet.net/2012/12/pasang-iklan-di-blog-kang-ismet.html' target='_blank'>Hikamedition</a>
            <span class='isi'>Pasang iklan Anda di sini, hanya 5 ribu / bulan Promo.
            <a class='panah-besar' href='http://hikamedition.blogspot.com/p/blog-page_5.html' target='_blank'><img style='margin-top:7px;margin-left:2px;width:12px;height:19px' alt='arrow' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0M98m9LZi_5OKQXfwJxfoynv5ohqcTwqzNgsDNGS0hz-xx7YC3H9hE4kF1U2wZaUvMbgnFVb-chM3GGIsC2utSAbcvBWDr6nfDxsn0C_QN79EyCDpLGUHg8dqRf95u6c6A9SZ0KZwo3k/s1600/icon_chevron_white.png'/></a></span>
        </span>
    </div>
<!-- iklan ke 2-->
    <div data-header="Pasang Iklan di Sini">
        <span class='isi-iklan'><a class='judul' href='http://hikamedition.blogspot.com/p/blog-page_5.html' target='_blank'>Pasang Iklan di Sini</a>
            <a href='http://blog.kangismet.net/2012/12/pasang-iklan-di-blog-kang-ismet.html' target='_blank'>Hikamedition</a>
            <span class='isi'>Pasang iklan Anda di sini, hanya 5 ribu / bulan Promo.
            <a class='panah-besar' href='http://hikamedition.blogspot.com/p/blog-page_5.html' target='_blank'><img style='margin-top:7px;margin-left:2px;width:12px;height:19px' alt='arrow' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0M98m9LZi_5OKQXfwJxfoynv5ohqcTwqzNgsDNGS0hz-xx7YC3H9hE4kF1U2wZaUvMbgnFVb-chM3GGIsC2utSAbcvBWDr6nfDxsn0C_QN79EyCDpLGUHg8dqRf95u6c6A9SZ0KZwo3k/s1600/icon_chevron_white.png'/></a></span>
        </span>
    </div>
<!-- iklan ke 2-->
    <div data-header="Pasang Iklan di Sini">
        <span class='isi-iklan'><a class='judul' href='http://hikamedition.blogspot.com/p/blog-page_5.html' target='_blank'>Pasang Iklan di Sini</a>
            <a href='http://blog.kangismet.net/2012/12/pasang-iklan-di-blog-kang-ismet.html' target='_blank'>Hikamedition</a>
            <span class='isi'>Pasang iklan Anda di sini, hanya 5 ribu / bulan Promo.
            <a class='panah-besar' href='http://hikamedition.blogspot.com/p/blog-page_5.html' target='_blank'><img style='margin-top:7px;margin-left:2px;width:12px;height:19px' alt='arrow' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0M98m9LZi_5OKQXfwJxfoynv5ohqcTwqzNgsDNGS0hz-xx7YC3H9hE4kF1U2wZaUvMbgnFVb-chM3GGIsC2utSAbcvBWDr6nfDxsn0C_QN79EyCDpLGUHg8dqRf95u6c6A9SZ0KZwo3k/s1600/icon_chevron_white.png'/></a></span>
        </span>
    </div>
    <!-- info -->
    <span class='info-iklan'>Iklan oleh Hikam</span>
    <span class='info-icon'><a href='http://hikamedition.blogspot.com/p/blog-page_5.html' target='_blank'><img alt='info' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIbsAB-SWcWIWrrj9r_5-7HofDhR0OdD0ho7mRja59_KcQ0ctP_QJba2toMc8wrckvyh-cpzWuKz2NUq0YErGuCgPrTcRKg5nuRE1UF61fWmkZOSI7JLVfdIQlWkkKjJ0FZ3LUziDyJcI/s1600/info-iklan.png'/></a></span>    
</div>

 5. Silahkan Sobat Blogger Edit Judul Dan Lnk Sobat 
6. Jika Sobat Blogger ingin membuat Iklan Baris Seperti Google Adsense tersebut bisa melayang disisi kanan blog Sobat  maka gunakan kode dibawah ini:


  <style type="text/css">
#melayang{
position:fixed;
top:10px;
z-index:+1000;
}
html #melayang{position:relative;}
.melayangcontent{
float:right;
border:2px solid #52e052;
background:#ffffff;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var melayang = document.getElementById("melayang");
var w = melayang.offsetWidth;
melayang.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
melayang.opened = !melayang.opened;
}
function moveGB(x0, xf){
var melayang = document.getElementById("melayang");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
melayang.style.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>
<div id="melayang">
<div class="melayangtab" onclick="showHideGB()"> </div>
<div class="melayangcontent">
<div style="text-align:right">
<a href="javascript:showHideGB()">
.:[Close][Klik 2x]:.
</a>
</div> PASTE KODE YANG TADI TARUH DISINI
<script type="text/javascript">
var melayang = document.getElementById("melayang");
melayang.style.center = (30-melayang.offsetWidth).toString() + "px";
</script></center></div></div>
Dan Langkah Terakhir 
7.  Simpan kode Di Bawah ini di atas </head> 
<script src='https://googledrive.com/host/0B7Z2PdtIRXAaRjVuY1ktQjdmejg' type='text/javascript'/>


JANGAN CUMA MERAKTEKIN DOANG TAPI JANGAN LUPA TINGGALKAN KOMENTAR ANDA TUNJUKAN BAHWA ANDA BLOGGER YANG BIJAK TRIMAKSIH SALAM ADMIN
Cara Membuat Warning Messeges Melayang Di Blog

Cara Membuat Warning Messeges Melayang Di Blog

Hallo Sobat Blogger Admin  Mau Bagi Tutorial  Cara Membuat Warning Messeges Melayang Di Blog LangSung Ke TKP Saja Yu


Nie Contohnya Dan Demonya





  1. Masuk ke Template.
  2. Edit HTML
  3. Copy semua Kode Yang Ada Di Bawah 
  4. Letakan Kode Yang Tadi Anda Copy tepat di atas kode ]]></b:skin>
 #Messeges {
right: 10px; /* posisi di paling kanan */
top: 10px; /* posisi di paling atas */
width: 320px; /* lebar notif */
height: auto; /* tinggi notif otomatis */
overflow: hidden;
background: rgba(255,255,255,0.9); /* warna background */
border-radius: 5px; /* nilai sudut bundar */
border: 1px solid #ddd; /* garis batas luar */
z-index: 999999;
position: fixed; /* posisi melayang */
-webkit-animation: fadeOutnotif 10s linear forwards; /* notif 10 detik */
-moz-animation: fadeOutnotif 10s linear forwards;
-o-animation: fadeOutnotif 10s linear forwards;
-ms-animation: fadeOutnotif 10s linear forwards;
animation: fadeOutnotif 10s linear forwards;
}
#Messeges a {
display:block;
text-decoration:none;}
#notifjo span {
display: block;
padding: 15px 15px;
pointer-events: none;
text-align: left;
float: left;
}
#Messeges span h2 {
font-size: 12px; /* Ukuran text */
line-height: 21px;
color: #222; /* Warna text */
font-weight: normal;
letter-spacing: 0px;
}
@-webkit-keyframes fadeOutnotif {
0% { opacity: 1;}
10% { opacity: 1;}
90% { opacity: 1; -webkit-transform: translateY(0px);}
99% { opacity: 0; -webkit-transform: translateY(-30px);}
100% { opacity: 0;}
}
@-moz-keyframes fadeOutnotif {
0% { opacity: 1;}
10% { opacity: 1;}
90% { opacity: 1; -moz-transform: translateY(0px);}
99% { opacity: 0; -moz-transform: translateY(-30px);}
100% { opacity: 0;}
}
@-o-keyframes fadeOutnotif {
0% { opacity: 1;}
10% { opacity: 1;}
90% { opacity: 1; -moz-transform: translateY(0px);}
99% { opacity: 0; -moz-transform: translateY(-30px);}
100% { opacity: 0;}
}
@-ms-keyframes fadeOutnotif {
0% { opacity: 1;}
10% { opacity: 1;}
90% { opacity: 1; -moz-transform: translateY(0px);}
99% { opacity: 0; -moz-transform: translateY(-30px);}
100% { opacity: 0;}
}
@keyframes fadeOutnotif {
0% { opacity: 1;}
10% { opacity: 1;}
90% { opacity: 1; -moz-transform: translateY(0px);}
99% { opacity: 0; -moz-transform: translateY(-30px);}
100% { opacity: 0;}
}

    5. Simpan.

 <div id='Messeges'>
<span>
<h2><b>Notifikasi :</b>
<p>|| Selamat datang ||</p>
<p>Bersikaplah dengan sopan seperti halnya bertamu dengan cara mematuhi aturan disini.</p>
<p>terima kasih sudah berkunjung.. ^_^ Dan Jangan Lupa Tinggalkan Komentar</p>
</h2>
</span>
</div>
  1. Nah Kode Selanjut Ya 
  2. Copy kode Diatas ini tepat dibawah kode </body>
  3. Selesai Dehhh...........
  4. Simpan
Keterangan :

     Kata-katanya bisa anda ubah sesuai keinginan Sobat Blogger

Sekian Dulu Artikel Hari Ini Dan Jangan Lupa Tingglkan Komentra Anda Di Sini Agar Tidak Eror Terimakasih 
Cara Membuat Iklan Baris Seperti PPC Di Blog

Cara Membuat Iklan Baris Seperti PPC Di Blog

               Hallo Sobat Blogger Saya Mau Bagi Tutorial  Cara Membuat Iklan Baris Seperti PPC Di Blog Semua sudah Sudah Pada Tahu Apa Itu iklan baris PPC ?Kalo Udah Sudah Tau  Alhamdulillah Yang Blum Tau Simak Sedikit .
         pengertiannya  Cekidot Pay Per Click atau biasa di singkat PPC adalah model periklanan internet yang digunakan pada situs dimana pengiklan membayar pemilik situs hanya ketika iklan mereka di klik dan Pemilik blog akan dibayar  gimana Udah ngeri blum  Langsung Aja Kita Buat   Cara Membuat Iklan Baris Seperti PPC Di Blog Gampang Ko Tutorial Y....... 

 Ni Dia Contohnya


 1. Copy semua Kode Yang Ada Di Bawah
    Cari ]]></b:skin> Paste tepat diatas kode ]]></b:skin>

    
#ads_ppc {text-align: left; width:300; height:250; padding:5px; margin:0px;border:1px solid  #1a4d86}
Nah Untuk yang kode berwarna merah, Boleh Anda  ganti dan sesuaikan dengan kolom sidebar atau footer di blog sobat Dan Sesuka Anda

2. Setelah itu, Copy Semua Kode bawah ini lalu Tepatkan Kode Yang Di Bwah ditempat yang sobat    Blogger inginkan entah itu Sidebar ataupun Footer dan Yang Lain



<div id='ads_ppc'>
<a style="text-decoration: underline; padding: 15; font-size: 12px; color:blue;" href="URL IKLAN" target="_blank"><strong>JUDUL IKLAN</strong></a>
<br /><span style="font:11px verdana;">DESKRIPSI IKLAN</span>
<br /><a style="font-size: 9px;color:#b0130d;" href="url iklan" target="_blank">url iklan</a><br/>
<a style="text-decoration: underline; padding: 15; font-size: 12px; color:blue;" href="URL IKLAN" target="_blank"><strong>JUDUL IKLAN</strong></a>
<br /><span style="font:11px verdana;">DESKRIPSI IKLAN</span>
<br /><a style="font-size: 9px;color:#b0130d;" href="url iklan" target="_blank">url iklan</a><br/>
<a style="text-decoration: underline; padding: 15; font-size: 12px; color:blue;" href="URL IKLAN" target="_blank"><strong>JUDUL IKLAN</strong></a>
<br /><span style="font:11px verdana;">DESKRIPSI IKLAN</span>
<br /><a style="font-size: 9px;color:#b0130d;" href="url iklan" target="_blank">url iklan</a><br/>
<a style="text-decoration: none; padding: 15; font-size: 12px; float: right;color:#b0130d;" href="URL HALAMAN PASANG IKLAN" target="_blank"><small>Ads by "WEBSITE SOBAT"

  1. Ganti kode Yang Berwarna  Putih Dengan URL IKLAN Anda. 
  2. Ganti kode Yang Berwarna  Putihh dengan JUDUL IKLAN. 
  3. Ganti kode Yang Berwarna  Putih dengan DESKRIPSI IKLAN. 
  4. Ganti kode Yang Berwarna  Putih dengan URL HALAMAN PASANG IKLAN yang sobat punya. 
  5. Ganti kode Yang Berwarna  Putih  dengan Ads by "WEBSITE SOBAT" atau tulisan apa pun yang sobat inginkan. Masih banyak kode tampilan lain yang dapat sobat ubah.
 Sekian Dulu Artikel Hari Ini Dan Jangan Lupa Tingglkan Komentra Anda Di Sini Agar Tidak Eror Terimakasih 
Cara membuat artikel terkait berdampingan Dengan Benner

Cara membuat artikel terkait berdampingan Dengan Benner

Hallo Sobat Blogger Saya Mau Bagi Tutorial Cara membuat artikel terkait berdampingan Denagn Benner Mantap Gan Ayu Praktekin Gan


  1.  Masuk Ke Akun Blogger Anda 
  2. Klik "Template" -> "Edit HTML" -> centang "Expand Template Widget"
  3. Cari Kode ]]></b:skin> Dengan Menekan CTRL + F 
  4. Selanjunnya Kita Ngopi Dulu Bukan Tapi Cari Kode Ini ]]></b:skin
  5. Letakan Kode Di Bawah Ini Di Atas Kode Ini ]]></b:skin> 

#hikam{float:left;width:275px;border-right:1px solid #ffaaff;margin:5px 0 0;padding:0 15px 0 0}
#hikam .widget{margin:0;padding:0}
#hikam .widget h2,#related-posts h2{font:bold 13px Droid Serif;color:#000;text-transform:none;margin:0 0 5px;padding:0}
#hikam {color:#333;font:12px Droid Serif}
#hikam:hover{color:#f9ab39}
#hikam li{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5dw3AcG8it7eKcy_Pb-1dPbvBY_odEBURKT2ThRn5LPKgL24XwYBbSYEOZWdot-x77iSimkHKvZtHNc-aRbgzveuQkMw8BNop0VKDtaNGoPfXbh3Ov8SdcaDvEhdJzBUWhQs7xR0rFBk/s1600/bullet-list.gif) no-repeat 0 8px;text-indent:0;line-height:1.2em;margin:0;padding:2px 0 2px 10px}
#banner-ads{float:right;width:300px;margin:5px 0}

Pesan
float:left;width:275px : Posisi related post ada di Sebelah kiri dengan lebar 275px
float:right;width:300px : Posisi banner-ads ada di sebelah kanan dengan lebar 300px

Jika  Posisi related Berada Di Kiri Post ingin Di Pindahkan Di Kanan Juga Bisa Ganti Kode Ini float:left;width:275px Denagn Kode  float:right;width:300px;margin:5px 0 Gampangkan

Jika  Posisi Benner Ads  Berada Dikanan Anda Ingin Pindahkan  Di Kiri Juga Bisa Ganti Kode Ini float:left;width:275px Denagn Kode  float:right;width:300px;margin:5px 0 Gampangkan
6. Masih di bagian "Edit HTML"kemudian anda  cari kode Ini <data:post.body/>  apabila kode<data:post.body/> terdapat 3 atau 4, maka Anda taruh kode Ini <data:post.body/> di bawah kode no 3. apabila kode <data:post.body/>, Jika terdapat hanya 2 maka Anda taruh kode berikut dibawah no.2 Gampangkan 

 Letakan Kode Di Bawah Ini Di Bawah Kode Ini <data:post.body/> Gampangkan
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<H3>Artikel Terkait :</H3>
<div id='banner-ads'>
MASUKKAN SCRIPT HTML/JAVASCRIPT KAMU DISINI..!!!
</div>
<div class='hikam'>
<div style='margin:0; padding:10px;height:250px;overflow:auto;border:0px solid #ccc;'>
<div id='albri'/>
<script type='text/javascript'>
var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 10 ;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 10;
maxNumberOfLabels = 3;
function listEntries10(json) {
var ul = document.createElement(&#39;ul&#39;);
var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i &lt; maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k &lt; entry.link.length; k++) {
if (entry.link[k].rel == &#39;alternate&#39;) {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement(&#39;li&#39;);
var a = document.createElement(&#39;a&#39;);
a.href = alturl;
if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l &lt; json.feed.link.length; l++) {
if (json.feed.link[l].rel == &#39;alternate&#39;) {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);
var txt = document.createTextNode(label);
var h = document.createElement(&#39;b&#39;);
h.appendChild(txt);
var div1 = document.createElement(&#39;div&#39;);
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById(&#39;albri&#39;).appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement(&#39;script&#39;);
script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;
+ label +
&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
document.documentElement.firstChild.appendChild(script);
}
var labelArray = new Array();
var numLabel = 0;
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = &quot;<data:label.name/>&quot;;
var test = 0;
for (var i = 0; i &lt; labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel &lt; maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
<script type='text/javascript'>RelPost();</script>
</div>
</div>
</b:if>



7. Langkah Terakhir tinggal Klik "Pratinjau"  Atau Langsung Simpan Gampangkan Tutorial Ya

Sekian Dulu Artikel Hari Ini Dan Jangan Lupa Tingglkan Komentra Anda Di Sini Agar Tidak Eror Terimakasih 



Template Portal Vcard Modern

Template Portal Vcard Modern

Admin Mau Bagi-Bagi Template Portal Vcard Modern  Loo Kalo Udah Downlaod Template Nya Jangan Lupa Komentarnya Agar Templat Nya tidak Rusak Terikama Kasih Sudah Berkunjung Satu Syarat lagi Sebelum Downlaod Follow Blog Admin YA




NB: Cara pasangnya disini gan< Kembali ke template klasik>
Liat di paling bawah edit template. 


Cara Pasang Template

 1. Klik Templet Teruskan Banyak Pilihan Templatenya cari Tulisan Kembali ke template klasik 
2. Klik Kembali ke template klasik Setelah Di Klik Copy Semua Kode Templateya 
3. Klik Simpan Deh Selesai
Pass Hikamedition
Janagan Lupa Tinggalkan Komentar Anda Agar Template Ini Tidak Eror Dan Jangan Lupa Follow Blog Admin  



Template Fastest Magz Versi 2.2 Terbaru Gratis

Template Fastest Magz Versi 2.2 Terbaru Gratis

 Admin Mau Bagi-Bagi Template Fastest Magz Versi Terbaru Gratis  Loo Kalo Udah Downlaod Template Nya Jangan Lupa Komentarnya Agar Templat Nya tidak Rusak Terikama Kasih Sudah Berkunjung Satu Syarat lagi Sebelum Downlaod Follow Blog Admin YA



 Beberapa fitur dan kelebihan template ini:

  1.     SEO Ready
  2.     Responsive Design
  3.     HTML5 Valid
  4.     Cross-browser Optimization (IE8+, Opera, Firefox, Chrome, Safari)
  5.     Fast Loading
  6.     Rating and Recipe Rich Snippet
  7.     Banner Ads (728x90 and 160x600)
  8.     Facebook Comment
  9.     Custom 404 Page
  10.     Quick Search
  11.     Three different colors (blue, red, and green)
  12.     Dan masih banyak lagi yang lainnya
Fast Loading
Recipe Rich Snippet
Valid HTML5


 Informasi :
Nama Template : Fastest Magz Versi Terbaru Mas Sugeng Gratis
Designer : Mas Sugeng
Versi : 2.2
Tanggal Rilis : 27 September 2013
Lisensi : Free Premium

 

DOWNLAOD



Jangan Lupa Tinggalkan Komentar  Agar Templatenya Tidak Eror

Warning 
Jika Ada Masalah Hubung Admin Di FB 
         Jika Ingin Pasword  Jangan Lupa Tinggalkan Komentar dan Follow Blog Ane

Daftar Games Pc Terbaik di Dunia

Daftar Games Pc Terbaik di Dunia

Hallo sobat Blogger Kali ini Saya akan Memposting tentang Daftar Games Pc Terbaik di Dunia Silah kan Simak Baik-Baik

Game-game terbaik di dunia pada tahun 2013 ini sangat keren mulai dari graphic hingga gameplay.Sehingga kita tidak merasa bosan saat memainkannya , Game-game ini dimainkan harus dengan Spek Kompi yang tinggi , jika rendah maka gamenya akan patah-patah dan tidak seimbang.


Inilah Daftar Game PC Terbaik di Dunia
1. CRYSIS 3
Yang masuk kategori pertama dan terbaik ini adalah game yang sangat seru untuk anda mainkan. Tetapi game ini memiliki kriteria spesifikasi PC yang lumayan tinggi karena game ini memakai efek-efek khusus yang tentunya memakai program aplikasi yang tidak sedikit. Pada game ini kita bertindak sebagai seorang pahlawan pembela kebenaran yaitu menjadi seorang pemburu di kota New York yang kondisinya udah hancur lebur. Misinya yaitu untuk membangkitkan peradaban manusia di muka bumi ini.

 2. PRO EVOLUTION SOCCER 2013
crysis-3
Game PC terbaik ini memang tak aneh jika menempati posisi ke dua di Dunia, Karena hampir semua orang di dunia suka sekali dengan yang namanya sepak bola termasuk saya. Versi 2013 ini memang sudah mengalami evolution dari versi 2012 yang tentunya lebih baik. Perbedaannya sangat mencolok, mulai dari segi Display sampai sound nya juga jauh lebih baik.
pes-2013

3. CALL OF DUTY - Black OPS 2

call_of_duty_black_ops_2
Game ini memang bukan dirilis di pasaran dan belum banyak orang yang mengenal versiyang satu ini. Denger denger si udah gak lama lagi game ini akan diluncurkan, Kita doakan saja moga-moga game ini diluncurkan dalam waktu dekat ini, kita tunggu aja gan.
call_of_duty_black_ops_2
4. MASS EFFECT 3

mass-effect-643
Tampaknya semua para gamer di dunia harus sedikit bersabar untuk menanti game yang satu ini, karena entah kapan game ini akan diluncurkan oleh Bioware Tapi yang jelas walaupun belum dirilis game ini mulai menyebar dari telinga ke telinga. Jadi sekarang ini kita harus bersabar dulu gan.
mass-effect-643
5. PROTOTYPE 2

prototype
Untuk game yang duduk de peringkat 5 ini pasti sudah tidak asing lagi di telinga para gamer dunia, kali ini ada versi terbaru yakni PROTOTYPE 2 yang tenrunya membangkitkan jiwa seorang gamer dan membutuhkan kesabaran tingkat game profesional. Game ini tentu tidak kalah menarik dengan game action lainnya, game ini lebih brutal dan seru. prototype
6. ARMORED CORE 5

armored+core+5
Armored Core 5, yah itulah sebutan untuk game action yang menarik ini, sama dengan game seru lainnya. Game ini juga memerlukan Spesifikasi yang tidak sedikit tentunya. Tapi semua itu terbayar lunas dengan keseruan yang ditawarkan kepada para gamer.
armored+core+5

7. RESIDENT EVIL 6

Resident-Evil-6
Siapa si yang gak kenal sama Game yang satu ini. Meskipun agak ngeri ketika dimainkan tetapi itu semua dapat membangkitkan imajinasi dan khayalan otak kiri kita untuk menyelesaikan game tersebut. Disini anda bertindak sebagai orang yang menyelamatkan kekasih anda dari tangan para Zombie. Resident-Evil-6
8. GOD OF  WAR 4 ASCENSION

god+of+war+4+ascensionn
Balas dendam, kekejaman, pembunuhan, penyiksaan dan kematian hampir tidak ada *kejahatan* yang tidak dilakukan oleh tokoh utamanya (KRATOS). Selamat berjuang yah KRATOS.
god+of+war+4+ascensionn
9. THE ELDER SCROLLS V SKYRIM

skyrim
Pernahkah anda bermain video game sampai melupakan makan, mandi, belajar dan semuanya. Hal ini pasti sering terjadi bagi Gamer yang benar benar sudah tidak bisa hidup tanpa game. Jika anda mengaku seorang gamer tetapi anda tidak pernah mendengar kata THE ELDER SCOLLS berarti anda bukan seorang gamer sejati.
skyrim

10. MEDAL OF HONOR WAR FIGHTER
Setelah semua daftar game terbaik pc terbaca anda akan merasa heran, mengapa game sebagus MEDAL OF HONOR hanya bisa menduduki peringkat 10 dunia. Menurut saya pribadi game ini juga pantas jadi yang pertama diantara yang pertama. karena game ini sangat membutuhkan kemampuan khusus untuk dapat menyelesaikan semua misinya. Game 2013 ini juga merupakan Game yang sering saya mainkan dan memang seru banget.


Terikamasi Sobat Blogger Sudah Berkunjung Di Blog saya Semoga Artikel Yang Saya Share Bermanfaat Bagi Sobat Blogger Thank Jangfan Lupa Berkomentar Ya