Membuat Permalink Otomatis Di Blog v2

Permalink
Membuat Permalink Otomatis Di Blog v2 - Kenapa saya kasih judul postingan ini Membuat Permalink Otomatis Di Blog v2? Karena sebelumnya saya sudah pernah memposting Membuat Permalink Otomatis Di Blog.

Bedanya pada postingan pertama dan kedua ini yaitu pada postingan pertama tidak disertakan photo author blognya. Nah untuk itu kini saya share Membuat Permalink Otomatis Di Blog v2 yang disertakan photo author blognya.

Caranya sama dengan postingan pertama, hanya beda sedikit pada kode css-nya. Untuk hasilnya bisa Anda lihat pada gambar di bawah ini atau bisa dilihat pada bagian bawah postingan ini.

Screenshot Permalink

Bagaimana tertarik untuk mencobanya pada blog Anda (tentunya bagi yang belum menggunakan permalink otomatis pada blog)? Silahkan ikuti tutorial sederhana saya di bawah ini.

Seperti biasa Anda silahkan Login ke blog Anda >> Dashboard >> Template >> Edit HTML >> Jangan lupa centang Expand Widget Templates. Namun alangkah baiknya sebelumnya Anda back up dulu template blognya untuk menjaga hal-hal yang tidak diinginkan, sehingga bilamana terjadi kesalahan bisa dikembalikan ke template semula.

Kemudian cari kode ]]></b:skin> agar lebih mudah dalam pencarian, tekan CTRL + F di keyboard kemudian masukan kode ]]></b:skin> tadi. Setelah ketemu silahkan copy kode di bawah ini dan paste SEBELUM kode ]]></b:skin> tadi.

.buatpermalinkblogger{
display:block;
width:auto;
border:1px solid #191919;
border-bottom:1px solid #666;
border-right:1px solid #666;
padding: 5px;
background: #444;
-moz-border-radius:5px;
}
.buatpermalinkblogger .kontainer{padding:5px;}
.buatpermalinkblogger h4{
background:#444;
border:none;
text-transform:normal;
padding:5px 5px;
margin:0 0 0 0;
display:block;
}
.buatpermalinkblogger img{
width:50px;
height:50px;
margin:0 10px 0 0;
float:left;
border:1px solid #000000;
padding:2px;
background:#FFFFFF;
box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none;
}

Perhatikan tulisan berwarna merah #444 itu menunjukkan warna untuk kotaknya. Silahkan sesuaikan dengan warna blog Anda. Angka 50 pada width dan height untuk ukuran photo yang akan ditampkilkan.

Kemudian cari kode seperti di bawah ini

<div class='post-footer-line post-footer-line-1'>

atau kalau enggak ada cari yang seperti di bawah ini

<p class='post-footer-line post-footer-line-1'>

Kemudian copy kode di bawah ini dan pastekan SETELAH kode di atas tadi.

<b:if cond='data:blog.pageType == "item"'>
<div class='buatpermalinkblogger'>
<div style='text-align: left;text-shadow:1px 1px 1px #000;'><h4>Diposting Oleh : <a href='http://kompiajaib.blogspot.com/'>Kompi Ajaib | All About Sharing</a></h4></div>
<div class='kontainer'>
<img src='http://lh3.googleusercontent.com/-Q55pKJrgnXs/AAAAAAAAAAI/AAAAAAAAELg/XWHpCuaP6jM/s512-c/photo.jpg'/><div style='text-align: left;text-shadow:1px 1px 1px #000;'><small>Anda sedang membaca artikel tentang <strong><i><data:blog.pageName/></i></strong> dan bila berkenan Anda bisa share artikel <strong><i><data:blog.pageName/></i></strong> ini dengan tombol share di bawah. Bila Anda bermaksud COPAS artikel <strong><i><data:blog.pageName/></i></strong> untuk diposting di blog Anda, mohon untuk meletakkan link <strong><i><a expr:href='data:post.url'><data:blog.pageName/></a></i></strong>
sebagai Sumbernya dengan mengcopy kode di bawah ini.</small></div>
&lt;div&gt;
&lt;form name=&quot;kompi ajaib&quot;&gt;
&lt;p align=&quot;center&quot; style=&quot;margin-top: 0; margin-bottom: 0&quot;&gt;&lt;textarea style=&quot;width: 560px; height: 30px&quot; name=&quot;txt&quot; rows=&quot;1&quot; cols=&quot;45&quot; onmouseover=&quot;this.form.txt.select()&quot; readonly ;&gt;<small>Sumber: &lt;a href=&#39;<data:post.url/>&#39;target=&#39;_blank&#39;&gt;&lt;strong&gt;&lt;i&gt;kompiajaib.blogspot.com&lt;/i&gt;&lt;/strong&gt;&lt;/a&gt;</small>&lt;/textarea&gt;&lt;/p&gt;
&lt;/div&gt;
</div>
<div style='border: 0px; padding: 5px; background-color: none; text-align: right; font-size:9px;'>Get this <a href='http://kompiajaib.blogspot.com/2012/06/membuat-permalink-otomatis-di-blog.html' target='_blank'>widget</a></div>
</div>
</b:if>

Ganti tulisan http://kompiajaib.blogspot.com/ dan Kompi Ajaib | All About Sharing dengan URL dan Title blog atau dengan nama Anda sendiri.

http://lh3.googleusercontent.com/-Q55pKJrgnXs/AAAAAAAAAAI/AAAAAAAAELg/XWHpCuaP6jM/s512-c/photo.jpg itu untuk URL photo Anda. Gunakan photo yang persegi (lebar dan tingginya sama). kompiajaib.blogspot.com ganti dengan blog Anda.

Silahkan lakukan preview untuk memastikan penerapan kodenya sudah betul atau belum, kemudian save template blog Anda.

Demikan saja postingan Membuat Permalink Otomatis Di Blog v2 kali ini semoga dapat bermanfaat bagi Anda semua.

You Might Also Like:

How to style text in Disqus comments:
  • To write a bold letter please use <strong></strong> or <b></b>.
  • To write a italic letter please use <em></em> or <i></i>.
  • To write a underline letter please use <u></u>.
  • To write a strikethrought letter please use <strike></strike>.
  • To write HTML code, please use <code></code> or <pre></pre> or <pre><code></code></pre>.
    And use parse tool below to easy get the style.
Show Parser Hide Parser
Disqus Comments