المساعد الشخصي الرقمي

مشاهدة النسخة كاملة : حصريا .. ميز منتداك بفوتر css وخفف من اخطاء استايل styleك البرمجية + شرح طريقة التركيب install ( تألق



linnou
10-31-2013, بتوقيت غرينيتش 04:44 AM
http://www.dzbatna.com/images/icons/smile.gif ط*طµط±ظٹط§ .. ظ…ظٹط² ظ…ظ†طھط¯ط§ظƒ ط¨ظپظˆطھط± css ظˆط®ظپظپ ظ…ظ† ط§ط®ط·ط§ط، ط§ط³طھط§ظٹظ„ظƒ ط§ظ„ط¨ط±ظ…ط¬ظٹط© + ط´ط±ط* ط§ظ„طھط±ظƒظٹط¨ ( طھط£ظ„ظ‚ (http://www.dzbatna.com/t1905174/)




السلام عليكم ورحمه الله وبركاته

تقدم لكم منتديات التصميم الحر

فوتر منتدى بتقنية css
الصراحة شاهدت معضم المنتديات
يتعاملون بأكواد html مصنوعة على الفرونت بيج
ولكن للاسف لو لاحظت عدد اخطاء الاستايل style البرمجية
لرأيتها في تزايد وهذا يضر كثيرا في الارشفة indexation
ولكن اليوم بقدم لكم
فوتر منتدى بتقنية css
وتركيب installه سهل جدا
وطبعا انا حشرح طريقة لكم طريقة التركيب install والتعديل على الكود code

أولا لمشاهدة مثال
مثال في منتديات التصميم الحر (http://www.free4des.com/vb/)
انزل اسفل المنتدى forum وشاهد



ومثال مباشرة
اضغط هنا (http://www.free4des.com/footercss.html)

==== نبدا الشرح طريقة
بسم الله
أول شي الكود code نوعين
نوع css
ونوع html عادي
وكل كود code له مكان
أول شي
ننسخ الكود code هذا

رمز PHP:

<code style="white-space:nowrap"> <code> /*بداية كود code css*/
* {
outline:none;
margin:0;
padding:0;
}
body {
direction:rtl;
}
.footer_css {
background-color:#74265e;/*لوضع لون للخلفيه*/
height:auto;
width:100%;
overflow:hidden;
position:relative;
}
.copyrights {
position:absolute;
bottom:10px;
left:10px;
text-decoration:none;
color:#ccc;
text-shadow:1px 1px 1px #FFF;
}
.copyrights:hover {
color:#000;
}
.footer_css div {
float:right;
overflow:hidden;
height:100%;
width:250px;/*عرض كل ديف*/
border-left:1px solid #FFF;
padding:10px;
}
.footer_css div h3 {
color:#FFF;
}
.footer_css div p {
text-align:justify;
font:9pt Tahoma, Geneva, sans-serif;
text-shadow:1px 1px 1px #000;
}
.footer_css div ul {
padding:0;
margin:0;
list-style-type:none;
}
.footer_css div ul li {
padding:5px;
border-bottom:1px dashed #ffb8eb;
}
.footer_css div ul li:hover {
border-bottom:1px dashed #000;
}
.footer_css div ul li a {
display:block;
color:#FFF;
text-decoration:none;
}
.footer_css div ul li a:hover {
color:#000;
}
/*نهاية الكود code*/
</code> </code>

ملاحظة هذا الكود code يتم من خلالة تغير لون الخلفية ولون الخطوط وسمكها وانواعها

ونروح على لوحة تحكم المنتدى forum
استايل styleات القوالب >> التحكم بلاستايل styleات >> نختار الاستايل style المراد التعديل عليه >> ثم من القائمة نختار رئيسي css
وننزل تحت نلاقي اضافاتcss
وننسخ الكود code اسفله >>>>> تابع بالصووور افضل

الصورة رقم 1

http://upload.dzbatna.net/upfiles/IxT37883.gif (http://www.free4des.com/vb/showthread.php?t=17)
الصورة رقم 2

http://upload.dzbatna.net/upfiles/VEu38678.gif (http://www.free4des.com/vb/showthread.php?t=17)




============== خلصنا من كود code css ===========

ثاني نيجي لكود code html الكود code مهم جدا والتعديل عليه

اول شي نشوف الكود code
رمز PHP:

<code style="white-space:nowrap"> <code> <!--www.free4des.com/vb-->
<div class="footer_css">

<div>
<h3><img style="vertical-align:middle" alt="footer" src="free4des/1311066917_arrow-right.png" />اقسام المنتدى forum</h3>
<ul>
<li><a href="http://www.free4des.com/vb/forumdisplay.php?f=76">قسم البرامج العامة</a></li>
<li><a href="http://www.free4des.com/vb/forumdisplay.php?f=3">القسم الإسلامي</a></li>
<li><a href="http://www.free4des.com/vb/forumdisplay.php?f=4">قسم الصور والانميشن</a></li>
<li><a href="http://www.free4des.com/vb/forumdisplay.php?f=80">ثسم العاب pc والبلاستيشن</a></li>
<li><a href="http://www.free4des.com/vb/forumdisplay.php?f=77">قسم الجوال والموبايل</a></li>
</ul>
</div>

<div>
<h3><img style="vertical-align:middle" alt="footer" src="free4des/1311066917_arrow-right.png" />اقسام المنتدى forum</h3>
<ul>
<li><a href="http://www.free4des.com/vb/forumdisplay.php?f=33">قسم الفوتوشوب وملحقاته PhotoShop</a></li>

<li><a href="http://www.free4des.com/vb/forumdisplay.php?f=83">قسم ملحقات الفوتوشوب</a></li>
<li><a href="http://www.free4des.com/vb/forumdisplay.php?f=34">السويتش ماكسSWiSH Max, والفلاش </a></li>
<li><a href="http://www.free4des.com/vb/forumdisplay.php?f=37">شروحات التصميم بتقنية css </a></li>
<li><a href="http://www.free4des.com/vb/forumdisplay.php?f=40">قسم استايل styleات Free4des المجاني freeة </a></li>
</ul>
</div>

<div>
<h3><img style="vertical-align:middle" alt="footer" src="free4des/1311066917_arrow-right.png" />اقسام المنتدى forum</h3>
<ul>
<li><a href="http://www.free4des.com/vb/forumdisplay.php?f=39">قسم تطوير المنتديات فيبويلتن في بي vBulletin</a></li>
<li><a href="http://www.free4des.com/vb/forumdisplay.php?f=41">قسم علم الأرشفة indexation ومحركات البحث والـ SEO </a></li>
<li><a href="http://www.free4des.com/vb/forumdisplay.php?f=86">قسم الملفات المفتوحة)( flash</a></li>

<li><a href="http://www.free4des.com/vb/forumdisplay.php?f=85">قسم الصور وايقونات الفوتوشوب</a></li>
<li><a href="http://www.free4des.com/vb/forumdisplay.php?f=90">قسم برامج التصميم</a></li>
</ul>
</div>




<div>
<h3><img style="vertical-align:middle" alt="footer" src="free4des/1311066917_arrow-right.png" />التبادل النصي</h3>
<ul>
<li><a href="http://www.free4des.com/vb">رابـــط نصــي</a></li>
<li><a href="http://www.free4des.com/vb">رابـــط نصــي</a></li>
<li><a href="http://www.free4des.com/vb">رابـــط نصــي</a></li>
<li><a href="http://www.free4des.com/vb">رابـــط نصــي</a></li>
<li><a href="http://www.free4des.com/vb">رابـــط نصــي</a></li>
</ul>
</div>
<a class="copyrights" href="http://www.free4des.com/vb/">free4des</a>

</div>
<!--www.free4des.com/vb-->
</code> </code>

محنا شايفني هي الكود code
اشرح طريقةلكم كيف تعديل اسماء الاقسام منتداكم والروابط
مع انها سهلة ما تبي شرح طريقة بس نشرح طريقةها
مثال
رمز PHP:

<code style="white-space:nowrap"> <code> <li><a href="http://www.free4des.com/vb">رابـــط نصــي</a></li>
</code> </code>

في كلمة
( الرابط النصي ) نكتب اسم المنتدى forum المعلن مثلا
( http://www.free4des.com) رابط المنتدى forum المعلن على سبيل المثال

انتهينا من التعديل

ولكن ملاحظة لن اسامح اي شخص يحذف الحقوق

نيجي لشرح طريقة التركيب install
تابع الصور ...
http://upload.dzbatna.net/upfiles/czV39021.gif (http://www.free4des.com/vb/showthread.php?t=17)




تحياتي لكم
مقدم الشرح طريقة اخوكم حاتم

لتحميل الشرح طريقة والكود code في المرفقات
تحياتي لكم


ولا تنسو ++

عند النقل يرجى ذكر المصدر

المصدر: منتديات التصميم الحر ( free design (http://www.free4des.com/vb) - من قسم: شروحات التصميم بتقنية css (http://www.free4des.com/vb/forumdisplay.php?f=37)









ألعاب الأندرويد مجانا و حصريا (http://www.apotox.info/forum)

الملفات المرفقة
http://www.traidnt.net/vb/images/attach/zip.gif footer-css.zip (http://www.traidnt.net/vb/attachments/588604d1311139529-footer-css.zip) (85.2 كيلوبايت, عدد مرات المشاهدة 75 مرة)


https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©

استعمل مربع البحث في الاسفل لمزيد من المواضيع


سريع للبحث عن مواضيع في المنتدى