السلام عليكم ورحمة الله تعالى وبركاته :
في هذه التدوينة الجديدة على مدونة عالم المحترف سوف أقدم لكم إضافة تعريف لصاحب الموقع بشكل إحترافي في السيدبار يمكنكم معاينتها من المدونة أو من هنا :
لتركيب الإضافة :
- قم بالتوجه إلى تخطيط المدونة
- قم بإختيار إضافة أداة " HTML/JavaScript "
- قم بنسخ ولصق هذا الكود هناك:
كود الإضافة :
<div class="widget-content">إلى هنا أتمنى أن أكون قد أفدتكم ، لا تنسو دائما ترك تعليقاتكم وأي إستفسار نحن في الخدمة ...
<style>
.teamsecomunity{
}
.teamsecomunity ul {
padding: 0px;
}
.teamsecomunity ul #teamsecomunity-pos {
padding: 4px 8px 5px;
display: block;
width: 160px;
text-align: center;
font-size: 16px;
line-height: 20px;
background: #F55F59;
border-radius: 4px 4px 0px 0px;
margin: 10px 10px 0px 0px;
font-weight: normal;
color: #ffffff;
}
.teamsecomunity ul li {
padding: 3px;
list-style: none;
display: flex;
background: #2A4057;
border-radius: 5px;
overflow: hidden;
}
.teamsecomunity ul li img {
width: 90px;
height: 90px;
display: block;
flex-shrink: 0;
border-radius: 50%;
}
.teamsecomunity ul li .teamsecomunity-name-disc {
flex-grow: 1;
padding: 5px 5px 0px 0px;
color: white;
}
.teamsecomunity ul li .teamsecomunity-name-disc h2 {
font-size: 18px;
color: #F1F1F1;
font-weight: normal;
border-bottom: 1px solid #232323;
padding: 0px 0px 6px 0px;
width: 100%;
background: none;
text-align: right;
border-radius: 0px;
margin: 0px;
}
.teamsecomunity ul li .teamsecomunity-name-disc p {
color: #eeeeee;
font-size: 11px;
line-height: 18px;
padding: 3px 0px 0px 5px;
}
.teamsecomunity-contact {
width: 30px;
flex-shrink: 0;
border-right: 1px solid #232323;
}
.teamsecomunity-contact a {
display: block;
width: 100%;
height: 30px;
text-align: center;
line-height: 28px;
color: #929292;
transition: 0.2s;
}
.teamsecomunity-contact a:hover {
color: #fff;
}
#teamsecomunity-email{
background: #2A4057;
width: 80%;
padding: 0px 10px;
font-size: 14px;
line-height: 22px;
margin: 0px 10px 0px 0px;
color: #FFFFFF;
border-radius: 0px 0px 5px 5px;
text-align: left;
direction: ltr;
font-weight: normal;
}
#teamsecomunity-email i{
color: #969696;
line-height: 22px;
width: 22px;
text-align: left;
margin-right: 10px;
border-right: 1px solid #1D1D1D;
}
</style>
<div class="teamsecomunity">
<ul>
<h3 id="teamsecomunity-pos">مدير الموقع</h3>
<li>
<img src="https://blogger.googleusercontent.com/img/proxy/AVvXsEhk82J0cG6Ch1L6pmQ7VGgGNQ3vR1skFQivunjD-1uDlN-y5gOF0mkv1JTFi_nRwaflZBfjUQD4sWovj7T8kQtZ5MWyTBB5o2Hm4tcgORWNmGgwJRF9P7ksuWQMoJzIlYBA9_YRkSen7LhSpdUGYwYjKw=s0-d" />
<div class="teamsecomunity-name-disc">
<h3>
عبد الوافي الطاهري</h3>
<p>
عبد الوافي الطاهري متخصص بقضايا أمن المعلومات والتحقيقات الجنائية الرقمية وتطوير أنظمة الحماية والأمن المعلوماتي .
</p>
</div>
<div class="teamsecomunity-contact">
<a href="https://www.facebook.com/allampro16"><i class="fa fa-facebook-square" aria-hidden="true"></i></a>
<a href="https://twitter.com/allampro16"><i class="fa fa-twitter" aria-hidden="true"></i></a>
<a href="https://instagram.com/abdlwafitahiri"><i class="fa fa-instagram" aria-hidden="true"></i></a>
</div>
</li>
<h3 id="teamsecomunity-email"><i class="fa fa-at" aria-hidden="true"></i>contact@allampro16.com</h3>
</ul></div></div>
اترك تعليقا:
