أيقونات موقع fontawesome على النافبار الرئيسية
4 مشترك
منتدى الدعم و المساعدة لأحلى المنتديات :: منتدى الدعم والمساعدة :: قسم المشاكل الأخرى :: أرشيف قسم "المشاكل الأخرى"
صفحة 1 من اصل 1
أيقونات موقع fontawesome على النافبار الرئيسية
السلام عليكم و رحمة الله و بركاته أعضاء و خبراء منتدى الدعم و المساعدة.
هذا أول موضوع لي هنا و أرجو أن أكون قد وضعتُهُ في مكانه المناسب، رغم أنني عضو قديم جدا جدا... حيث أنني كنتُ دائما أعتمد على البحث و كنتُ دائم و الحمد لله أجد ضالتي في كل ما يحتويه الأرشيف.
أولا رابط منتداي هو: منتديات التفوق.
طلبي هو كالآتـي....
أريد أن أستعمل أيقونات موقع fontawesome على الرئيسية في أزرار الناف بار كما نستعملها على مدونات بلوجر.
الصورة الحالية هي كالآتي:
و أريد إضافة أيقونات موقع fontawesome على الرئيسية في أزرار الناف بار لتصبح كما يلي على سبيل المثال: (الصورة عدلتُها فقط بالـــPaint).
لِعِلمِكم فقط... فقد استعملت خاصية البحث قبل طرحي لهذا الموضوع...
لكنني لم أجد سوى هذا الموضوع: مشكلة في ايقونات موقع فونت اوسمي في وصف اقسام المنتدي
لكنني لم أجد به أي شيء يساعدني في طلبي هذا.
إذا كان هناك حل أخر كإضافة صور مثلا للأزرار (ليس أيقونات الصور)... فأرجو أن تمدوني به أيضا و شكرا لكم.
كل الشكر و التقدير لمن يقدم لي المساعدة
في انتظار جواب من خبرائنا...
دمتم في أمان الله.
هذا أول موضوع لي هنا و أرجو أن أكون قد وضعتُهُ في مكانه المناسب، رغم أنني عضو قديم جدا جدا... حيث أنني كنتُ دائما أعتمد على البحث و كنتُ دائم و الحمد لله أجد ضالتي في كل ما يحتويه الأرشيف.
أولا رابط منتداي هو: منتديات التفوق.
طلبي هو كالآتـي....
أريد أن أستعمل أيقونات موقع fontawesome على الرئيسية في أزرار الناف بار كما نستعملها على مدونات بلوجر.
الصورة الحالية هي كالآتي:
و أريد إضافة أيقونات موقع fontawesome على الرئيسية في أزرار الناف بار لتصبح كما يلي على سبيل المثال: (الصورة عدلتُها فقط بالـــPaint).
لِعِلمِكم فقط... فقد استعملت خاصية البحث قبل طرحي لهذا الموضوع...
لكنني لم أجد سوى هذا الموضوع: مشكلة في ايقونات موقع فونت اوسمي في وصف اقسام المنتدي
لكنني لم أجد به أي شيء يساعدني في طلبي هذا.
إذا كان هناك حل أخر كإضافة صور مثلا للأزرار (ليس أيقونات الصور)... فأرجو أن تمدوني به أيضا و شكرا لكم.
كل الشكر و التقدير لمن يقدم لي المساعدة
في انتظار جواب من خبرائنا...
دمتم في أمان الله.
عدل سابقا من قبل ali_baba في الخميس 17 أغسطس 2017 - 18:17 عدل 1 مرات
رد: أيقونات موقع fontawesome على النافبار الرئيسية
وعليكم السلام ورحمة الله وبركاته
لوحة الاداره
مظهر المنتدي
ادارة الصور
لوحة اداره كامله
وهناك ضع صور الازرار
ثم
لوحة الاداره
مظهر المنتدي
الصفحه الرئيسيه وازرار التصفح
اظهار الصور فقط في عارضة ازرار التصفح
يمكنك اختيار (نعم) لاظهار الصور فقط
او اختيار (لا) لاظهار صورة الزر واسمه
لوحة الاداره
مظهر المنتدي
ادارة الصور
لوحة اداره كامله
وهناك ضع صور الازرار
ثم
لوحة الاداره
مظهر المنتدي
الصفحه الرئيسيه وازرار التصفح
اظهار الصور فقط في عارضة ازرار التصفح
يمكنك اختيار (نعم) لاظهار الصور فقط
او اختيار (لا) لاظهار صورة الزر واسمه
رد: أيقونات موقع fontawesome على النافبار الرئيسية
مرحباً أخي العزيز بعذ أذن المساعد
أولاً يجب تركيب fontawesome
ثانياً أدراج كود التالي CSS في ورقة CSS المنتدى
تعليمات الكود :
استبدل فقط من [href="/groups"] الرابط غيرة برابط الزر المراد تغير الايقونة فيه.
أيضاً content:"\f015"; غير رقم الزر بما يناسبك والكود التالي جاهز يمكنك استخدامة وتغير ما يناسبك وتكرر الكود كاملاً مع تغير ما طلب منك لكل زر ..
أولاً يجب تركيب fontawesome
ثانياً أدراج كود التالي CSS في ورقة CSS المنتدى
تعليمات الكود :
استبدل فقط من [href="/groups"] الرابط غيرة برابط الزر المراد تغير الايقونة فيه.
أيضاً content:"\f015"; غير رقم الزر بما يناسبك والكود التالي جاهز يمكنك استخدامة وتغير ما يناسبك وتكرر الكود كاملاً مع تغير ما طلب منك لكل زر ..
- الكود:
a.mainmenu[href="/groups"]::before {
content:"\f015";
color:#666;
font-family:FontAwesome;
font-weight:normal;
font-size:16px;
margin:0 4px;
}
رد: أيقونات موقع fontawesome على النافبار الرئيسية
ألف شكر لك أخي "النجم الذهبي" على ما قدمه لي في ردك...
لكن ما أبحث عنه هو ما جاء به الأخ "YasirAyad" و ألف ألف شكر لكما.
أخي "YasirAyad"، إذا فهمتُ جيدا ما جاء في ردك.. فهو كالآتي...
- يجب أولا أن أقوم بتركيب Fontawesome في ورقة CSS و هو كالآتي حسب ما وجدتُه في أحد المواضيع التي سبق لي و أن أشرت لها في طلبي.
بالنسبة للكود الذي قدمتَه لي، لا أعرف كيف يجب التعامل معه...
مثلا بالذهاب إلى موقع Fontawesome، و نريد أن نأخذ أيقونة الرئيسية "home"... فهي كما يلي...
و شكرا لك مرة أخرى و أعتذر على الإزعاج...
لكن ما أبحث عنه هو ما جاء به الأخ "YasirAyad" و ألف ألف شكر لكما.
أخي "YasirAyad"، إذا فهمتُ جيدا ما جاء في ردك.. فهو كالآتي...
- يجب أولا أن أقوم بتركيب Fontawesome في ورقة CSS و هو كالآتي حسب ما وجدتُه في أحد المواضيع التي سبق لي و أن أشرت لها في طلبي.
- الكود:
<link href="https://netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet"/>[size=19][/size]
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css"/>
بالنسبة للكود الذي قدمتَه لي، لا أعرف كيف يجب التعامل معه...
مثلا بالذهاب إلى موقع Fontawesome، و نريد أن نأخذ أيقونة الرئيسية "home"... فهي كما يلي...
- الكود:
<i class="fa fa-home" aria-hidden="true"></i>
و شكرا لك مرة أخرى و أعتذر على الإزعاج...
رد: أيقونات موقع fontawesome على النافبار الرئيسية
ألف شكر لك مرة أخرى أخي "YasirAyad"...
لقد ثم الحل بنسبة كبيرة و الحمد لله...
و يمكنك معاينة النتيجة من منتداي... من هنــــــــا
و هذه هي الأكواد التي قمتُ بإضافة... (و أضعها هنا كلها فقط لكَي تَعُمَّ الفائدة إن شاء الله)
الرئيسية:
لكن المشكلة التي واجهتُها هي أنني لا أعرف الروابط الخاصة لكل من:
- التسجيل.
- دخول.
-خروج.
بحيث أنني استعملتُ هذه الأكواد، لكنها لم تعمل... و الأكواد هي لكل منها على التوالي:
و إليك الصور بعد ما قمتُ بما أرشدتَني إليه بارك الله فيك.
في انتظار جوابك أخي "YasirAyad" أو أي خبير آخر و جزاكم الله عنا كل الخير.
لقد ثم الحل بنسبة كبيرة و الحمد لله...
و يمكنك معاينة النتيجة من منتداي... من هنــــــــا
و هذه هي الأكواد التي قمتُ بإضافة... (و أضعها هنا كلها فقط لكَي تَعُمَّ الفائدة إن شاء الله)
الرئيسية:
- الكود:
a.mainmenu[href="/"]::before {
content:"\f015";
color:#fff;
font-family:FontAwesome;
font-weight:normal;
font-size:15px;
margin:0px -10px;
}
- الكود:
a.mainmenu[href="/calendar"]::before {
content:"\f073";
color:#fff;
font-family:FontAwesome;
font-weight:normal;
font-size:15px;
margin:0px -10px;
}
- الكود:
a.mainmenu[href="/publi"]::before {
content:"\f164";
color:#fff;
font-family:FontAwesome;
font-weight:normal;
font-size:15px;
margin:0px -10px;
}
- الكود:
a.mainmenu[href="/faq"]::before {
content:"\f128";
color:#fff;
font-family:FontAwesome;
font-weight:normal;
font-size:15px;
margin:0px -10px;
}
- الكود:
a.mainmenu[href="/search"]::before {
content:"\f002";
color:#fff;
font-family:FontAwesome;
font-weight:normal;
font-size:15px;
margin:0px -10px;
}
- الكود:
a.mainmenu[href="/memberlist"]::before {
content:"\f007";
color:#fff;
font-family:FontAwesome;
font-weight:normal;
font-size:15px;
margin:0px -10px;
}
- الكود:
a.mainmenu[href="/groups"]::before {
content:"\f0c0";
color:#fff;
font-family:FontAwesome;
font-weight:normal;
font-size:15px;
margin:0px -10px;
}
- الكود:
a.mainmenu[href="/profile?mode=editprofile"]::before {
content:"\f07b";
color:#fff;
font-family:FontAwesome;
font-weight:normal;
font-size:15px;
margin:0px -10px;
}
- الكود:
a.mainmenu[href="/privmsg?folder=inbox"]::before {
content:"\f0e0";
color:#fff;
font-family:FontAwesome;
font-weight:normal;
font-size:15px;
margin:0px -10px;
}
- الكود:
color:...... ;
font-size:.......;
margin:.......;
لكن المشكلة التي واجهتُها هي أنني لا أعرف الروابط الخاصة لكل من:
- التسجيل.
- دخول.
-خروج.
بحيث أنني استعملتُ هذه الأكواد، لكنها لم تعمل... و الأكواد هي لكل منها على التوالي:
- الكود:
a.mainmenu[href="register"]::before
a.mainmenu[href="login"]::before
a.mainmenu[href="logout"]::before
و إليك الصور بعد ما قمتُ بما أرشدتَني إليه بارك الله فيك.
في انتظار جوابك أخي "YasirAyad" أو أي خبير آخر و جزاكم الله عنا كل الخير.
رد: أيقونات موقع fontawesome على النافبار الرئيسية
JoryAbdallah كتب:..........
شكرا لك أخي عبد الله...
المشكلة عندي ليست في رمز الأيقونات...
المشكلة هي في الرابط الذي يجب وضعه في هذا الكود بالنسبة لكل من "دخول" و "خروج" و "التسجيل"
- الكود:
a.mainmenu[href="الرابط"]::before {
content: "رمز الأيقونة";
}
و هذه هي الروابط التي استعملتُها، لكنها لم تعمل (أي أن الأيقونات لم تظهر).
- الكود:
a.mainmenu[href="/register"]::before {
content: "\f2ce";
}
a.mainmenu[href="/login"]::before {
content: "\f090";
}
a.mainmenu[href="/logout"]::before {
content: "\f08b";
}
و هنا أتسائل... هل هذه هي الروابط الصحيحة أم لا....؟؟؟؟؟؟
و ألف شكر لك مرة أخرى....
رد: أيقونات موقع fontawesome على النافبار الرئيسية
عفواً عزيزي بخصوص الزر يمكنك الذهاب الى الايقونات وتضغط على الايقونة التي تريدها بالزر الأيمن من الماوس ثم تختار اخر خيار وهو حص العنصر لتظهر لك كما يظهر في الصورة في الاسفل وقم بالخطوات من الرقم واحد تحديد الزر ثانياً اختار الديف ثم مرر على بيفور ليظهر لك css على اليمين ثم تنسخ الرقم لتستعملة في الكودali_baba كتب:بالنسبة للكود الذي قدمتَه لي، لا أعرف كيف يجب التعامل معه...
مثلا بالذهاب إلى موقع Fontawesome، و نريد أن نأخذ أيقونة الرئيسية "home"... فهي كما يلي...فكيف يمكنني أن أستبدل [href="/groups"] في الكود....
- الكود:
<i class="fa fa-home" aria-hidden="true"></i>
و شكرا لك مرة أخرى و أعتذر على الإزعاج...
وشكراً لك انك قمت بأدراج الاكواد جميعها هنا لتعم الفائدة للجميع ..
رد: أيقونات موقع fontawesome على النافبار الرئيسية
جرب عمل كود كذا
- الكود:
a[href*="/login"].mainmenu
a[href="/register"].mainmenu
رد: أيقونات موقع fontawesome على النافبار الرئيسية
السلام عليكم و رحمة الله و بركاته
ألف ألف ألف شكر لكل من ساهم في الموضوع و جزاكم الله كل الخير.
الحمد لله أن الأمر نجح بالنسبة لكل من "التسجيل" و "الدخول".... و الخطأ كان من عندي، إذ أنني نسيت أن أضع "/" قبل login و register... (و أعتذر).
و إليكم الصور....
أما بالنسبة لزر "الخروج"... فقد جربتُ كل ما جاء في الردود و كل شيء و لم ينجح الأمر... و إلكم الصورة.
الحمد لله.. أنني تمكنتُ من إضافة كل الأيقونات لكل الأزرار....
لكن يبقى فقط زر الخروج... و هذا هو الكود الذي استعملتُه، لكن دُون جدوى
أخي YasirAyad.
بالنسبة للكود الذي أشرتُ به إليك و هو كالآتي:
أما الطريقة التي أشرتَ إليها أنت، فهي تعتمد على CSS
و شكرا لك مرة أخرة.
ألف ألف ألف شكر لكل من ساهم في الموضوع و جزاكم الله كل الخير.
الحمد لله أن الأمر نجح بالنسبة لكل من "التسجيل" و "الدخول".... و الخطأ كان من عندي، إذ أنني نسيت أن أضع "/" قبل login و register... (و أعتذر).
و إليكم الصور....
أما بالنسبة لزر "الخروج"... فقد جربتُ كل ما جاء في الردود و كل شيء و لم ينجح الأمر... و إلكم الصورة.
الحمد لله.. أنني تمكنتُ من إضافة كل الأيقونات لكل الأزرار....
لكن يبقى فقط زر الخروج... و هذا هو الكود الذي استعملتُه، لكن دُون جدوى
- الكود:
a.mainmenu[href="/logout"]::before {
content: "\f08b";
color: #fff;
font-family: FontAwesome;
font-weight: normal;
font-size: 15px;
margin: 0px -10px;
}
أخي YasirAyad.
بالنسبة للكود الذي أشرتُ به إليك و هو كالآتي:
- الكود:
<i class="fa fa-home" aria-hidden="true"></i>
أما الطريقة التي أشرتَ إليها أنت، فهي تعتمد على CSS
و شكرا لك مرة أخرة.
رد: أيقونات موقع fontawesome على النافبار الرئيسية
نعم الطريقة فقط CSS
بخصوص زر الخروج تفضل الكود التالي.
بخصوص زر الخروج تفضل الكود التالي.
- الكود:
a#logout::before {
content:"\f07b";
color:#fff;
font-family:FontAwesome;
font-weight:normal;
font-size:15px;
margin:0px -10px;
}
رد: أيقونات موقع fontawesome على النافبار الرئيسية
YasirAyad كتب:نعم الطريقة فقط CSS
بخصوص زر الخروج تفضل الكود التالي.
- الكود:
a#logout::before {
content:"\f07b";
+}
ألف شكر لك أخي YasirAyad...
نجح الأمر و لله الحمد و قد ظهرت الأيقونة بجانب زر الخروج....
مرة أخرى...
أقول ألف ألف شكر لكل من ساهم معي في حل هذه المشكلة و جزاكم الله كل الخير.
رد: أيقونات موقع fontawesome على النافبار الرئيسية
تم حل المشكلة & ينقل للأرشيف.
|
مواضيع مماثلة
» بخصوص موقع كل رسائل تتحول الى فيديو!
» كيف أغير شروط التسجيل في نسخة الموبايل ؟
» ممكن طريقة تلوين كل فئة بلون لنسخة ModernBB
» كيف اعيد العارضة السوداء أعلى المنتدى
» مشكلة فى حجم الصورة فى نسخة الموبايل
» كيف أغير شروط التسجيل في نسخة الموبايل ؟
» ممكن طريقة تلوين كل فئة بلون لنسخة ModernBB
» كيف اعيد العارضة السوداء أعلى المنتدى
» مشكلة فى حجم الصورة فى نسخة الموبايل
منتدى الدعم و المساعدة لأحلى المنتديات :: منتدى الدعم والمساعدة :: قسم المشاكل الأخرى :: أرشيف قسم "المشاكل الأخرى"
صفحة 1 من اصل 1
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى