 |
| اضافة ازرار معاينة و تحميل احترافية و تأطير خرافي للعناوين بداخل المشاركات |
السلام عليك متابعي وجدان للعلوميات بدون مقدمات طويلة و كتابة كثيرة اليوم سنقدم لكم اضافتين احترافيتين الاولى عبارة عن ازرار التحملي و المعاينة احترافية بشكلين
الاضافة الثانية عبارة عن تأطير و زخرفة العناوين بداخل المشاركات و المواضيع فقط ليبدو شكل مقالتك جميل و يسهل على القارئ فهمهما من خلال ظهور العناوين و تقيسمها
اضافة ازرار التحميل و المعاينة :
الشكل 1:
تركيب ازرار الشكل 1: ادخل لتحرير القالب و اضف الكود التالي فوق ]]></b:skin>
/* ====== Buttons wejdane ====== */
.ibtn{-webkit-border-radius:5px;border-radius:5px;display:inline-block;vertical-align:top;margin:5px;border:1px solid rgba(0,0,0,0.05);-webkit-transition:.2s ease-out;-o-transition:.2s ease-out;transition:.2s ease-out;-webkit-box-shadow:0 2px 2px 0 rgba(0,0,0,0.16), 0 0 0 1px rgba(0,0,0,0.08);box-shadow:0 2px 2px 0 rgba(0,0,0,0.16), 0 0 0 1px rgba(0,0,0,0.08);text-shadow:1px 1px 0 rgba(0,0,0,0.1);font-family:postFont ,AltFont!important}
.ibtn:hover{-webkit-box-shadow:0 3px 15px rgba(0,0,0,0.25), 0 3px 6px rgba(0,0,0,0.25);box-shadow:0 3px 15px rgba(0,0,0,0.25), 0 3px 6px rgba(0,0,0,0.25)}
.ibtn-1{padding:10px 15px;font-size:16px}
.ibtn-2{padding:10px 25px;font-size:17px}
.ibtn-3{padding:15px 30px;font-size:20px}
.ibtn-4{padding:20px 35px;font-size:24px}
.iDown:before{content:"\f0ed";font-family:fontAwesome;display:inline-block;vertical-align:top}
.rtl .iDown:before{padding-left:10px}
.ltr .iDown:before{padding-right:10px}
.iDown.ibtn-1:before{font-size:24px}
.iDown.ibtn-2:before{font-size:25px}
.iDown.ibtn-3:before{font-size:28px;font-size:31px}
.iPrev:before{content:"\f002";font-family:fontAwesome;display:inline-block;vertical-align:top}
تركيب ازرار الشكل 1: اضف الكو د التالي بداخل المشاركات بداخل كود html الخاص بالمشاركة
<div style="text-align: center;">
<a class="ibtn1 iDown ibtn-1" href="#" rel="nofollow" style="background-color: #212669; color: white;" target="_blank">تحميل</a>
<a class="ibtn1 iDown ibtn-1" href="#" rel="nofollow" style="background-color: #212669; color: white;" target="_blank">تحميل</a>
<a class="ibtn1 iDown ibtn-1" href="#" rel="nofollow" style="background-color: #212669; color: white;" target="_blank">تحميل</a>
</div>
تخصيص لون و شكل الازرار :
يمكنك التحكم في لون الازار و لن النص بداخل الازرار كما شئت من خلال تغيير قيمة :
4 -background-color: #212669 لتغيير لون الازرار
5 -color: white لون الخط على الازرار
3- لتغيير حجم الازرار ضع احد هذه القيم ibtn-1 = صغر , ibtn-2 = متوسط , ibtn-3 = كبير , ibtn-4 = كبير جدا
2- اتركه كما هو
2- اتركه كما هو
1- لتغيير شكل الزرار مقوسة الحواف او حادة و متسطيلة ibtn = ازرار مقوسة الحواف , ibtn-1 = ازرار حادة و مستطيلة مثل الشكل التالي :
اضافة تأطير احترافي للعناوين بداخل المشاركات :
تركيب الاضافة : اذهب لتحرير القالب و نضع الكود التالي فوق ]]></b:skin> مباشرة
.post h4{border-right:7px solid #0561fc;border-left:7px solid #0561fc;padding:10px 15px;background:#f7f7f7;margin:10px 0;border-radius:5px;box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23)}
لجعل اي عنوان يظهر مزخرف يجب عليك تحديده بداخل المشاركة ووضع قيمته كعنوان ثانوي من خلال لوحة الادوات في الاعلى
صورة توضيحية
