إضافة صندوق المتابعة والإنضمام للمدونة في بلوجر 4 في 1

إعلان أدسنس

آخر المواضيع

breaking/اضافات/9
كل

الأحد، 22 أكتوبر 2017

أكتوبر 22, 2017

تكبير النص تصغير النص أعادة للحجم الطبيعي

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


أسعد الله أوقاتكم بكل خير أحبابي في الله وأهلا ومرحبا بكم مجددا على مدونتكم العربي ويب
نقدم لكم اليوم إضافة من أقوى وأفضل إضافات بلوجر بمميزاتها الأكثر من رائعة هذه الإضافة عبارة عن صندوق المتابعة والإنضمام للمدونة في بلوجر 4 في 1، اضافة رائعة تغنيك عن الكثير من الاضافات مثل : المتابعة عبر فيس بوك وتويتر وجوجل بلس والإنضمام للمدونة ...

صورة الاضافة

يمكنك معاينة الاضافة مباشرة على مدونتي بالسيدبار


خطوات إضافة صندوق المتابعة والإنضمام للمدونة في بلوجر


تابع معي ...


أولا - توجه الى لوحة تحكم مدونتك  من هنا 
2 - قالب (المظهر) >> تحرير HTML >>

3 - إبحث عن الوسم التالي بالضغط على Ctrl + F
]]></b:skin>
4 - ثم أضف الكود التالي فوقه مباشرة
/* About Me */#HTML68 .aboutind-info h4{background:transparent;position:relative;padding:0;margin:0;border:0;text-align:center;font-size:120%}.aboutind-img{position:relative;max-height:140px;overflow:hidden}.aboutind-img img {max-width:100%;width:100%;transition:all .6s;}.aboutind-img:hover img{transform:scale(1.2) rotate(-10deg)}.aboutind-img:before{content:'';background:rgba(0,0,0,0.3);position:absolute;top:0;right:0;left:0;bottom:0;z-index:2;transition:all .3s}.aboutind-img:hover:before{background:rgba(0,0,0,0.6);}.aboutfloat-img{width:55%;position:absolute;top:35%;bottom:35%;right:22.5%;z-index:3}.aboutind-float{text-align:center;display:table;width:100%;height:100%}.aboutind-float a{background:rgba(243,156,18,.95);color:#fff;padding:8px 14px;z-index:2;display:table-cell;width:100%;font-size:67%;font-weight: 700;text-transform:uppercase;vertical-align:middle;border-radius:3px;transition:all .3s}.aboutind-float:hover a{background:#404040;color:#fff;}.aboutind-float a i{font-weight:normal;margin:0 0 0 5px}.aboutind-wrpicon{display:block;margin:15px auto;position:relative;}.aboutind-wrpicon .extender{width:100%;display:block;}.extender{text-align:center;font-size:16px}.extender .aboutind-icon{display:inline-block;border:0;margin:0;padding:0;width:32%;}.extender .aboutind-icon a{background:#ccc;display:inline-block;font-weight:400;color:#fff;padding:0 12px;line-height:32px;border-radius:3px;font-size:12px;width:100%;}.extender .aboutind-icon i{font-family:fontawesome;margin:0 0 0 3px}.aboutind-icon.fbl a{background:#3b5998}.aboutind-icon.twitt a{background:#19bfe5}.aboutind-icon.crcl a{background:#d64136}.aboutind-icon.fbl a:hover,.aboutind-icon.twitt a:hover,.aboutind-icon.crcl a:hover{background:#404040}.extender .aboutind-icon:hover a,.extender .aboutind-icon a:hover{color:#fff;}.aboutind-info{margin:10px 0 0 0;font-size:13px;text-align:center;}.aboutind-info p{margin:5px 0}.aboutind-info h4{margin-bottom:10px;font-size:16px;text-transform:uppercase;color:#444;font-weight:700}.aboutind-info h4 span {position:relative;display:inline-block;padding:0 10px;margin:0 auto;}.aboutind-info h4:before,.aboutind-info h4:after {position:absolute;top:51%;overflow:hidden;width:50%;height:1px;content:'\a0';background-color:rgba(0,0,0,0.08);}.aboutind-info h4:before {margin-right:-50%;text-align:left;}
5 - إبحث عن هذا الوسم
<div id='sidebar-wrapper'>
6 - وأضف الكود التالي أسفله
          <b:widget id='HTML68' locked='false' mobile='no' title='إنضم إلينا' type='HTML'>            <b:includable id='main'>  <!-- only display title if it's non-empty -->  <b:if cond='data:title != &quot;&quot;'>    <h2 class='title'><data:title/></h2>  </b:if>  <div class='widget-content'><div class='sidebar_about_author'><div class='inner_wrapper'><div class='aboutind-img'><img alt='العربي ويب' class='img-responsive' height='auto' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLDOm4Piyv3SYOPNVobWWEcicpAgyluG6xUV9_cqaufrslXK1I0HSMQiuX90lp96ybcC_eLJybWGTNx-NQkc-AurQPgK7igcSWbBX9TpvLeMZh527Mop_T1lUKOWb84b5GXp0hZi-80vE/s1600/florian-de-looij-4+%25281%2529.gif' title='Indzign' width='300'/><div class='aboutfloat-img'><span class='aboutind-float'><a href='https://www.blogger.com/follow-blog.g?blogID=8827414525251920223' rel='nofollow' target='_blank' title='انضم لأصدقاء الموقع'><i class='fa fa-user'/> انضم لأصدقاء الموقع</a></span></div></div></div><div class='aboutind-info'><h4><span>العربي ويب</span></h4><p>مدونة تهتم بكل ما هو جديد في عالم التقنية وأخبار الويب</p><p>انضم الينا لمتابعة جديدنا</p></div><div class='aboutind-wrpicon'><ul class='extender'><li class='aboutind-icon fbl'><a href='//www.facebook.com/mahwouss2' rel='nofollow' target='_blank' title='تابعنا على فيسبوك'><i class='fa fa-facebook fa-fw'/> أعجبني</a></li><li class='aboutind-icon twitt'><a href='//twitter.com/el3arabyweb' rel='nofollow' target='_blank' title='تابعنا على تويتر'><i class='fa fa-twitter fa-fw'/> متابعة</a></li><li class='aboutind-icon crcl'><a href='//plus.google.com/u/0/+Mohamedkhan1' rel='nofollow' target='_blank' title='انضم لنا على جوجل+'><i class='fa fa-google-plus fa-fw'/> إنضمام</a></li></ul></div></div></div></b:includable>          </b:widget>
خطوات لتعديل وتخصيص الاضافة

إستبدل الرابط الملون بالبنفسجي برابط صورة تناسبك
إستبدل الرابط الملون بالاخضر بالـ ID الخاص بمدونتك
إستبدل الرابط الملون بالأزرق برابط صفحتك في فيس بوك
إستبدل الرابط الملون بالأزرق الفاتح برابط صفحتك في تويتر
إستبدل الرابط الملون بالأحمر برابط صفحتك في جوجل بلس
إستبدل الجملة الملونة بالبرتقالي بما يناسبك

تم بحمد الله ...

أي أسئلة أو إستفسار حول الموضوع لا تتردد في طرحها
باب التعليقات مفتوح للجميع

إرسال تعليق

كل