Saturday, April 11, 2015

Cara Membuat Author Box di Bawah Postingan Blogger

Hay semunya..?? maaf jarang update soalnya lagi ujian, kali ini saya akan update Cara Membuat Author Box di Bawah Postingan Blogger. kenapa saya update tutorial ini..?? tutorial ini saya update karna ada sobat blogger yang minta tutorial ini. jadi saya langsung update totorial Cara Membuat Author Box di Bawah Postingan BloggerFungsi Author ini adalah untuk mempercatntik tampilan posting dan juga membuat pengunjung blog tahu tentang profil singkat si penulis blog, fungsi utama dari widget author box adalah menampilkan secara singkat biografi sang penulis atau profil singkat penulis pada bagian bawah posting agar bisa dibaca oleh pengunjung yang ingin tahu tentang si penulis blog istilah anak gaulnya si keppo, jika sobat ingin melihat contohnya seperti apa silakan lihat dibagian bawah posting ini, langsung aja nih praktekin tutorial Cara Membuat Author Box di Bawah Postingan Blogger.



  • login ke blogger.com
  • pilh template >> edit html
  • cari kode ]]></b:skin> untuk mempermudah gunakan ctrl+f
  • copy paste kode dibawah ini tepat diatas ]]></b:skin>

/* kotak author muhammad fariz azri */
.admin-tulisan{display:block;width:auto;background:#CFE2E0;border:2px solid #fff;box-shadow:0 1px 3px #000;-moz-box-shadow:0 1px 3px #000;-webkit-box-shadow:0 1px 3px #000;padding:0;margin:30px 0 10px 0;font:normal 12px Arial, Sans-Serif;color:#222;}
.admin-tulisan .kontainer{padding:5px;}
.admin-tulisan h4{background:#8A9C04;border:none;border-bottom:1px solid #699019;color:#fff;text-transform:normal;text-shadow:0 1px 0 rgba(0, 0, 0, 0.4);font:bold 12px Arial,Sans-Serif;padding:5px 10px;margin:0 0 0 0;display:block;}
.admin-tulisan h4 a{color:#FEEA83;}
.admin-tulisan img{width:70px;height:70px;margin:0 10px 0 0;float:left;border:1px solid #954B02;padding:2px;background:#C36702;
box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none;margin: 0px;border: 5px solid #eee;-webkit-box-shadow: 4px 4px 4px rgba(0,0,0,0.2);-moz-box-shadow: 4px 4px 4px rgba(0,0,0,0.2);box-shadow: 4px 4px 4px rgba(0,0,0,0.2);-webkit-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;-webkit-transform: rotate(-7deg);-moz-transform: rotate(-7deg);-o-transform: rotate(-7deg);}
/* kotak author muhammad fariz azri */

  • Cari kode <data:post.body/> untuk mempermudah gunakan ctrl+f , akan muncul lebih dari satu kode <data:post.body/> jadi pilih kode yang kedua kalau masih belum berhasil paste dibawah kode yang pertama
  • Copy paste kode berikut dibawah <data:post.body/>

<!-- Kotak Admin Muhammad Fariz Azri -->
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <div class='admin-tulisan'>
    <h4>Creatif By : <a expr:href='data:blog.homepageUrl'><data:post.author/></a> | Muhammad Fariz Azri</h4>
    <div class='kontainer'>
    <img src='http://static.hdw.eweb4.com/media/wallpapers_2560x1600/photography/1/1/anonymous-photography-hd-wallpaper-2560x1600-7842.jpg'/>
    Terimah Kasih telah membaca artikel<a expr:href='data:post.url'><data:post.title/></a>. Yang ditulis oleh  <data:post.author/> .Pada hari<data:post.dateHeader/>. Jika anda ingin sebarluaskan artikel ini, mohon sertakan <strong>sumber link asli.</strong> Kritik dan saran dapat anda sampaikan melalui kotak komentar. Trimakasih
    <p>
<textarea cols='75' id='bloglinking' name='bloglinking' onclick='this.focus();this.select()' onfocus='this.select()' onmouseover='this.focus()' readonly='readonly' rows='2'>&lt;a href=&quot;<data:post.url/>&quot; target=&quot;_blank&quot;&gt;<data:blog.pageName/>&lt;/a&gt;</textarea></p>
    <div style='clear:both;'/>
    </div>
    </div>
    </b:if>
    <!-- Kotak Admin Muhammad Fariz Azri -->
NOTE:
ganti tulisan berwarna MERAH dengan nama blog sobat
ganti tulisan berwarna BIRU dengan foto profil sobat
untuk kata-kata yang lainya bisa di ganti dengan creatif anda sendiri

oke itu saja yang bisa saya sampikan dalam tutorial Cara Membuat Author Box di Bawah Postingan Blogger kurang lebihnya mohon maaf.

Creatif By : Unknown | Muhammad Fariz Azri

Terimah Kasih telah membaca artikelCara Membuat Author Box di Bawah Postingan Blogger . Yang ditulis oleh Unknown .Pada hariSaturday, April 11, 2015. Jika anda ingin sebarluaskan artikel ini, mohon sertakan sumber link asli. Kritik dan saran dapat anda sampaikan melalui kotak komentar. Trimakasih

No comments:

Post a Comment

Marilah Berkomentar Dengan Sopan & Jelas Tidak Mengandung :
1.Sara
2.Pelecehan
3.Spam
4.Link Aktif
Mari beri g+1 nya ... :D