بسم الله الرحمن الرحيم
اداة تعريف الكاتب ومواقع التواصل شكل احترافي
طريقة التركيب
اذهب للقالب تحرير 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>
انتهى
تابعونا للمزيد من الاضافات والدروس
منقول : حلول
share شارك الموضوع
ليست هناك تعليقات:
إرسال تعليق