أضافة أداة تعريف صاحب الموقع لمدونات بلوجر

الكثير من المدونين لديهم مواقع الألكترونية وقد يرغبون بعمل تشهير لأنفسهم بشتى الطرق والوسائل وخصوصأ اولائك الأشخاص الذين لديهم خبرة في مجال تصنيع القوالب,حيث يكونو أكثر الأشخاص الذين يرغبون بعرض أعمالهم ونشاطهم أمام الزوار,ونحن في صدد ذلك قدمنا هذه المقالة للأشخاص الذين يرغبون بعرض موهبتهم عن طريق أضافة صندوق الكاتب الذي يعرض كل شي عن المدون وكذلك تعريب صاحب المدونة أو الموقع.
تتميز هذه الأضافة بكونها سهلة وبسيطة جدأ في عملها وهي مجرد كود تقوم بوضعة في أداة HTML/Java Script ولاتحتاج الى خبرة كبيرة,وتمتاز هذه الأضافة بكونها سهلة جدا ومتوافقة مع الاجهزة الذكية وقد تنال أعجابك كثيرأ.

معاينة الأضافة

طريقة تركيب أداة تعريف الكاتب أو صاحب الموقع للمدونة

1-توجة الى لوحة تحكم بلوجر وأختر التخطيط
2-من التخطيط أختر أداة جديدة
3-بعد أختيار أداة جديدة قم بأضافة أداة HTML/Java Script
4-بعد أختيار أضافة HTML/Java Script قم بنسخ ولصق الكود التالي في أداة HTML/Java Script

<div class='iuauthor-item'>
<div class='image-wrap'>
<img class='img-circle author_avatar img-responsive' src='https://e.top4top.net/p_685k21si2.jpg'/>
</div>
<h4 class='iuauthor-name'>
<a href='https://www.facebook.com/gsffj89' target='_blank'>بلوغر بالعربي</a>
<p>
مدون و مصمم  عربي مواليد 1994 صاحب موقع "بلوغر بالعربي " هدفى هو نشر جميع المواضيع فى شتى مجالات بلوجر عبر موقعي الى المحتوى العربي </p>
</h4>
</div>
<style>
/*------------------------------------------------------
Iuauthor-Item
------------------------------------------------------*/
.iuauthor-item {
padding: 15px 10px;
text-align: center;
margin-top: -20px;
}
.iuauthor-item .image-wrap {
position: relative;
overflow: hidden;
border-radius: 50%;
-webkit-transform: translate3d(0px, 0px, 0px);
transform: translate3d(0px, 0px, 0px);
width: 230px;
margin: 0 auto;
height: 230px;
margin-bottom: 15px;
}
.iuauthor-item h4.iuauthor-name a {
font-size: 18px;
margin-bottom: 10px;
display: block;
color: #a32f37;
border-bottom: 1px dashed #ccc;
padding-bottom: 9px;
border-top: 1px dashed #ccc;
padding-top: 6px;
}
.iuauthor-name p {
  color: #22273d;
  font-size: 14px;
  margin-top: 17px;
  font-weight: 100;
  margin-bottom: -30px;
}
.iuauthor-item .image-wrap:before {
content: '';
display: block;
position: absolute;
border-radius: 50%;
border: 10px solid #f9f9f9;
border-image-source: initial;
border-image-slice: initial;
border-image-width: initial;
border-image-outset: initial;
border-image-repeat: initial;
opacity: .7;
margin: auto;
top: 0;
right: 0;
bottom: 0;
left: 0;
-webkit-transition: all .4s linear;
transition: all .4s linear;
}
</style>

5-قم بتغيير رابط الصورة ورابط الفيس بوك الى روابطك الخاصة
6-قم بعملية حفظ القالب