احلى منتدى,منتدى مجاني

الثلاثاء، 31 مايو 2011

[ Template ] فوتر حديث مزود بتقنيه css ..

http://i23.servimg.com/u/f23/13/93/21/45/aljana12.png

مثال

http://i62.servimg.com/u/f62/15/62/91/07/foter10.png
.
.
طريقه التركيب :
أولا ندخل: لوحه الادارة >> مظهر المنتدى >> الوان >> ورقه 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*/

[ Template ] فوتر حديث مزود بتقنيه css ..

من طرف heshambb في الأربعاء مارس 16, 2011 11:50 am

.
.
أولا مشاهدة لناتج التمبليت
.

تصغير الصورة تم تعديل ابعاد هذه الصورة. انقر هنا لمعاينتها بأبعادها الأصلية.

الكود: ---------تضليل المحتوى: #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>

.
.

ملحوظه :
رابط خلفيه الفوتر كالتالى : http://i62.servimg.com/u/f62/15/62/91/07/untitl11.png
ويمكنك تغير الشعار فى يسار الموقع من خلال الصوةر التاليه : http://i62.servimg.com/u/f62/15/62/91/07/hesham10.png

.
.
غير الصور التاليه فى كود المرفق فى css لكى تتوافق مع استيل منتداك

ـــــــــــــــــــــــــــــــــــــــــــــــــــــــــ

مدونة احلى منتدى

http://ahlamontadaa.blogspot.com/

[كود تومبيلات]شرح اخفاء أزرار الاستعراض الثلاثة

السلام عليكم

ازيكم يا احلي اعضاء ِِ هذا اليوم سوف اقدام لكم شرح اخفاء ازرار الاستعراض الثلاثة

/../
استعرض المواضيع الجديدة منذ آخر زيارة لي
استعرض مُساهماتك
استعراض المواضيع التي لم يتم الرد عليها
/../
صورة توضحية لغرض الكود

اولاً نذهب الي :

لوحة الادارة > مظهر المنتدي > التومبلايتات و القوالب > إدارة عامة نختار منها القالب
index_box ِِ ثم نضغط علية بزر تعديل

نبحث عن هذا الكود ِِ

<!-- BEGIN switch_user_logged_in -->         <a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><br />         <a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br />         <!-- END switch_user_logged_in -->         <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>

ثم نحذفة .. ونضع مكانة هذا الكود

 

ثم نضغط علي زر سجل ثم نضغط علي كلمة نشر الكود بزر

ـــــــــــــــــــــــــــــــــــــــــــــــــــــــــ

مدونة احلى منتدى

http://ahlamontadaa.blogspot.com/

الاثنين، 30 مايو 2011

كود وضع ايطار للصورة الشخصية عند مرور الماوس عليها

كود وضع ايطار للصورة الشخصية عند مرور الماوس عليها

الكود للنسخة الثانية فقط

مثال مباشر

الكود

    .postdetails.poster-profile a img:hover
{

    
        border-width: thick;
        border-style: dotted;
        border-color: gold;
    }

يوضع في وريقة css

يمكنكم تغير لون الايطار من خلال :

border-color: كود الون

ـــــــــــــــــــــــــــــــــــــــــــــــــــــــــ

مدونة احلى منتدى

http://ahlamontadaa.blogspot.com/

[كود css] لوضع اطأر للرئيسيه وداخل المواضيع بشكل جميل جدا للنسخه (invision)

[كود css] لوضع اطأر للرئيسيه وداخل المواضيع بشكل جميل جدا للنسخه (invision)

الكود


/* -------- اطار جميل للصفحه كلها وداخل المواضيع ايَضأ----------------------------- */
div.borderwrap,.borderwrapm {
    padding: 1px;
    border: 6px #EDCB1F ridge;
    background-color: #870511;
    }
/* -------http://ahlamontadaa.blogspot.com/------------------- */

للتحكم فى حجم الاطأر من هذا الرمز

border: 6px

وللتحكم بشكل ولون الاطأر من هذا الرمز

#EDCB1F

وده موضوع يسهل عليك البحث عن اختيار الوان لأختيار كود اللون المطلوب

صور للكود من الرئيسيه وداخل الاقسأم لتوضيح شغل الكود اكثر

صور من الرئيسيه قبل وبعض وضع الكود