Tampilkan postingan dengan label Tips Blogger. Tampilkan semua postingan
Tampilkan postingan dengan label Tips Blogger. Tampilkan semua postingan

Senin, 07 Juli 2014

Cara Membuat Slider di Blogger

CSS Anda

/* Slide Content */
.slide-wrapper
{
padding:0 auto;
margin:0 auto;
width:auto;
float: left;
word-wrap: break-word;
overflow: hidden
}
.slide
{
color: #666666;
line-height: 1.3em
}
.slide ul
{
list-style:none;
margin:0 0 0;
padding:0 0 0
}
.slide li
{
margin:0;
padding-top:0;
padding-right:0;
padding-bottom:.25em;
padding-left:0px;
text-indent:0px;
line-height:1.3em
}
.slide .widget
{
margin:0px 0px 6px 0px
}


Masukan ke widget anda

<style type="text/css">
.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }
.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }
.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }
.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="http://responsiveslides.com/responsiveslides.min.js"></script>
<ul class="rslides">
  <li><img src="http://responsiveslides.com/1.jpg" alt="" /></li>
  <li><img src="http://responsiveslides.com/2.jpg" alt="" /></li>
  <li><img src="http://responsiveslides.com/3.jpg" alt="" /></li>
</ul>
<script>
  $(function() {
    $(".rslides").responsiveSlides();
  });
</script>


0 Read More →

Jumat, 04 Juli 2014

Cara Membuat Menu Header Blog Tetap Muncul Saat Halaman Discroll

Sebelum
Kali ini saya Een Pahlefi, akan membagikan tutorial cara membuat menu header blog tetap muncul saat halaman di scrool.













Sesudah
















Langsung saja, copy paste java script nya.
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
    var stickyNavTop = $('.header-wrapper').offset().top;
    var stickyNav = function(){
        var scrollTop = $(window).scrollTop();
        if (scrollTop > stickyNavTop) {
            $('.header-wrapper').css({ 'position': 'fixed', 'top':0, 'z-index':9999 });
        } else {
            $('.header-wrapper').css({ 'position': 'relative' });
        }
    };
    stickyNav();
    $(window).scroll(function() {
        stickyNav();
    });
});
//]]>
</script>

Keterangan : Yang berwarna merah sesuaikan dengan css header anda :)
Penulis : Een Pahlefi
Semoga Bermanfaat
0 Read More →

Minggu, 29 Juni 2014

Cara Mendapatkan Google Site Verifikasi untuk Blogger

Bertemu lagi dengan saya Een Pahlefi, Kali ini saya mau membagikan tuturial sederhana, cara mendapatkan google site verifikasi, untuk di implementasikan di blogger. Langsung saja baca dan pahami di bawah ini.
Google Site Verification berfungsi memberitahukan kepada Google bahwa website atau blogs tersebut benar - benar milik anda dan ada beberapa cara untuk memverifikasinya diantaranya menggunakan Meta Tags yang disimpan pada Template Website.
1. Anda harus login ke Halaman Web Master
2. Anda tambahkan situs seperti berikut.






3.Isikan nama website anda. contoh nya : www.namawebsiteanda.com









4.Dan anda akan masuk ke halaman berikut : "anda jangan khawatir, pesan error diatas, saja saja belum terverifikasi.









5.Masih di halaman yang sama, anda pilih Metode Alternative, dan Klik pada Tag HTML











6.Dan anda akan di berikan kode google-site-verification











7. Catat kode tersebut, dan buka template blogger anda. Ingat, jangan ditutup halaman yang anda buka sekarang.
Tuliskan tepat di bawah <head>
<meta content='WcHBKd3W84Sa5bJM2A8dFEee-4zAcW36QfGXCDGnDFg' name='google-site-verification'/>












8. Dan terakhir, anda kembali lagi ke halaman webmaster, dan klik verifikasi











Penulis : Een Pahlefi
Semoga Bermanfaat

, 0 Read More →

Senin, 23 Juni 2014

Cara Memasang Java Scripts JS Boostrap di Blogger

Bertemu lagi dengan saya Een Pahlefi. Kali ini saya ingin membagikan tutorial, yaitu menaruh scripts JS boostrap ke blooger. Supaya kita mudah menggunakan framework yang disediakan oleh boostrap.

Letakan scripts diatas </body>







<script src='https://googledrive.com/host/0B6CRDwZSREh6UDlXYUpHT2FhMW8' type='text/javascript'/>
<script src='https://googledrive.com/host/0B6CRDwZSREh6d19yU2lMOXFHU0k' type='text/javascript'/>
<script src='https://googledrive.com/host/0B6CRDwZSREh6VHZuYjBoMzZCc0U' type='text/javascript'/>
<script src='https://googledrive.com/host/0B6CRDwZSREh6MEthTl9SSk05eTA' type='text/javascript'/>
<script src='https://googledrive.com/host/0B6CRDwZSREh6ZExQS0U1U3p0dzQ' type='text/javascript'/>


<script src='https://googledrive.com/host/0B6CRDwZSREh6TWxuZWNRRUZQYW8' type='text/javascript'/>
<script src='https://googledrive.com/host/0B6CRDwZSREh6bWd1a0VhY3pmT00' type='text/javascript'/>
<script src='https://googledrive.com/host/0B6CRDwZSREh6TVJBOHZ3MDl1MVU' type='text/javascript'/>
<script src='https://googledrive.com/host/0B6CRDwZSREh6SDZpYV9QTWlnRHc' type='text/javascript'/>
<script src='https://googledrive.com/host/0B6CRDwZSREh6SkFYZXprZXR0V1E' type='text/javascript'/>

<script src='https://googledrive.com/host/0B6CRDwZSREh6N0pVWmpuWjEyMmc' type='text/javascript'/>
<script src='https://googledrive.com/host/0B6CRDwZSREh6ZG54SF8wZ1M1R3c' type='text/javascript'/>
<script src='https://googledrive.com/host/0B6CRDwZSREh6Mm9JNlJ3Y25tZVE' type='text/javascript'/>
<script src='https://googledrive.com/host/0B6CRDwZSREh6LVNyN3ZBYTdJNlk' type='text/javascript'/>
<script src='https://googledrive.com/host/0B6CRDwZSREh6RTVIZkQ5cElNbUU' type='text/javascript'/>
<script src='https://googledrive.com/host/0B6CRDwZSREh6RmNmN0YzeGZfbmM' type='text/javascript'/>

Keterangan : Boostrap 2.3.2













Penulis : Een Pahlefi
Semoga Bermanfaat
, 0 Read More →

Cara Membuat Random Post dengan Slider

Bertemu lagi dengan saya Een Pahlefi. Kali ini saya akan membagikan tutorial cara membuat widget auto posting dengan slider mini..
Langsung saja copy skrip berikut diwidget anda.

<link rel="stylesheet" type="text/css" href="http://blogger-json-experiment.googlecode.com/svn/resources/blogger-feed-rotator-plugin/default-style.min.css"/>
<div id="slider-rotator" class="slider-rotator loading"></div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="http://blogger-json-experiment.googlecode.com/svn/resources/blogger-feed-rotator-plugin/blogger-feed-rotator.min.js"></script>
<script type="text/javascript">
makeSlider({
    url: "http://eenpahlefi-bjm.blogspot.com" // Add your blog URL
});
</script>
2 Read More →

Sabtu, 21 Juni 2014

Cara Menampilkan Widget Hanya di Home Page Saja

Bertemu lagi dengan saya Een Pahlefi. Kali saya dihadapkan suatu kasus, yang mana saya menginginkan menampilkan widget hanya di halaman home page saja. Supaya halaman isi posting tidak terlalu berat lantaran kebanyakan widget yang ada di halaman depan.

<b:includable id='main'>
      <b:if cond='data:blog.url == data:blog.homepageUrl'>
    <b:if cond='data:title != &quot;&quot;'>
      <h2><data:title/></h2>
    </b:if>
    <div class='widget-content'>
      <b:if cond='data:link != &quot;&quot;'>
        <a expr:href='data:link'>
          <img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_img&quot;' expr:src='data:sourceUrl' expr:width='data:width'/>
        </a>
      <b:else/>
        <img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_img&quot;' expr:src='data:sourceUrl' expr:width='data:width'/>
      </b:if>
      <br/>
      <b:if cond='data:caption != &quot;&quot;'>
        <span class='caption'><data:caption/></span>
      </b:if>













Penulis : Een Pahlefi
Semoga Bermanfaat
, 0 Read More →

Senin, 12 Mei 2014

Tutorial Mengatasi Komentar Blog Yang Tidak Muncul

Bertemu lagi dengan saya Een Pahlefi. Pada suatu ketika ngoprek - ngoprek template blogger, setelah saya restore ke template saya yang lama, tiba - tiba komentar blog saya gk muncul, pas nyari - nyari ketemu solusi nya, cuma hilangkan centang di pengaturan Google +.





Semoga Bermanfaat
Penulis : Een Pahlefi
0 Read More →

Minggu, 30 Juni 2013

Membuat Kotak Komentar Facebook dan Blogger











Cara Membuat Komentar Facebook dan Blogger
1. Login ke akun blogger.com
2. Pilih Template kemudian Edit HTML
3. Tekan Ctrl F dan cari kode ]]></b:skin>
4. Taruh kode berikut di atas ]]></b:skin>

.comments-page { background-color: #f2f2f2;}#blogger-comments-page { padding: 0px 5px; display: none;}.comments-tab { float: left; padding: 5px; margin-right: 3px;cursor: pointer; background-color: #f2f2f2;}.comments-tab-icon { height: 14px; width: auto; margin-right: 3px;}.comments-tab:hover { background-color: #eeeeee;}.inactive-select-tab { background-color: #d1d1d1;}

5. Kemudian cari kode </head>
6. Taruh kode berikut di atas kode di atas kode </head>

<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<script src='http://code.jquery.com/jquery-latest.js'/>
<meta content='IDfacebook' property='fb:admins'/>
<script type='text/javascript'>
function commentToggle(selectTab) {
$(".comments-tab").addClass("inactive-select-tab");
$(selectTab).removeClass("inactive-select-tab");
$(".comments-page").hide();
$(selectTab + "-page").show();}
</script>

7. Ganti IDfacebook dengan ID sendiri (facebook.com/IDfacebook)
8. Kemudian cari kode <div class='comments' id='comments'>
9. Kamu akan menemukan 2 kode yang sama. Letakkan kode di bawah ini tepat di bawah 2 kode tersebut

 <div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle(&quot;#fb-comments&quot;);' title='Comments made with Facebook'><img class='comments-tab-icon' src='http://static.ak.fbcdn.net/rsrc.php/v1/yH/r/eIpbnVKI9lR.png'/><fb:comments-count expr:href='data:post.url'/> Comments</div><div class='comments-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle(&quot;#blogger-comments&quot;);' title='Comments from Blogger'><img class='comments-tab-icon' src='http://www.blogger.com/img/icon_logo32.gif'/> <data:post.numComments/> Comments</div><div class='clear'/></div><div class='comments-page' id='fb-comments-page'><b:if cond='data:blog.pageType == &quot;item&quot;'><div id='fb-root'/><fb:comments expr:href='data:post.url' num_posts='5' width='450'/></b:if></div><div class='comments comments-page' id='blogger-comments-page'>

10. 5 adalah banyaknya komentar yang ditampilkan dan 450 adalah lebar kotak komentar facebook.
11. Simpan Template jika sudah selesai.
0 Read More →

Rabu, 26 Juni 2013

Tutorial Menambah Widget Yahoo di Blog

Kode
<a href="ymsgr:sendIM?eenpahlefi"><img src="http://opi.yahoo.com/online?u=eenpahlefi&amp;m=g&amp;t=22" border="0" alt="my YM"/></a>

Keterangan
a. Merah ganti dengan id yahoo anda
b. Hijau adalah jenis icon gambar yahoo nya.. coba anda ganti dari 0-20 lalu simpan dan refresh web anda, pilih dengan selera anda
0 Read More →

Bank Saya

Pembayaran melalui Bank berikut :

Norek : 013 1 001384 5
An. Een Pahlefi

Norek BRI Rencana : 0623 01 000074-55-6
An. Een Pahlefi

Norek : 0623 01 015938 50 9
An. Een Pahlefi

Norek : 0623 01 015938 50 9
An. Een Pahlefi

Norek : 0623 01 015938 50 9
An. Een Pahlefi

Norek : 0623 01 015938 50 9
An. Een Pahlefi

Monitoring

Status Panel Admin
Jam Sekarang
Tanggal
Salam Sapa :
Status Admin :
User : User Online

Popular Posts