اضافة عن الكاتب بشكل احترافي v1 مجانا

شارك المدونة مع أصدقائك في الفيسبوك ليستفيدو أيظا

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

صورة للإضافة

شرح طريقة التركيب

أولا, وكالعادة نبدأ بوضع أكواد Css, نقوم بالبحث بواسطة Ctrl+F عن الوسم ]]></b:skin> ونضع فوقه مباشرة الأكواد التالية.

.author-nak1ha h3 span{ color:#465769;}
.author-nak1ha h3{ color: #fff; font-size: 23px;
font-weight: 100;}
.author-nak1ha p{color: #fff}
.author-nak1ha img{ width: 100px;
height: 100px;
text-align: center;
border: 2px solid #ffffff;
border-radius: 90px;
position: absolute;
right: 0;
left: 0;
top: -50px;
margin: auto;}
.author-nak1ha{
border:1px solid #2a4057;
border-left: 0;
text-align: center;
position: relative;
border-right: 0;
padding: 20px 0;
background: rgb(36, 55, 80) url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitxyPzpMY5YsZPahq73avaM31_Ah_k8RHu8oZAofekIYPJ45Zzo2ifouwFg58Ly_m4vAerEvCB1_gC0mK3rb3PtJbPHJHaoiPTSi-H-hJKak1NCLAVBzOwr7jYefqNf3Fm_WomP0Iqt0c/s1600/Nature_Persian-Star.png);
padding-top: 64px;
color: #fff;
margin: 42px auto;
margin-bottom: 12PX;
width: 100%;
}
.author-nak1ha a {
color: #fff;
}

ثانيا, نقوم بوضع أكواد Html لتظهر الإضافة, عليك وضعها في المكان الذي تريد أن تظهر فيها بين <body> و </body>

<b:if cond='data:blog.pageType == "item"'>
<div class="author-nak1ha">
<img alt="نكهة التقنية" class="author_avatar" expr:alt='data:post.author' expr:src='data:post.authorPhoto.url' width='100%'/>
<h3>
الكاتب : <span>
<a href="#" rel="author"><data:post.author/></a>
</span>
</h3>
<p>
مدون مغربي, 17سنة مصمم قوالب بلوجر ومهووس بالتقنية هذفي هو نشر المحتوى الحصري لارتقاء الويب العربي, قمت بإنشاء مدونة نكهة التقنية سنة 2016 وأسعى إلى أن تكون من إحدى أفضل المدونات المغربية. </p>
</div>
</b:if>

وأخيرا, غير التعريف الملون بـالأزرق بما يناسبك واحفظ القالب

إلى هنا نكون وصلنا الى آخر الموضوع وكالعادة لا تبخلو علينا بآرائكم في التعليقات لتشجيعنا على تقديم المزيد..