Tutorial : Bias List #1

Hari tu, ada someone ni request macam mana aku buat bias list tu. Actually, tuto ni, bukan dari aku. Aku credit kak Wana ni.

1. Template > Edit html. 
2. Tekan Ctrl + f serentak. Then cari code <style>
3. Then, copy code ni. 
<style>
.iconborder{background:#EEE2DC;width:80px;height:80px;padding:5px;border-radius:333px;box-shadow:0 0 6px #ddd;}
.icon{background:#EEE2DC;width:80px;height:80px;border-radius:333px;box-shadow:0 0 6px #ddd;padding:0;border:none;}
.name{background:#FBEBED;width:84px;padding:2px; text-align:center;color:#aaa; text-transform:uppercase;box-shadow:0 0 6px #ddd; margin-top:-5px; }
</style>
4. Paste code tu, di bawah code <style>.
5.Then , pergi dekt page yang korang nak letak bias tu, paste code ni.

<center>
<table border="0" bordercolor="0" style="font-size:11px;" width="500px" cellpadding="3" cellspacing="10">
<tr>
  <td><div class="iconborder" style="margin-left:20px;">
<img class="icon" style="padding:0;border:none;" src="http://data.whicdn.com/images/55156168/ljoe_glasses_large.png"></div>
<div class="name"style="margin-left:20px;">
Name</div>
</td>
  <td><div class="iconborder" style="margin-left:20px;">
<img class="icon" style="padding:0;border:none;" src="http://data.whicdn.com/images/55156168/ljoe_glasses_large.png"></div>
<div class="name"style="margin-left:20px;">
Name</div>
</td>
  <td><div class="iconborder" style="margin-left:20px;">
<img class="icon" style="padding:0;border:none;" src="http://data.whicdn.com/images/55156168/ljoe_glasses_large.png"></div>
<div class="name"style="margin-left:20px;">
Name</div>
</td>
  <td><div class="iconborder" style="margin-left:20px;">
<img class="icon" style="padding:0;border:none;" src="http://data.whicdn.com/images/55156168/ljoe_glasses_large.png"></div>
<div class="name"style="margin-left:20px;">
Name</div>
</td>
 </tr>
<tr>
  <td><div class="iconborder" style="margin-left:20px;">
<img class="icon" style="padding:0;border:none;" src="http://data.whicdn.com/images/55156168/ljoe_glasses_large.png"></div>
<div class="name"style="margin-left:20px;">
Name</div>
</td>
  <td><div class="iconborder" style="margin-left:20px;">
<img class="icon" style="padding:0;border:none;" src="http://data.whicdn.com/images/55156168/ljoe_glasses_large.png"></div>
<div class="name"style="margin-left:20px;">
Name</div>
</td>
  <td><div class="iconborder" style="margin-left:20px;">
<img class="icon" style="padding:0;border:none;" src="http://data.whicdn.com/images/55156168/ljoe_glasses_large.png"></div>
<div class="name"style="margin-left:20px;">
Name</div>
</td>
  <td><div class="iconborder" style="margin-left:20px;">
<img class="icon" style="padding:0;border:none;" src="http://data.whicdn.com/images/55156168/ljoe_glasses_large.png"></div>
<div class="name"style="margin-left:20px;">
Name</div>
</td>
 </tr>
</table>
</center>
6. Preview and save.

Merah : Tukar kepada URL image yang korang nak.



[ 0 comments ]