الأربعاء 18 مايو - 13:25
.
.
أولا مشاهدة لناتج التمبليت
.


[ Template ] فوتر حديث مزود بتقنيه css .. Foter10
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
.
.
طريقه التركيب :
أولا ندخل: لوحه الادارة >> مظهر المنتدى >> الوان >> ورقه css
.
ثم نضع الكود التالى :
.

الكود:



#footer {
 width:auto;
        cursor: crosshair
 margin:auto;
 height:220px;
 color:#c3c3c3;
 direction:rtl;
 background-image: url('http://i62.servimg.com/u/f62/15/62/91/07/untitl11.png');
 }
img{
 border:none;
}

.footerleft {
  background-image: url('http://i62.servimg.com/u/f62/15/62/91/07/hesham10.png');
  background-repeat: no-repeat;
  background-position: left;
  height: 190px;
}


 
.heshambb{
 float:right;
 width:230px;
 padding:10px;
 border-right:1px dashed #666;
 }
.heshambb h3{
 font-family:"Arial Black", Gadget, sans-serif;
 font-size:16px;
 color:#FFF;
 font-weight:bold;
 background-color:#0a95b8;
 padding-right:10px;
 margin-bottom:3px;
 }
 
.heshambb ul li {
 list-style-type:none;
        text-decoration: none;
 padding:5px;
 cursor: crosshair;
 float: right;
 }
.heshambb p {
 font-family:Tahoma, Geneva, sans-serif;
 font-size:12px;
 color:#696969;
 text-align: justify;
 }
.heshambb ul li a {
 color:#1c6b7f;
 text-decoration: none;
 font-family: Tahoma, Geneva, sans-serif;
 font-size: 12px;
 }
.heshambb ul li a:hover{
 color:#FFF;
}
.heshambb ul li:hover{
 cursor: crosshair;
 background-color: #0e83a0;
 color: #FFF;
 }
/*End footer style*/

.
.
ثم مظهر المنتدى >>التومبلايتات و القوالب >> ادارة عامه >> نحرر ملف overall_footer
ثبحث عن وسمين :

الكود:


</body>
</html>

فى نهايه الملف
ونضع قبلها التالى :



الكود:



<!--Start Footer-->
<div id="footer">
<div class="footerleft">

 <div class="heshambb">
   
    <h3> <img src="http://i62.servimg.com/u/f62/15/62/91/07/stick-10.png" alt="myforum" /> نبذه تعريفيه</h3>
       
 
      <p>تمبليت فوتر حديث بتقنيه css - مقدم من heshamBB لشركه
احلى منتدى - تمبليت فوتر حديث بتقنيه css - مقدم من heshamBB لشركه احلى
منتدى -تمبليت فوتر حديث بتقنيه css - مقدم من heshamBB لشركه احلى منتدى
</p>
           
    </div>
        <div class="heshambb">
 
        <h3> <img
src="http://i62.servimg.com/u/f62/15/62/91/07/stick-10.png"
alt="myforum" /> الوصول السريع</h3>
           
            <ul>
 
            <li><a href="#" target="_self"><img
src="http://i62.servimg.com/u/f62/15/62/91/07/plus-l10.png" /> ضع
رابطك هنا</a></li>
            <li><a href="#"
target="_self"><img
src="http://i62.servimg.com/u/f62/15/62/91/07/plus-l10.png" /> ضع
رابطك هنا</a></li>
                           
<li><a href="#" target="_self"><img
src="http://i62.servimg.com/u/f62/15/62/91/07/plus-l10.png" /> ضع
رابطك هنا</a></li>
                                     
      <li><a href="#" target="_self"><img
src="http://i62.servimg.com/u/f62/15/62/91/07/plus-l10.png" /> ضع
رابطك هنا</a></li>
                                     
                      <li><a href="#" target="_self"><img
 src="http://i62.servimg.com/u/f62/15/62/91/07/plus-l10.png" /> ضع
رابطك هنا</a></li>            </ul>
        </div>
 

        <div class="heshambb">
 
        <h3><img
src="http://i62.servimg.com/u/f62/15/62/91/07/stick-10.png"
alt="myforum" /> الوصول السريع</h3>
           
            <ul>
 
            <li><a href="#" target="_self"><img
src="http://i62.servimg.com/u/f62/15/62/91/07/plus-l10.png" /> ضع
رابطك هنا</a></li>
            <li><a href="#"
target="_self"><img
src="http://i62.servimg.com/u/f62/15/62/91/07/plus-l10.png" /> ضع
رابطك هنا</a></li>
                           
<li><a href="#" target="_self"><img
src="http://i62.servimg.com/u/f62/15/62/91/07/plus-l10.png" /> ضع
رابطك هنا</a></li>
                                     
      <li><a href="#" target="_self"><img
src="http://i62.servimg.com/u/f62/15/62/91/07/plus-l10.png" /> ضع
رابطك هنا</a></li>
          <li><a href="#"
target="_self"><img
src="http://i62.servimg.com/u/f62/15/62/91/07/plus-l10.png" /> ضع
رابطك هنا</a></li>            </ul>
        </div>
 
 
        <div class="heshambb">
 
        <h3><img
src="http://i62.servimg.com/u/f62/15/62/91/07/stick-10.png"
alt="myforum" /> الوصول السريع</h3>
            <ul>
 
            <li><a href="#" target="_self"><img
src="http://i62.servimg.com/u/f62/15/62/91/07/plus-l10.png" /> ضع
رابطك هنا</a></li>
            <li><a href="#"
target="_self"><img
src="http://i62.servimg.com/u/f62/15/62/91/07/plus-l10.png" /> ضع
رابطك هنا</a></li>
                           
<li><a href="#" target="_self"><img
src="http://i62.servimg.com/u/f62/15/62/91/07/plus-l10.png" /> ضع
رابطك هنا</a></li>
                                     
      <li><a href="#" target="_self"><img
src="http://i62.servimg.com/u/f62/15/62/91/07/plus-l10.png" /> ضع
رابطك هنا</a></li>
                                     
                      <li><a href="#" target="_self"><img
 src="http://i62.servimg.com/u/f62/15/62/91/07/plus-l10.png" /> ضع
رابطك هنا</a></li>
            </ul>
        </div>
 

</div>


.
.

ملحوظه :
رابط خلفيه الفوتر كالتالى : [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
ويمكنك تغير الشعار فى يسار الموقع من خلال الصوةر التاليه : [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]

.
.
غير الصور التاليه فى كود المرفق فى css لكى تتوافق مع استيل منتداك
وشكرا والسلام عليكم [ Template ] فوتر حديث مزود بتقنيه css .. 825617