اسلام عليكم و رحمة الله تعالي و بركاته في هذه التدوينه سوف اتحدث عن اضافه اكثر من رائعة و تتميز بالجمال و التناسق في الوانها و منظرها
نبحث عن <b:skin/><[[ ان لم تجدها فبحــــــــــــــــــــــــــث عن : ]]></b:skin>
ونضع هذا الكود فوقه
/* post author */
.post-authoor p:after{ content:"\f10d"; font-family:fontawesome; margin-right:4px}
.post-authoor p:before{ content:"\f10e"; font-family:fontawesome; margin-left:4px}
.post-authoor p{ padding:0 28px; font-size:15px; color:#f3f3f3; margin-top:4px; line-height:26px}
.post-authoor h3{ font-size:23px; font-weight:100}
.post-authoor .author-img-fo{ width:100px; height:100px; text-align:center; border:2px solid #3d4a60; border-radius:8px; position:absolute; right:0; left:0; top:-50px; margin:auto}
.post-authoor:before{ content:"\f10e"; font-family:fontawesome; margin-left:4px; position:absolute; right:20px; font-size:77px; top:14px; color:rgba(0,0,0,0.14)}
.post-authoor:after{ content:"\f10d"; font-family:fontawesome; margin-right:4px; position:absolute; left:20px; font-size:77px; bottom:10px; color:rgba(0,0,0,0.14)}
.post-authoor{ border:1px solid #eee; border-left:0; text-align:center; position:relative; border-right:0; padding:20px 0; background:#3d4a60; padding-top:64px; color:#fff; margin:42px auto; max-width:95%; border-radius:11px; margin-bottom:0;margin-top: 77px;}
و من بعد ذلك
نبحث عن
<div class='post-footer'>
قد تجد الكود متكرر 4 مرات أو أقل الكود الأخير هو المقصود
ان لم تجد الكود ابحث عن هذا
<div class='sharepost'>
و بعد ذلك تضع هذا الكود اسفلها
<div class='post-authoor'>
<img class='author-img-fo' expr:src='data:post.authorPhoto.url'/>
<div class='author-cont'>
<h3><span>بقلم :</span>GEEK TecH</h3>
<p>
انا عمر عثمان من مصر احب أن نضع كل ما اعرف من معلومات حول الحاسوب ولا ابخل به عليكم فأرجوا ان لاتبخلوا علينا أيضا بمتابعتكم لمواضيعنا كما ان تعليقاتكم تهمنا وتزيد من عطائنا لكم وشكرا
</p>
</div>
</div>
- و بعد ذلك تقوم بتغيير الاسم و المدونه و الجمله الخاصه بك و مبروك عليك الاضافه لا تنسي الانضمام الي متتبعين المدونه من اسفل الموقع الي اللقاء
- للمعاينه من هنا
add_comment ليست هناك تعليقات:
إرسال تعليق