4 0 4
نعتذر , لا نستطيع ايجاد الصفحة المطلوبة الصفحة الرئيسية

الأربعاء، 13 أبريل، 2016


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


تركيب الإضافة 

اولا قم بأخذ نسخة احتياطية من قالب مدونتك لنجنب حدوث اى مشكلة .

1- قم بالبحث فى قالب مدونتك على الوسم </head> وقم بوضع فوقه الكود التالى ( قبلة )

<link href='//maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css' rel='stylesheet'/>


2- قم بالبحث عن الوسم ]]></b:skin> وقم بوضع فوقه الكود التالى ( قبلة )

/* Sosial Media Widget */
.sosmedarl-img{position:relative;max-height:140px;overflow:hidden}
.sosmedarl-img img {max-width:100%;width:100%;transition:all .6s;}
.sosmedarl-img:hover img{transform:scale(1.2) rotate(-10deg)}
.sosmedarl-img:before{content:'';background:rgba(0,0,0,0.3);position:absolute;top:0;left:0;right:0;bottom:0;z-index:2;transition:all .3s}
.sosmedarl-img:hover:before{background:rgba(0,0,0,0.6);}
.aboutfloat-img{width:55%;position:absolute;top:35%;bottom:35%;left:22.5%;z-index:3}
.sosmedarl-float{text-align:center;display:table;width:100%;height:100%}
.sosmedarl-float a{background:transparent;color:#fff;padding:8px 14px;z-index:2;display:table-cell;width:100%;font-size:90%;text-transform:uppercase;vertical-align:middle;border:2px solid #fefefe;border-radius:3px;transition:all .3s}
.sosmedarl-float:hover a{background:#e74c3c;color:#fff;border-color:transparent;}
.sosmedarl-float a i{font-weight:normal;margin:0 5px 0 0}
.sosmedarl-wrpicon{display:block;margin:15px auto;position:relative;}
.sosmedarl-wrpicon .extender{width:100%;display:block;}
.extender{text-align:center;font-size:16px}
.extender .sosmedarl-icon{display:inline-block;border:0;margin:0;padding:0;width:32%;}
.extender .sosmedarl-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 .sosmedarl-icon i{font-family: 'Droid Arabic Kufi',serif;margin:0 3px 0 0;margin-top: 10px;text-decoration: none;}
.sosmedarl-icon.fbl a{background:#3b5998}
.sosmedarl-icon.twitt a{background:#19bfe5}
.sosmedarl-icon.crcl a{background:#d64136}
.sosmedarl-icon.fbl a:hover,.sosmedarl-icon.twitt a:hover,.sosmedarl-icon.crcl a:hover{background:#404040}
.extender .sosmedarl-icon:hover a,.extender .sosmedarl-icon a:hover{color:#fff;text-decoration: none;}
.sosmedarl-info{margin:10px 0 0 0;font-size:13px;text-align:center;}
.sosmedarl-info p{margin:5px 0;font-family: 'Droid Arabic Kufi',serif;}
.sosmedarl-info h4{margin-bottom:10px;font-size:16px;text-transform:uppercase;color:#444;font-weight:700}
.sosmedarl-info h4 span {position:relative;display:inline-block;padding:0 10px;margin:0 auto;font-family: 'Droid Arabic Kufi',serif;}
.sosmedarl-info h4:before,.sosmedarl-info h4:after {position:absolute;top:51%;overflow:hidden;width:50%;height:1px;content:'\a0';background-color:rgba(0,0,0,0.08);}
.sosmedarl-info h4:before {margin-left:-50%;text-align:right;}

3- الأن الكود الأخير فى الإضافة وهذا الكود يتم وضعه فى أداة HTML/JavaScript من التخطيط

<!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></data:title></h2>
  </b:if>
  <div class='widget-content'>
<div class='sidebar_about_author'>
<div class='inner_wrapper'>
<div class='sosmedarl-img'>
<img alt='Judul Blog' class='img-responsive' height='auto' src='https://4.bp.blogspot.com/-FvpegXpczOQ/VuyAZaQJcaI/AAAAAAAAQ-8/ML97ym9O0hAy2CJgKp91TMZlh-TP26s2w/s1600/1.jpeg' title='Judul Blog' width='300'/>
<div class='aboutfloat-img'><span class='sosmedarl-float'><a href='#' rel='nofollow' target='_blank' title='Join Our Site'><i class='fa fa-user'/> الأنضمام لأعضاء المدونة</i></a></span></div>
</div>
</div>
<div class='sosmedarl-info'>
  <h4><span>أنضم إلينا</span></h4>
<p>للحصول على كل جديد المدونة</p>
</div>
<div class='sosmedarl-wrpicon'>
<ul class='extender'>
<li class='sosmedarl-icon fbl'><a href='#' target='_blank' title='تابعنا على الفيسبوك'><i class='فيسبوك'/>فيسبوك</i></a></li>
<li class='sosmedarl-icon twitt'><a href='#' target='_blank' title='تابعنا على تويتر'><i class='تويتر'/>تويتر</i></a></li>
<li class='sosmedarl-icon crcl'><a href='#' rel='nofollow' target='_blank' title='تابعنا على جوجل بلس'><i class='جوجل بلس'/>جوجل بلس</i></a></li>
</ul>
</div>
</div>
</div>

4- يمكن التعديل على الكلمات التى فى الإضافة بالذى تردها ويمكنك ايضا تغيير صورة الخلفية .

والى هنا ينتهى الشرح اذا واجهتك اى مشكلة فى تركيب الإضافة او تريد التعديل على اى شئ ، فباب التعليقات مفتوح لا تتردد ! وادعمنا بمشاركة التدوينة ليستفيد منها الجميع :)

شارك التدوينه
تنبية هام

هناك 6 تعليقات :

  1. اضافة جمل اخي تابع الله يوفقك

    ردحذف
  2. هدا واجب اخي تستهل اكتر والله انت على راسي

    ردحذف
    الردود
    1. العفو اخى انت بكلمك هذا تفرحتى كثيرا شكرا لك

      حذف
  3. اخي انت مانع النصخ في المدونة كيف احصل على الأكواد

    ردحذف
    الردود
    1. اضغط مرتين على الكواد لتحديدها ثم اضغط ctrl + c لنسخها

      حذف

شارك بتعليق على

مواقع صديقة سوف تفيدك
brief useful MAX SEO TOOLS ضع موقعك هنا ضع موقعك هنا ضع موقعك هنا ضع موقعك هنا ضع موقعك هنا ضع موقعك هنا ضع موقعك هنا ضع موقعك هنا ضع موقعك هنا ضع موقعك هنا
ALL RIGHTS RESERVED, 2016 WDBLOOG , POWERED BY BLOGGER , DESIGN BY WDBLOOG