rss

Daftar isi Blog

FREE DOMAINS NAME

About Me

Tampilkan postingan dengan label tutorial blog. Tampilkan semua postingan
Tampilkan postingan dengan label tutorial blog. Tampilkan semua postingan

26 Januari 2011

Mengedit Menu pada Template Facebook style


Sahabat sunankasih, menanyakan bagaimana membuat sub menu? Ok, terima kasih sudah menengok blog saya. Akan saya coba jelaskan.
Pada template facebook style v.2.2 dan facebook style v.2.3  sebenarnya sudah tersedia, coba cari kode ini:
<li>
            <a href='#'><b>Info</b></a>
            <ul id='feedmenu'>

<li><a href='#' target='_blank'><b>My Facebook</b></a></li>
<li><a href='#' target='_blank'><b>Me On Twitter</b></a></li>

            </ul>
            </li>

Nah, ini adalah kode menu Info, sub menu My Facebook dan sub menu Me On Twitter. Kita hanya perlu merubah tanda: #dengan url link facebook dan twitter kita, 

Jadinya seperti ini.(contoh punya saya)
<li>

            <a href='#'><b>Info</b></a>
            <ul id='feedmenu'>

<li><a href='http://www.facebook.com/akhnurhadi' target='_blank'><b>My Facebook</b></a></li>
<li><a href='http://www.twitter.com/akhnurhadi' target='_blank'><b>Me On Twitter</b></a></li>
          
            </ul>
            </li>

Semoga bermanfaat, Happy blogging... !!

10 Januari 2011

Meng-edit Tab Category

Sahabat, dari beberapa komentar yang sahabat tuliskan, beberapa ada yang menginspirasi. Salah satunya dari sahabat Risqon. Dia menanyakan bagimana mengedit tab category pada template facebook style v.2.2. 

Langsung saja, masuk akun sahabat sampai Edit HTML, lalu cari kode sebagai berikut:

<li class='cat-item'><a href='/search/label/Category 1' title='View all posts filed under Category 1'>Category 1</a></li>

Nah, jika sudah nemu, tinggal ganti tulisan "Category 1" dst dengan laberl punya sahabat.
Misalnya, sahabat punya label Tutorial, maka nanti jadinya seperti ini:

<li class='cat-item'><a href='/search/label/tutorial' title='View all posts filed under tutorial'>Tutorial</a></li>

Sedikit catatan, tulisan label harus sama dengan label yang sahabat tulisan waktu posting. Misal, sahabat nulis "tutorial" pakai huruf kecil, maka ditulis pakai huruf kecil juga. Intinya harus sama dalam penulisan yang disini:
<a href='/search/label/tutorial' dst. 

Ok, selamat mencoba, Happy Blogging...

9 Januari 2011

Menghilangkan Tulisan "Dock Content Put In Here" pada Facebook Style v.2.2

Sahabat, hmm lama ya ga nulis di sini..
It's OK, kali ini saya mau bahas beberapa pertanyaan yang sahabat sampaikan mengenai template facebook style v.2.2.
Ada beberapa sahabat yang menanyakan "Bagaimana menghilangkan tulisan Dock Content Put In Here pada template facebook style v.2.2? Ini ditemukan pada Tab Kategori, saat diklik tanda + (plus) kadang baru kelihatan tulisan tersebut.
Setelah saya pelajari, ternyata hal itu terjadi karena kekurangcermatan saya saat mengedit. Ok, langsung saja, begini caranya:
Setelah login, masuk ke Design langsung pilih Edit HTML kemudian cari (ctrl+F) tulisan "Dock Content Put in Here", setelah menemukan, hapus widgetnya kumplit. Atau lebih mudahnya, hapus kode berikut ini:


<b:widget id='HTML99' locked='true' title='Dock Content put in here' type='HTML'>
<b:includable id='main'>
   <b:if cond='data:title'>
   <h2 class='menutitle' onclick='showbox2(this)'>
   <data:title/></h2>
   </b:if>
   <div class='widget-content'>
   <data:content/>
</div>
</b:includable>
</b:widget>


Inget, hapus mulai

<b:widget id='HTML99' locked='true' title='Dock Content put in here' type='HTML'>

sampai kode

</b:widget>

Jika sudah, klik Preview dulu, jika tidak ada kesalahan, berarti berhasil.
Nah, pada template ini juga ada ditemukan juga tulisan Recent Post. Cara menghilangkannya juga sama. Cari tulisan Recent Post dengan ctrl+F, lalu hapus semua kode untuk widget itu, seperti berikut ini:


<b:widget id='Feed1' locked='false' title='Recent Post' type='Feed'>
<b:includable id='main'>
    <h2><data:title/></h2>
    <div class='widget-content' expr:id='data:widget.instanceId + &quot;_feedItemListDisplay&quot;'>
      <span style='filter: alpha(25); opacity: 0.25;'>
        <a expr:href='data:feedUrl'><data:loadingMsg/></a>
      </span>
    </div>
    <b:include name='quickedit'/>
  </b:includable>
</b:widget>


Sekali lagi, jangan ada kode yang salah hapus.

OK, segitu dulu sahabat, semoga bermanfaat, Happy Blogging...

9 Desember 2010

Foto Profil Untuk Komentator facebook style v.2.2

Banyak yang menanyakan, bagaimana memunculkan foto profil dalam komentar pada template facebook style v.2.2.
Pada awalnya, foto profil bisa muncul, tapi akhir-akhir ini tidak bisa muncul. Ok, mungkin cara berikut ini bisa di pakai.
Masuk ke Blogger sampai Edit HTML cari kode berikut ini:


<b:loop values='data:post.comments' var='comment'>
        <div class='index-comment'>
          <div class='ic-avatar'>
          <b:if cond='data:comment.author == data:post.author'>
            <data:comment.authorAvatarImage/>
            <b:else/>
            <data:comment.authorAvatarImage/>
          </b:if>
          </div>
          <div class='ic-text'>
            <div expr:class='&quot;ic-meta &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
            <a expr:name='data:comment.anchorName'/>
            <b:if cond='data:comment.authorUrl'>
              <a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
            <b:else/>
              <data:comment.author/>
            </b:if> on
            <a expr:href='data:comment.url' title='Comment Permalink'>
             <data:comment.timestamp/>
            </a>
            <b:include data='comment' name='commentDeleteIcon'/>
            </div>
            <div>
            <b:if cond='data:comment.isDeleted'>
              <span class='deleted-comment'><data:comment.body/></span>
            <b:else/>
              <p><data:comment.body/></p>
            </b:if>
            </div>
          </div>
          </div>
      </b:loop>

Ganti dengan kode berikut:


<b:loop values='data:post.comments' var='comment'>
        <div class='index-comment'>
          <div class='ic-avatar'>
          <b:if cond='data:comment.author == data:post.author'>
            <img alt='gravatar' class='avatar' height='37' src='ganti dengan url gambar profil sendiri'/>
            <b:else/>
            <img alt='gravatar' class='avatar' height='37' src='http://www.gravatar.com/avatar/ad516503a11cd5ca435acc9bb6523536?s=60' width='37'/>
          </b:if>
          </div>
          <div class='ic-text'>
            <div expr:class='"ic-meta " + data:comment.authorClass' expr:id='data:comment.anchorName'>
            <a expr:name='data:comment.anchorName'/>
            <b:if cond='data:comment.authorUrl'>
              <a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
            <b:else/>
              <data:comment.author/>
            </b:if> at
            <a expr:href='data:comment.url' title='comment permalink'>
             <data:comment.timestamp/>
            </a>
            <b:include data='comment' name='commentDeleteIcon'/>
            </div>
            <div>
            <b:if cond='data:comment.isDeleted'>
              <span class='deleted-comment'><data:comment.body/></span>
            <b:else/>
              <p><data:comment.body/></p>
            </b:if>
            </div>
          </div>
          </div>
      </b:loop>


Trik sederhana ini hanya memunculkan foto profil  author atau pemilik blog. Sedangkan foto profil blogger yang ngasih komen hanya seperti ini:
Kalo mau diganti dengan gambar yang lain, bisa dengan mengganti url gambar ini:
http://www.gravatar.com/avatar/ad516503a11cd5ca435acc9bb6523536?s=60
Ganti dengan yang ini:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgC-W0xwiKjeHD-SCdN3HY966inNJ98297AXgATQtBMnEifyybSxymwY1TIXJ9JBYk68S8bEjs7rLjKuJ4bu5mPOdA2YpmneMTA-ywDpFBVFjgRXyDh7CpjiLkpN-NfqZR2mugLdAC2kmw/s200/anonim-c.png
Hasilnya seperti ini:

Ok, selamat mencoba...! Atau mungkin ada sahabat yang punya cara lain, silakan di share...karena berbagi tak pernah rugi...

Happy blogging...!! :)

3 Desember 2010

Memodifikasi ShoutBox pada facebook style v.2.2

Lagi, ada sahabat menginspirasi postingan kali ini. terima kasih Erwin Hidayat Saputra, juga Ade (blognya mana nee..?)

Oke, langsung pada caranya aja. Aslinya, buatan Mr. Abu Farhan tab bawah itu panjang. seperti ini:

Mengganti Foto Profil (2)

Setelah saya aplod template facebook style, ternyata ada beberapa sahabat yang tertarik untuk memakainya. Terima kasih.
Tapi masih ada juga yang bingung mengutak-atik. Salah satunya adalah mengganti foto profil. Padahal saya sudah membuat posting untuk mengganti foto profil. Oke, saya akan coba lebih detil menjelaskan.

Template facebook style v.2.2

Hmm, buat saya, yang gak faham kode CSS, atau apalah istilahnya, ternyata utak-atik template membawa keasyikan tersendiri, apalagi ketika berhasil memodifikasi sebuah template. Seperti ketika berhasil memodifikasi template facebook style dari Felipe Calvo Cepeda yang kemudian saya kasih nama facebook style v.2, klik di sini untuk lihat demonya. Template ini belum ada tab pada bagian bawah.

13 November 2010

Hosting Gratisan...

Suatu hari, lagi blogwalking nemu tutorial, saya praktekan. Setelah beberapa kali gagal, akhirnya berhasil. Seperti sahabat tahu, kalo pake wordpress.com kan kita ga bisa ganti dengan template sendiri. Yang ada hanya template default yang disediakan wordpress.com. Padahal saya sangat pengen bisa pake Smell Like Facebook buatan nazieb.com. Pake yang off line dengan localhost ga jadi. Makanya kemudian saya browsing dan nemu tutorialnya. Dan jadilah blog coba-coba saya masnur.co.cc. Screenshootnya kaya ini:

akhnurhadi.blogspot.com

Entri Populer

ChatBox

Subscribe via email

Ingin berlangganan update artikel-artikel di blog ini, silakan masukkan alamat emailmu di sini:

Delivered by FeedBurner