إضافات ملاحظات بشكل جديد إلي منصة بلوجر

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

معاينة الإضافة إضغط هنا

شرح تركيب الإضافة :

1. أولا من لوحة تحكم القالب ثم إلي قسم القالب وبالضغط HTML
2. بعد هذا قم بالبحث في القالب عن هذا الوسم ]]></b:skin>
3. وقم بوضع الكود التالي فوقه

.info, .tips, .warning {
 line-height: 22px;
 min-height: 38px;
 padding: 10px 12px 12px 68px;
 margin: 5px 0;
  font-family: 'droid-sans';
font-size: 16px;
}
.info {
 background: #e0e5eb url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0fajtrJyR5j1giHr_8CdJbPkuvZsjh5IIjmHQ4XAllnPo4wWMraRmEf7SZ3J8jVzkwGnw9nZx5Zp0c9lcc7x6I1Y4f-uJVscmT0h8Mh3jSgRuVWL4QVz53hzNSK3h5ZMfHMoHojWihhM/s1600/info.png') no-repeat 12px 8px;
 color: #222
}
.tips {
 background: #7CADDE url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiArUvhjK8qNPepAupizAb0nZC9G2ldiMSh81Lyq1t3bQIPLuY6yYUiOCRVw8dqx5sjmLjqXjuLiPACRohkgza9aEuu2qnQAzNvb8GUaVglYZ9LIZo5fWK4LWQSpBLE2gjQTLl8uS7Q4Lw/s1600/tips.png') no-repeat 12px 8px;
 color: #fff;
}
.warning {
 background: #db6161 url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVINuPD_xPHkvGXvDw4Fd1QzIlxJ5qXCwe1HkPQIRcs2DOeD8oOOk6vVxDjpBWiPQNJOdW0jcifw8Lna1ypjPZKUKtZ3y1yQcYbQL18k_sZuWQ6RFtyXrH3eyN1sKCOQ6vndNj3LBpDbY/s1600/warning.png') no-repeat 12px 8px;
 color: #fff;
}

1.  وقم بوضع الكود التالي قبل هذا الوسم  </head>

<link rel="stylesheet" type="text/css" href="//www.fontstatic.com/f=droid-sans" />

1. عندما تقوم بالعمل تدوينة إذهب إلي تبويب HTML 
2. وقم بوضع الأكواد التالية في التبويب

 <div class='info'>
هذا النص هو مثال لنص يمكن أن يستبدل في نفس المساحة</div>

<div class='tips'>
هذا النص هو مثال لنص يمكن أن يستبدل في نفس المساحة</div>


<div class='warning'>
هذا النص هو مثال لنص يمكن أن يستبدل في نفس المساحة</div>

1. وقم بالتغير ما هو باللون الأحمر.

إلي اللقاء في تدوينة جديدة.