اضافة تعريف الكاتب لمدونات بلوجر الجماعيه بشكل احترافي2016

تقنية حضرموت

أتقدم لكم بإضافة غنية عن التعريف وهي صندوق تعريف الكاتب عبر جوجل بلس، باستعمالك لهذا الصندوق ستتمكن بسهولة إضافة نبذة عن الكاتب وكذلك الصورة التعريفية مع الإسم يرافقه رابط صفحتك على جوجل بلس.

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

حمل الاكواد من هنا

طريقة التركيب
1. ابحث بإستعمال CTRL+F عن ]]></b:skin>
2. ضع الكود التالي فوقه.

#kateb {
  font-family:inherit;
  text-align:center;
  text-align:-webkit-center;
  text-align:-moz-center;
  border-bottom:2px solid $(keycolor);
  color:#666;
}

.author-profile img {
  float:right;
  margin-left:5px;
  border-radius:5%;
  -webkit-border-radius:5%;
  -moz-border-radius:5%;
}

.author-profile > div > a {
  color:#444;
}

.author-profile > div {
  font-size:14px;
  font-family:GESSTwoMediumRegular;
  margin:0;
  padding-top:10px;
}

p.description {
  font-size:95%;
  margin:0 0 10px;
}

p.description a {
  color:#333;
  font-family:GESSTwoMediumRegular;
}

a.g-profile {
  font-size:15px;
  font-family:GESSTwoMediumRegular;
  margin:15px 0 5px;
  color:#666;
}

.auhtor-image img {
  margin-left:2%;
  padding:3px;
  border-radius:15%;
  float:right;
}

.auhtor-image {
  padding-bottom:11px;
}

.author-profile2 {
  padding:26px 10px 26px 10px;
  background:rgba(231,231,231,0.35);
  margin-top:20px;
  float:right;
  width:98%;
  border:1px solid #E4E4E4;
}

.author-profile2 img {
  float:right;
  margin-left:10px;
  width:100px;
  border-radius:100%;
}

.author-profile2 > div > a {
  color:#444;
  font-size:17px;
}

.author-profile2 > div {
  font-size:18px;
  font-family:GESSTwoMediumRegular;
  margin:0;
  padding-top:13px;
  padding-bottom:13px;
}

#aup {
  float:right;
  margin-left:5px;
  color:$(keycolor);
}

#aun {
  margin-left:5px;
  color:$(keycolor);
  float:right;
  font-size:16px;
  display:none;
}

p.description {
  font-size:95%;
  margin:0 0 10px;
}

p.description a {
  color:#333;
  font-family:GESSTwoMediumRegular;
}

a.g-profile {
  font-size:15px;
  font-family:GESSTwoMediumRegular;
  margin:15px 0 5px;
}

.auhtor-image2 {
  float:right;
  margin:-3px 0 0 8px;
}

.shear-botton {
  overflow:hidden;
  padding:0 15px;
  height:60px;
  line-height:60px;
  background-color:#f8f8f8;
  border:1px solid #EEE;
  margin-top:15px;
  margin-bottom:15px;

}3. ابحث عن <data:post.body/> ضع قبله الكود الأتي
* ملاحظة ستجد الكود متكرر مرتين أو أكثر الأخير هو المقصود -- 

  <div class='author-profile2' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<b:if cond='data:post.authorPhoto.url'>
<img expr:src='data:post.authorPhoto.url' itemprop='image' width='50px'/>
</b:if>
<div>
<a class='g-profile' expr:href='data:post.authorProfileUrl' itemprop='url' rel='author' title='author profile'>
<span itemprop='name' style='color:#666; '><p id='aup'><i class='fa fa-user' style='margin-left: 8px;'/>الكاتب : </p><data:post.author/></span>
</a>
</div>
<span itemprop='description' style='color:#666;'><p id='aun'><i class='fa fa-comment-o' style='margin-left: 8px;'/>نبذة عني : </p><data:post.authorAboutMe/></span>
</div>
</div>

4. قم بحفظ النموذج

إضافة التعريف وإظهاره 

 . الآن نمر للمرلحة ما قبل الأخيرة وهي إضافة النبذة عبر جوجل بلس وإضهاره بالمدونة داخل المواضيع لفعل ذلك إتجه لرابط صفحتك : https://plus.google.com/u/0/+iHussam/about بعدها حرر Story واملئ صندوق Introduction بنبذة قصيرة عنك وقم بالحفظ

2. قم بالعودة لمدونتك واتجه إلى التخطيط ثم حرر رسائل المدونة الإلكترونية وتأكد من تفعيل خيار إظهار الملف الشخصي للمؤلف أسفل مشاركة

إكتمل التركيب!

مواضيع قد تعجبك