معهد خبراء بلوجر - كيفية اضافة/اضهار رسالة منبتقة في مدونات بلوجر

http://1.bp.blogspot.com/-5pUcAK3vyH...or-blogger.jpg

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

معاينة حية لهده الاضافة

لا يمكن اضافة اكواد
لدالك بامكانك المعاينة في المدونة
http://www.arab-teck.com/2012/09/blog-post.html

طريقة اضافة الاداة

اول شيء ادهب الى واجهة بلوجر>>التخطيط>>اضافة اداة

اختر HTML/Javascript تم ادخل الكود اسفله
<span style="font-size: large;">معاينة حية لهده الاضافة</span></h3>

كود بلغة HTML:

 <style type="text/css">

.btnLogin{



    -moz-border-radius:2px;



    -webkit-border-radius:2px;



    border-radius:15px;



    background:#a1d8f0;



    background:-moz-linear-gradient(top, #badff3, #7acbed);



    background:-webkit-gradient(linear, center top, center bottom, from(#badff3), to(#7acbed));



    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#badff3', EndColorStr='#7acbed')";



    border:1px solid #7db0cc !important;



    cursor: pointer;



    padding:11px 16px;



    font:bold 11px/14px Verdana, Tahomma, Geneva;



    text-shadow:rgba(0,0,0,0.2) 0 1px 0px;



    color:#fff;



    -moz-box-shadow:inset rgba(255,255,255,0.6) 0 1px 1px, rgba(0,0,0,0.1) 0 1px 1px;



    -webkit-box-shadow:inset rgba(255,255,255,0.6) 0 1px 1px, rgba(0,0,0,0.1) 0 1px 1px;



    box-shadow:inset rgba(255,255,255,0.6) 0 1px 1px, rgba(0,0,0,0.1) 0 1px 1px;



    margin-center:12px;



    float:center;



    padding:7px 21px;



}





.btnLogin  : hover,



.btnLogin::focus,



.btnLogin : active{



    background:#a1d8f0;



    background:-moz-linear-gradient(top, #7acbed, #badff3);



    background:-webkit-gradient(linear, center top, center bottom, from(#7acbed), to(#badff3));



    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#7acbed', EndColorStr='#badff3')";



}



.btnLogin:active{



    text-shadow:rgba(0,0,0,0.3) 0 -1px 0px;



}

</style>

<!-- Start of Message Alert -->

<!-- Use this button in a form to pop-up a message when the user clicks it -->

<br />

<center>

<form>

<input  class="btnLogin" onclick="alert('هده الاضافة حصرية بمدونة التقنية  العربية www.arab-teck.com'); return true" type="button" value="اضغط هنا"  />

</form>

</center>

<!-- End of Message Alert -->

تخصيص الاضافة او التعديل عليها

عوض اضغط هنا بما تريد ان يضهر بواجهة الزر

عوض هده الاضافة حصرية بمدونة التقنية العربية www.arab-teck.com برسالتك الخاصة

لاتنسوا مشاركة الموضوع

المصدر
http://www.arab-teck.com