ضع الاكواد بطريقه إحترافية




بسم الله الرحمن الرحيم



موضوع اليوم إن شاء الله سيكون عن كيفية وضع أكواد الإضافات و غيرها في مدونتك بطريقة إحترافية و في نفس الوقت جميلة و أنيقة. فقد كنت دكرت إحدى الطرق في المدونة لكن هذه الطريقة ستكون أشمل ينكنك الإطلاع على الطريقة السابقة من هنا كيف تضيف أكواد HTML إلى تدويناتك





المرحلة الأولى: إدراج صناديق الأكواد في المدونة

الأن يجب عليك إختيار نوع الصندوق اللذي ترغب به من بين هذه الخيارات الأربعة، عندما تجد الشكل اللذي يعجبك قم بلصق الكود الخاص به فوق الوسم التالي ]]></ B: skin> مباشرة.

1- الشكل الأول


الكود الخاص بة

الرمز:
.code {
margin : 15px 35px 15px 15px;
padding : 10px;
clear : both;
list-style-type : none;
background : #f9f9f9 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfBSpNnymzBa0oMEQvQ-2lw26AKuoQ6ERWJ0u_lvk-6RmrtaSWA7qMRGPWHK3pmmK2_W3L8iz4NrzzbcXCgOFaIeqlCfIUM3j6kOSjOsBIGchDXySvLQy9IaYSyYrbS1Crlhz1jI3ed40/s1600/codeview1.gif) no-repeat right bottom;
border : 2px solid #eeeeee;
color : #7D7D7D;
}


الشكل الثانى



الكود الخاص بة

الرمز:

.code {
margin : 0 20px;
padding: 70px 20px 20px 40px;
background : #F9F9F9 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLhjDNh_U9dkzRizUIwEtsjESiHKJcVf7HsGyqiAmjP6M76chZXNBgtjIZyKF0mJHsYn3j_xfpsaDt-bSzwcv8Oc8NFJyahfKIR1sTv27_-_qTLSXzESKpQQbDFnfV1g7rZlpLTlSvAg4/s1600/codeview3.gif) no-repeat top left;
font: bold 1em Helvetica, verdana, Georgia, "Times New Roman", Times, serif;
color : #000;
border-bottom : 5px solid #BFBFBF;
}


المرحلة الثانية: تخصيص صندوك الأكواد الخاص بك



فس هذه المرحلة ستتمكن من تغير الألوان الخاصة بهذا الصندوق لتضع به الألوان التي تناسبك أو تناسب مدونتك، هذه المرحلى ليست بظرورية يمكنك التخلي عنها.

لكن إن كنت من الأشخاص اللذين يحبون وضع لمستهم الشخصية على الأشياء فتابع الطريقة.

اللون: خلفية الإطار الرئيسي

اللون: لون النص

اللون: لون الحدود

المرحلة الثالثة: كيف تجعل الصندوق يظهر بالشكل المطلوب

وصلنا إلى المرحلة النهائية و هي بسيطة للغاية، كل ما عليك الأن فعله هو وضع كود بسيط في مقالاتك و سترى الشكل اللذي إخترته يظهر لك على صفحات مدونتك. هذا الكود يجب أن يوضع في تحريرHTML و ليس تأليف كما هو موضح في الصورة.




و هذا هو الكود الخاص بالإضافة

الرمز:
<div class="code"> كود الإضافات ستقوم بكتابته هنا</div>

0 التعليقات:

إرسال تعليق

Twitter Delicious Facebook Digg Stumbleupon Favorites More