اداة تعريف الكاتب ومواقع التواصل شكل احترافي
طريقة التركيب
اذهب للقالب تحرير HTML
وابحث عن </head> ثم اضف الكود التالي فوقة مباشر
<style type='text/css'>.sosmed-author,a.authorname,h2.author-title,a.authorname-url{display:block;text-align:center}.authorbox{width:300px;background:url(http://store1.up-00.com/2016-06/1466371674811.jpg) top center no-repeat #fff;border:1px solid #dedede;border-radius:3px;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;padding:16px 0 0;margin:0 auto;}h2.author-title{font-weight:bold;text-decoration:none;margin:0 auto 10px;font-size:22px;color:#fff!important}.authorbox img{margin:55px auto 0;border-radius:100%;display:block}a.authorname{margin:10px auto;font-weight:400;font-size:20px!important;text-decoration:none;}a.authorname-url{margin:0 auto 10px;font-weight:400;font-size:16px!important;text-decoration:none;}.sosmed-author li,.sosmed-author ul{list-style:none}.sosmed-author ul{margin:0!important;padding:0!important}.sosmed-author{margin:0 auto!important;padding:10px 0;background:#dfdfdf;border-top:1px solid #dedede}.sosmed-author li{display:inline-block;margin-right:10px}.sosmed-author li:last-child{margin-right:0}.sosmed-author li a,a.authorname,a.authorname-url{color:#555!important;transition:all .4s ease-out}.sosmed-author li a:hover,a.authorname:hover,a.authorname-url:hover{color:#111!important}a.button-author{display:block;background:#4d90fe;border:1px solid #3079ed;color:#fff!important;font-weight:bold;font-size:16px!important;margin:10px 10px 0;padding:5px;text-align:center;border-radius:3px;transition:all .4s ease-out;text-decoration:none}a.button-author:hover{background:#357ae8;border:1px solid #2f5bb7}</style>
ثم ابحث عن </body> واضف الكود التالي فوقة مباشرة
<script>//<![CDATA[var imgDefer = document.getElementsByTagName("img");for (var i = 0; i < imgDefer.length; i++) { if (imgDefer[i].getAttribute("data-src")) { imgDefer[i].setAttribute("src", imgDefer[i].getAttribute("data-src")); }}//]]></script>
ثم اذهب للتخطيط -اضافة اداة - HTML/JavaScript
وضع الكود التالي مع تغيير مايلزم
<div class="authorbox"> <img alt="author" src="data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=" data-src="http://store2.up-00.com/2016-06/1466372378441.jpg" width="120" height="120" /> <a class="authorname" href="#" rel="author" target="_blank" title="حلولي">حلولي</a> <a class="authorname">مدونة تقنية انشر بها مايفيد الزائر والمدون</a> <div class="sosmed-author"> <ul> <li><a href="https://www.facebook.com/hlo1y" target="_blank" title="Facebook" rel="nofollow"><i class="fa fa-facebook-square fa-2x" aria-hidden="true"></i></a></li> <li><a href="https://twitter.com/hlo1y" target="_blank" title="Twitter" rel="nofollow"><i class="fa fa-twitter-square fa-2x" aria-hidden="true"></i></a></li> <li><a href="https://plus.google.com/+v518v" target="_blank" title="Google+" rel="nofollow"><i class="fa fa-google-plus-square fa-2x" aria-hidden="true"></i></a></li> <li><a href="//www.youtube.com/c/v518v" target="_blank" title="Youtube" rel="nofollow"><i class="fa fa-youtube-square fa-2x" aria-hidden="true"></i></a></li> <li><a href="" target="_blank" title="LinkedIn" rel="nofollow"></a></li> <li><a href="https://www.instagram.com/hlo1y" target="_blank" title="Instagram" rel="nofollow"><i class="fa fa-instagram fa-2x" aria-hidden="true"></i></a></li> </ul> <div class="clear"></div>
<a class="button-author" href="http://www.blogger.com/follow-blog.g?blogID=4497666235919215661" target="_blank" title="">انضم لهذه المدونة</a>
<a class="button-author" href="#" rel="nofollow" target="_blank" title="">للمراسلة اضغط هنا <i aria-hidden="true" class="fa fa-paper-plane"></i></a>
</div></div>
انتهى
تابعونا للمزيد من الاضافات والدروس
السلام عليكم اخي وايقونات موقع تواصل اجتماعي ماتظهر
ردحذفوعليكم السلام ورحمة الله وبركاته أهلاً بك أخي الكريم
حذفالإضافة تعمل أخي الكريم أضف الأكواد كاملة وبالطريقة الصحيحة التي شرحتها بالأعلى