السلام عليكم اليوم أقدم لكم إضافة حصرية من أنا من تطوير تكنو ليبي ننتقل للموضوع :
طريقة التركيب :
- أضف هذا الكود في أداة HTML/JAVASCRIPT :
<style type='text/css'>
/* About Me */
.sidebar_about_author { height: 210px; }
.aboutpro-img:before { content: ''; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiirNMC24Uw4QnecqEU83egaqAxlYd094lV5otjWLi4ohvRtZ0JpA38x2D3GE5Vb4zYV2bvq7B9kDHQ3waGJd07cEmeeTeUP2AHYtDsqPpBNu4dCtBEzsn_7zdmxLF63H0x7HCTGp5aa5Gk/s1600/pattern-overlay.png)center top repeat; opacity: .3; position: absolute; left: 0; right: 0; bottom: 0; top: 0; z-index: 2; } .aboutpro-img {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjiBTRKSkawwh14gYs6mgtBvw4yEUI52kNQFUHCuhQXnQIChOiX3-tam05LjTdB0m6bY1y1pQV3BS3MRRvCbYXA-XX-YA-Ghi4a5sauxNwWfqCk2xkPOQM_BmIaTPYGctrKmbVOVRbuVV57/s1600/66.jpg); height: 210px; display: block; width: 100%; position: relative; right: 0; bottom: 0;background-size: cover; } .sidebar_about_author { height: 210px; }
.aboutpro-wrapicon{display:block;margin:-225px auto 0;position:relative;z-index:3;}
.aboutpro-wrapicon .extender{width:100%;display:block;}
.extender{text-align:center;font-size:18px}
.extender .aboutpro-icon{display:inline-block;margin:0 .5px;padding:0;border:0;}
.extender .aboutpro-icon a{display:inline-block;font-family:fontawesome;height:32px;width:32px;line-height:32px;font-weight:normal;color:#fff;font-size:80%;transition:all .5s}
.extender .aboutpro-icon:hover a,.extender .aboutpro-icon a:hover{color:rgba(255,255,255,.7);}
.aboutpro-info{font-size:12px;position: relative; bottom: 210px; z-index: 99999;}
.aboutpro-info h4{display:table;background:rgba(255,255,255,1);margin:10px auto;font-family:Droid Arabic Kufi,Electrolize;font-size:220%;font-weight:normal;text-transform:capitalize;color:#454545;border:4px double #2e2e2e;z-index:3;padding:5px 10px}
.aboutpro-info p{position:relative;display:block;color:#fff;z-index:4;font-size:110%;text-align:center;font-family:Droid Arabic Kufi,Electrolize;line-height: 1.7em; padding: 1px; }
</style>
<div class="sidebar_about_author">
<div class="inner_wrapper">
<div class="aboutpro-img">
</div>
</div>
<div class="aboutpro-info">
<h4>iOmar</h4>
<p>سمي عمر الختالي من ليبيا من طرابلس أحب وأعشق التصميم والتدوين وأنشأت هذه المدونة بهدف تقوية خبرات من خبراته ضعيفة.</p>
</div>
<div class="aboutpro-wrapicon">
<ul class="extender">
<li class='aboutpro-icon'><a href="#" rel="nofollow" target="_blank" ><i class="fa fa-facebook"></i></a></li>
<li class="aboutpro-icon"><a href="#" rel="nofollow" target="_blank" ><i class="fa fa-twitter"></i></a></li>
<li class="aboutpro-icon"><a href="#" rel="nofollow" target="_blank" ><i class="fa fa-google-plus"></i></a></li>
<li class="aboutpro-icon"><a href="#" rel="nofollow" target="_blank" ><i class="fa fa-youtube"></i></a></li>
<li class="aboutpro-icon"><a href="#" rel="nofollow" target="_blank" ><i class="fa fa-rss"></i></a></li>
</ul>
</div>
</div>
وغير ما *باللون الأحمر إلى الروابط الإجتماعية.
وغير ما *باللون بالأخضر إلى الإسم.
وغير ما *باللون الأزرق إلى نبذة قصيرة عنك.
وغير ما *باللون البرتقالي إلى خلفية الإضافة.
ثم إضغط حفظ أو Save
أتمنى أن تكون التدوينة أعجبتكم وأتمنى أن أكون دائماً عند حسن ظنكم !!
وفي أمان الله
إسمي عمر الختالي من الدولة الليبية عمري 14رسنة 3 سنوات خبرة في مجال البلوجر والتصميم والتطوير والهدف من المدونة هي مساعدة الآخرين الذين خبراتهم ضعيفة حتى يصبحوا مثلي وربما أقوى مني .
محول الأكوادإخفاء محول الأكواد الإبتساماتإخفاء الإبتسامات