Turkialawlqy

Turkialawlqy

:: عضو رائع ::
1 فبراير 2012
2,124
1,995
شبوة
متواجد حاليا
#1
بسم الله الرحمن الرحيم

السلام عليكم ورحمة الله وبركاتة

اليوم اقدم لكم شرح وضع ايقونات للبلوكات في القائمة الجانبية وشريط الناف بار

مثال

1-png.482 انشاء ايقونات للقائمة الجانبية و الناف بار-xenForo العربية


2-png.483 انشاء ايقونات للقائمة الجانبية و الناف بار-xenForo العربية


نبدأ على بركة الله ,,
الان سنقوم بتعديل قوالب القائمة الجانبية
اذهب الى لوحة التحكم ثم الى اللغات والاستايلات
ثم الى القوالب
ابحث عن القوالب التالية :
  • sidebar.css = قالب css للقائمة الجانبية
ضع في بدايتة
HTML:
.header_icon {
position: relative;
vertical-align: top;
}
  • sidebar_online_users = طاقم الإدارة المتصلون حالياً + الأعضاء المتصلون حالياً
ابحث عن
HTML:
<h3>{xen:phrase staff_online_now}</h3>
استبدله بـ
HTML:
<h3><img src="XxXx" class="header_icon"> {xen:phrase staff_online_now}</h3>
مع مراعاة استبدال XxXx بالايقونه التي تريد ظهورها لـ { طاقم الإدارة المتصلون حالياً }
ابحث عن
HTML:
<h3><a href="{xen:link online}" title="{xen:phrase see_all_online_users}">{xen:phrase members_online_now}</a></h3>
استبدلة بـ
HTML:
<h3><img src="XxXx" class="header_icon"> <a href="{xen:link online}" title="{xen:phrase see_all_online_users}">{xen:phrase members_online_now}</a></h3>
مع مراعاة استبدال XxXx بالايقونه التي تريد ظهورها لـ { الأعضاء المتصلون حالياً }

الان انتهينا من البلوكين الاولين { طاقم الإدارة المتصلون حالياً + الأعضاء المتصلون حالياً }
ثم نبحث عن
  • forum_list = قالب عرض المنتدى
ابحث عن
HTML:
<h3>{xen:phrase forum_statistics}</h3>
استبدله بـ
HTML:
<h3><img src="XxXx" class="header_icon"> {xen:phrase forum_statistics}</h3>
مع مراعاة استبدال XxXx بالايقونه التي تريد ظهورها لـ { إحصائيات المنتدى }

انتهينا الان من قالب الاحصائية


الان ناتي الى الناف بار

نبحث عن
  • navigation = قالب الناف بار
ابحث عن
HTML:
<a href="{$tabs.forums.href}" class="navLink">{$tabs.forums.title}</a>
استبدله بـ
HTML:
<a href="{$tabs.forums.href}" class="navLink"><img src="XxXx" class="header_icon"> {$tabs.forums.title}</a>
مع مراعاة استبدال XxXx بالايقونه التي تريد ظهورها لـ { المنتدى }

ابحث عن
HTML:
<a href="{$tabs.members.href}" class="navLink">{$tabs.members.title}</a>
استبدله بـ
HTML:
<a href="{$tabs.members.href}" class="navLink"><img src="XxXx" class="header_icon"> {$tabs.members.title}</a>
مع مراعاة استبدال XxXx بالايقونه التي تريد ظهورها لـ { الاعضاء }

ابحث عن
HTML:
<a href="{$tabs.help.href}" class="navLink" rel="help">{$tabs.help.title}</a>
استبدله بـ
HTML:
<a href="{$tabs.help.href}" class="navLink" rel="help"><img src="XxXx" class="header_icon"> {$tabs.help.title}</a>
مع مراعاة استبدال XxXx بالايقونه التي تريد ظهورها لـ { التعليمات }


أعتذر عن عدم تنسيق الموضوع لضيق الوقت لدي

مودتي :)
 

hkahx hdr,khj ggrhzlm hg[hkfdm , hgkht fhv

أيوب بوخزه

أيوب بوخزه

:: عضو جديد ::
rankrank
25 فبراير 2012
47
2
30
الجزائر
غير متواجد
#3
أريد كود مكتبة الفيديو والدردشـــة والرئيسية​
هدا في قالب الناف بار​
أما في القطع الجانبية​
1- مشاركة هده الصفحة​
2- ألوان المجموعات​
3- المتواجدون بالمنتدى​
هدا ما تبقى لي​
أنتظر ردكم​
;)
 
Turkialawlqy

Turkialawlqy

:: عضو رائع ::
1 فبراير 2012
2,124
1,995
شبوة
متواجد حاليا
#4
^^
اهلاً بك أخي ايوب

لم افهم قصدك أخي العزيز ياليت توضح اكثر { هل تحتاج اضافات مكتبة الفيديو والدردشة }
ام انك تريد ان تعمل لها ايقونات

ان كان الامر كذلك بامكانك استعراض سورس الصفحة الرئيسية والبحث عن الكلاسات في القوالب

يحتاج الامر الى طوله بال في البداية وتجربة

وعدم الخوف من القيام بالتجربة

مثلا كنت في بداية تجاربي مع الزين فورو وقوالبها اعمل على التعديلات
اضع مثلاً 11 || واقوم بالحفظ دون الخروج من القالب
واذهب للرئيسية وعمل تحديث للصفحة واشاهد اين وضعت التعديل ان كان مناسب قمت بوضع الكود الذي اريد وان كان غير مناسب ابحث عن مكان اخر للتعديل وهكذا الى ان صار الامر سهل للغاية

فقط تحتاج الى معرفة باكواد html و css وراح تبدع في هذا المجال

معليش كلامي كثير لكن لكي توصل الفكره
وفقك الله ,,
 
أيوب بوخزه

أيوب بوخزه

:: عضو جديد ::
rankrank
25 فبراير 2012
47
2
30
الجزائر
غير متواجد
#5
شكرا أخي الكريم على الإفادة
أردن أن أضع أيقونات للدردشة ومكتبة الفيدية مثل البقية
وددت لو وجدت مثل الشرح السابق لك أخي الكريم
أجد الكود وأستبدله
كما في شرحك
:)
 
طير المحبه

طير المحبه

:: تحت المراقبة ::
rankrank
1 مارس 2015
35
9
40
الجزائر
غير متواجد
#7
يبدو أنك نسيت شيء .. كود الايقونه الرئيسية


تفضلوا

ابحث عن
كود:
<li class="navTab home PopupClosed"><a href="{$homeLink}" class="navLink">{xen:phrase home}</a></li>
استبدله بـ
كود:
<li class="navTab home PopupClosed"><a href="{$homeLink}" class="navLink"><img src="XxXx" class="header_icon">{xen:phrase home}</a></li>
مع مراعاة استبدال XxXx بالايقونه التي تريد ظهورها لـ { الرئيسية }
 
أعلى