قالب bbcode_quote مميز للغاية

**Marcel Adam** · 11-07-2009 04:03 AM

قالب bbcode_quote مميز للغاية

أثناء تجوالي في أحد المواقع وجدت هذا القالب الرائع

فعلا أعجبني جداً لانه مميز بتصميه و أناقته

و الصورة أكبر دليل

طريقة التركيب

أستبدل محتوى قالب bbcode_quote بـ التالي


 

<div style="margin:20px; margin-top:5px; <if condition="$show['iewidthfix']">width: 100%;</if>">

 <table cellpadding="$stylevar[cellpadding]" cellspacing="0" border="0" width="100%">

 <tr>

  <td>

   <div class="quotes_header">

    <div class="quotes_header_r"></div>

    <div class="quotes_header_l"></div>

    <div class="quotes_header_c">

    <if condition="$show['username']">

     <div class="quotes_header_cont">

      <phrase 1="$username">$vbphrase[originally_posted_by_x]</phrase>

      <if condition="$postid"><a href="showthread.php?$session[sessionurl]p=$postid#post$postid" rel="nofollow"><img class="inlineimg" src="$stylevar[imgdir_button]/viewpost.gif" border="0" alt="$vbphrase[view_post]" /></a></if>

     </div>

    </if>

    </div>

   </div>

   <div class="quotes_content">

    <div class="quotes_content_r">

     <div class="quotes_content_l">

     <if condition="$show['username']">

     <div class="quotes_content_line"><img class="inlineimg" src="clear.gif" style="height:1px;" /></div>

     </if>

     <div class="quotes_content_co smallfont" style="padding: $stylevar[cellpadding]px">$message</div>

     </div>

    </div>

   </div>

   <div class="quotes_footer">

    <div class="quotes_footer_r"></div>

    <div class="quotes_footer_l"></div>

    <div class="quotes_footer_c"></div>

   </div>

  </td>

 </tr>

 </table>

</div>

و في لـ CSS الخاص في الستايل نقوم بإضافة التالي


.quotes_header_r {background-image: url('images/quotes/quotes_06.png');background-repeat: no-repeat;background-position: center center;width: 24px;height: 38px;float: right;}

.quotes_header_l {background-image: url('images/quotes/quotes_03.png');background-position: center center;background-repeat: no-repeat;width: 74px;height: 38px;float: left;}

.quotes_header_c {background-image: url('images/quotes/quotes_05.png');background-repeat: repeat-x;background-position: center center;height: 38px;margin: 0 24px 0 74px;}

.quotes_content_r {background-image: url('images/quotes/quotes_10.png');background-position: right center;background-repeat: repeat-y;padding-right: 15px;}

.quotes_content_l {background-image: url('images/quotes/quotes_12.png');background-position: left center;background-repeat: repeat-y;padding-left: 15px;}

.quotes_footer_r {background-image: url('images/quotes/quotes_16.png');background-position: center bottom;background-repeat: no-repeat;width: 24px;height: 23px;float: right;}

.quotes_footer_l {background-image: url('images/quotes/quotes_13.png');background-position: center center;background-repeat: no-repeat;width: 24px;height: 23px;float: left;}

.quotes_footer_c {background-image: url('images/quotes/quotes_15.png');background-position: center center;background-repeat: repeat-x;height: 24px;margin:0 24px 0 24px;}

.quotes_content_line {background:white url('images/quotes/quotes_09.png') right center no-repeat;}

.quotes_content_co{background:white;}

.quotes_header_cont {padding-top: 18px;}