Menandai komentar admin dengan css

CSS Komentar sitemap Trik

Buat sahabta blogger yang masih bertanya tanya tentang cara membuat tanda pada komentar admin untuk mempermudah pengunjung mencari mana komentar admin kali ini saya beri trik dan caranya.
blogger tidak memberikan ijin secara penuh untuk melakukan modifikasi penuh komentar admin, lalu bagaimana jika kita ingin membuat tampilan komentar yang berbeda pada blok komentar administrator secara keseluruhan? Dulu kita bisa menggunakan tag kondisional, tapi sekarang tidak lagi.
jadi untuk lebih mudahnya kita akan menggunakan dan memanfaatkan css tanpa javascript...


oke langsung saja simak trik di bwah ini:

Pertama buka editor template blogger

cari kode tag berikut ini dalam template sobat...

<b:includable id='comments' var='post'>

lalu temukan kode di bawah ini dalam area tag komentar tersebut

1code-line:2-12code-line:2-23code-line:2-34code-line:2-45code-line:2-5<b:if cond='data:comment.authorUrl'>
  <a expr:href='data:comment.authorUrl' expr:title='data:comment.author' rel='nofollow' target='_blank'><data:comment.author/></a> 
   <b:else/>
  <data:comment.author/> 
</b:if>

setelah anda temukan, letakkan kode berikut ini di bawah kode di atas

1code-line:3-1<span class='comment_author_flag'>Admin</span>

Kemudian, tambahkan kode ini di atas ]]></b:skin> atau </style>:

.comment_admin .comment_author_flag {display:inline;background:#bbb;font-size:13px;font-weight:normal;padding:2px 6px;margin-left:8px;color:#fff;border-radius:4px;text-transform:uppercase;letter-spacing:.1em}

untuk mengubah background komentar milik admin tambahkan kode css berikut ini di atas   ]]></b:skin> atau </style>:

1code-line:5-1div.comment_inner.comment_admin {background:#394549;}

jika dalam template sobat sudah ada, ganti saja warnanya dengan tampilan warna yang anda suka dengan merubah nilai pada {background:#394549;}

sekarang tinggal lihat hasilnya...

demikian saja semoga berguna dan bermanfaat sob...

Artikel Terkait

  • Membuat ucapan terimakasih di bawah komentar
    Pagi sobat blogger lagi liburan buat posting hiasan untuk blogger, kali ini saya mau share cara dan trik untuk membuat pesan ucapan terimakasih di bawah kotak komentar.   Triknya cukup mudah tinggal menambahkan css dan sedikit kode html di template sobat, langsung aja berikut ini caranya Buka editor template blogger anda sperti bias…
  • Membanned spamer di komentar dengan jquery
    Kali ini saya ingin berbagi buat sobat yang udah males dan capek menghapus komentar para spammer, yang satu ini palinf buat suasana jadi males dan menjengkelkan bila hadir di komentar blog kita. jquery ini bisa sobat gunakan untuk menghapus dan membanned para spamer tersebut dengan menghilangkan isi komentar juga link profile mereka agar user …
  • Modifikasi Alert Emoticon
    Saya telah membuat postingan Emoticon komentar otomatis namun pada postingan dahulu itu tidak ada modifikasi pemberitahuan pada saat emoticon tersebut di klik yang mana tampilannya masih menggunakan tampilan alert default. Demo Dan pada postingan saya kali ini saya akan membagikan cara modifikasi tampilan alertnya sesuka hati kita agar t…
  • Meringankan load konten avatar comment
    Load/waktu muat blog memang mempengaruhi trafic, faktanya pengunjung malas membuka sebuah halaman blog yang menyita waktu load yang lama yang bila mungkin digunakan untuk membuka halaman blog lain bisa sudah membaca beberapa halaman. Maka dari itu, banyak para blogger bekerja keras menerapkan berbagai cara untuk menjadikan blog mereka memili…
  • Membuat pesan formulir komentar dengan css
    Merubah tampilan dan gaya pesan untuk komentar di blogger agar terlihat lebih rapi dan mempunyai style tersendiri bukanlah hal yang sulit. trik ini terkadang berguna untuk membuat pengunjung lebih semangat berkomentar, anda ingin pesan form komentar blog anda bergaya seperti berikut ikuti panduan berikut ini... 1. Masuk Blogger. 2.Pilih Tem…
  • Menandai komentar admin dengan css
    Buat sahabta blogger yang masih bertanya tanya tentang cara membuat tanda pada komentar admin untuk mempermudah pengunjung mencari mana komentar admin kali ini saya beri trik dan caranya. blogger tidak memberikan ijin secara penuh untuk melakukan modifikasi penuh komentar admin, lalu bagaimana jika kita ingin membuat tampilan komentar yang ber…

17 komentar

  1. kalau sudah pakai thread comment tinggal ganti saja yah biar sesuai template :D

    BalasHapus
    Balasan
    1. ini memang thread comment gan,

      <b:includable id='comments' var='post'>
      itu elemen area komentar yang muncul sedangkan
      <b:if cond='data:comment.authorUrl'>
        <a expr:href='data:comment.authorUrl' expr:title='data:comment.author' rel='nofollow' target='_blank'><data:comment.author/></a> 
         <b:else/>
        <data:comment.author/> 
      </b:if>
      adalah seleksi kusus yang di terapkan... :)

      Hapus
  2. dengan adanya simbol tulisan admin pada komentar, maka kita bisa lebih mudah untuk membedakan mana komentar pengunjung dan mana komentar admin blog ya mas. Boleh juga nih tutorialnya dicoba. Terimakasih atas share nya ya ;)

    BalasHapus
    Balasan
    1. betul mbak, pa lagi yang masih mengijinkan komen anonim yang terkadang ngaku admin jadi bisa lebih mudah membedakan :)

      Hapus
  3. lebih simple pake CSS daripada pake jQuery yang bikin ribet dan loading lama. Cara ini yang paling efektif dan aman untuk Menandai Komentar Admin :-d

    BalasHapus
  4. gan , Emang nya Gabisa di Geser yah ?

    BalasHapus
  5. Cara Membuat Kaya Komentar Admin disini Gimana ?

    BalasHapus
  6. Terus Cara Membuat Komentar nya Kayak Gini Gimana ?
    Masih Banyak Tutorial nih
    Back yah

    BalasHapus
  7. kok gk work ya di blog ane, mohon cek gan fahri-artikel.blogspot.com

    BalasHapus
Kode klik emo: :) :( =( :wa: :s ^_^ :D =D ^:D @@, ;) :-bd :-d :ya: :'( T_T :\ :p B) :Q :Ozz 7:( \o/ **p

Link aktif dalam komentar akan terhapus secara otomatis.
Untuk menyisipkan kode, gunakan tag <i rel="code">...KODE ANDA DI SINI...</i>
Untuk menyisipkan script, gunakan <i rel="pre">...KODE SCRIPT ANDA...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">...URL GAMBAR ANDA ...</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">...JUDUL ANDA...</b>
Untuk menyisipkan catatan, gunakan tag <b rel="quote">...CATATAN ANDA...</b>
Untuk menciptakan efek tebal gunakan tag <b>...TEKS ANDA...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>...TEKS ANDA...</i>

Konversi KodeOOT
:) :( =( :wa: :s ^_^ :D =D ^:D @@, ;) :-bd :-d :ya: :'( T_T :\ :p B) :Q :Ozz 7:( \o/ **p
Jika anda memiliki bahasan atau topik lain yang sama sekali tidak ada hubungan dengan tutorial diatas anda bisa menyampaikannya di halaman OOt. klik [link ini] untuk membuka halaman OOT.

Back to Top
Loading...