أضافة ايقونات المواقع الاجتماعية بأستخدام font awesome لاضافة ايقونات المواقع الاجتماعية بأستخدام font-awesome اتبع الخطوات التالية 1- اذهب الى تعديل القالب >>خذ نسخة احتياطية من القالب >>ابحث (ctrl+f) عن <head> .2-تحته (أسفله) قم بأضافة الكود التالى <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" /> 3-قم بالذهاب الى التخطيط >>ثم اضافة اداة HTML/JAVASCRIPT>> ثم انسخ الكود التالى داخلها >> <div id="fawesomeicons"><a href="URL-HERE" title="Facebook" target="_blank" rel="nofollow"><i class="fa fa-facebook"></i></a><a href="URL-HERE" title="Google Plus" target="_blank" rel="nofollow"><i class="fa fa-google-plus"></i></a><a href="URL-HERE" title="Twitter" target="_blank" rel="nofollow"><i class="fa fa-twitter"></i></a><a href="URL-HERE" title="Pinterest" target="_blank" rel="nofollow"><i class="fa fa-pinterest"></i></a><a href="URL-HERE" title="Instagram" target="_blank" rel="nofollow"><i class="fa fa-instagram"></i></a><a href="URL-HERE" title="Bloglovin" target="_blank" rel="nofollow"><i class="fa fa-heart"></i></a><a href="URL-HERE" title="Tumblr" target="_blank" rel="nofollow"><i class="fa fa-tumblr"></i></a><a href="URL-HERE" title="RSS" target="_blank" rel="nofollow"><i class="fa fa-rss"></i></a><a href="URL-HERE" title="Youtube" target="_blank" rel="nofollow"><i class="fa fa-youtube"></i></a></div><style>#fawesomeicons { text-align: center; } #fawesomeicons a { border: 1px solid #f8a82a; color: #f8a82a; display: inline-block; font-size: 16px; width: 30px; height: 30px; line-height: 30px; margin: 0 1px 6px; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; } #fawesomeicons a:hover{ background: white; border: 1px solid white; } </style> 4-قم بأستبدل url-here برابط التواصل الاجتماعى الخاص بك ثم احفظ القالب
No comments:
Post a Comment