MENYISIPKAN GAMBAR PADA LINK TEXT

~ Diposting oleh ega di 03.16 ~
Di samping linknya terdapat icon-icon jenis file linknya. Seperti icon zip, doc, pdf, atau bahkan html. Dengan menampilkan icon file tersebut maka itu akan lebih menjelaskan jenis file yang akan di download. Dan tentunya itu menjadi lebih menarik dibandingkan dengan hanya tulisan saja.

Agar setiap link yang berekstensi .zip .pdf .doc dapat menampilkan icon sesuai filenya, maka berikut caranya.

1. pastekan code diabwah ini setelah code <head>


<script type="text/javascript" src="http://www.geocities.com/ebenk_789/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("a[@href$=pdf]").addClass("pdf");
$("a[@href$=zip]").addClass("zip");
$("a[@href$=doc]").addClass("doc");
});
</script>


2. cari kode //]]>

3. Copy lalu pastekan code dibawah sebelum kode //]]>

.pdf {
padding-left: 20px;
background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3x4yeDSI0owbkGG0qICOnajveC-ivEeXERp3ZoRU2vQAI8ijfT4R351AAOkhfNkxaZ8AYm692vMt2XGOiWOhBJO4UcQyhF8vJrLTuv1aaRdMRtQPcqvN6lGjo_p2SFR_pH8kj3-CEWVc/s144/icon-pdf.png) left top no-repeat;
}

.zip {
padding-left: 20px;
background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhD-DQmR_eTcS48Zt8jHNIKnUtAbjjW3J1ZTC3uXjcONwiFporX_YZRt861BKSo5sdByrGMk1nKOAHlRjn9bVaRX2vpkwE_kCRS9q5D916r10dJnXJB1ZYxcgVECflCT2a5EketGcVUa10/s144/icon-zip.png) left top no-repeat;
}

.doc {
padding-left: 20px;
background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOuj4kIoG7-Q-rpZPUK0SevoYD-j5ZIlkhPgy5lzsR2Jklzkmhjlnc1TsmWP2_9ZkqRIEVb8D3mDKCLXGyHlZ79hC9I6L3BMYo21MQgaxdDO7h9C340Z5LhO_84_bl_eFSdiGNSdhhdA8/s144/icon-doc.png) left top no-repeat;
}

4. Save template
Label:

0 komentar:

Posting Komentar

Langganan: Posting Komentar (Atom)
 
© 2009 - MY LINK
IniMinimalisKah is proudly powered by Blogger