ازرار ملونة متعددة الإستخدام جاهزة لمدونتك

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

 

اقدم لكم اليوم مجموعة فاخرة من الازرار المصممة بصيغة css يمكنكم إستعمالها كازرار تحميل ومعاينة وروابط خارجية او داخلية خفيفة وسهلة الإستخدام

 

 

طريقة إستخدام هذه الازرار في مدونتك

أولاً إذهب غلى لوحة التحكم في مدونتك ثم القالب ثم إضغط على تحرير html
 ثم أضف الرمز التالي فوق الرمز  </head> مباشرةً

<link href="https://cdn.staticaly.com/gh/mohammedxx/madad2/master/btn.min.css" rel="stylesheet" media="screen"/>

الآن يمكنك إستخدام أي زر ترغب في على مدونتك من خلال المعرف الخاص به
ويمكنك نسخ جميع الأزرار التالية وحفظها كمسودة في مدونتك لإستعمالها في وقت لاحق:


<a class="btn" href="https://tech-weba.com/" target="_blank"> رابط</a>
<a class="btn btn-primary" href="https://tech-weba.com/" target="_blank"> رابط</a>
<a class="btn btn-info" href="https://tech-weba.com/" target="_blank"> رابط</a>
<a class="btn btn-success" href="https://tech-weba.com/" target="_blank"> رابط</a>
<a class="btn btn-warning" href="https://tech-weba.com/" target="_blank"> رابط</a>
<a class="btn btn-danger" href="https://tech-weba.com/" target="_blank"> رابط</a>
<a class="btn btn-inverse" href="https://tech-weba.com/" target="_blank"> رابط</a>
 

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-large" type="button">زر كبير</button></a>

<button class="btn btn-large btn-primary" type="button"><a href="https://tech-weba.com/" target="_blank">زر كبير</a></button>

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-large  btn-info" type="button">زر كبير</button>  </a>

<a href="https://tech-weba.com/" target="_blank"><button button="" class="btn btn-large  btn-success type="><span class="">زر كبير</span></button></a>

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-large  btn-warning" type="button">زر كبير</button></a>

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-large  btn-danger" type="button"><span class="">زر كبير</span></button></a>

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-large  btn-inverse" type="button"><span class="">زر كبير</span></button></a>

<a href="https://tech-weba.com/" target="_blank"><button class="btn" type="button">الزر الافتراضي</button></a>

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-primary" href="google.com" type="button">الزر الافتراضي</button></a>

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-info" type="button">الزر الافتراضي</button></a>

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-success" type="button">الزر الافتراضي</button></a>

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-warning" type="button"><span class="">الزر الافتراضي</span></button></a>

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-danger" type="button"><span class=""><span class="">الزر الافتراضي</span></span></button></a>

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-inverse" type="button">الزر الافتراضي</button></a>

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-small" type="button">زر صغير</button></a>

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-small btn-primary" type="button">زر صغير</button></a>

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-small  btn-info" type="button">زر صغير</button></a>

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-small  btn-success" type="button">زر صغير</button></a>

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-small  btn-warning" type="button"><span class="">زر صغير</span></button></a>

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-small  btn-danger" type="button">زر صغير</button></a>

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-small  btn-inverse" type="button">زر صغير</button></a>

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-mini" type="button"><span class="">زر صغير</span></button></a>

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-mini btn-primary" type="button">زر صغير</button></a>

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-mini btn-info" type="button">زر صغير</button></a>

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-mini btn-success" type="button">زر صغير</button></a>

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-mini btn-warning" type="button">زر صغير</button></a>

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-mini btn-danger" type="button">زر صغير</button></a>

<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-mini btn-inverse" type="button">زر صغير</button></a>


طبعا كل زر له معرف خاص به كما هو مشار إليه في الكود السابق btn btn-small btn-primary
يمكن أختيار أي زر في وقت لاحق وإضافته في مدونتك ليصبح بهذا الشكل




فقط أنسخ المعرف الخاص به او الرابط كله ثم عدل عليه:


<a href="https://tech-weba.com/" target="_blank"><button class="btn btn-large" type="button">زر كبير</button></a>
 

أتمنى أن تحوذ إعجابكم وإذا كان هناك أي إستفسار على كيفية إستخدامها لا تتردد في ترك تعليق يمكننا تحديث الموضوع في أي وقت 🙂