قديم 2015-06-25, 06:31 PM
المشاركة : ( 1 )
.:: ! HTML PROF ::.
الصورة الرمزية WRONG WAY
WRONG WAY
.:: EGY BASMA ::.
Post إضافة كود التنبيهات بدون هاك بإستخدام مكتبة Font Awesome
إضافة كود التنبيهات بدون هاك بإستخدام مكتبة Font Awesome
أهلا و مرحبا بكم أعضاء و زوار معهد بسمة مصرية الكرام ,,
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
موضوعنا اليوم عن طريقة إضافة التنبيهات بدون إستخدام هاكات ,, بدون إستخدام صور ,,
شرح تركيب كود التنبيهات بإستخدام مكتبة Font Awesome ,,

*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
لابد ان يحتوى موقعك على مكتبة أيقونات Font Awesome
يمكنك الحصول عليها من هذا الموقع ,,
Font Awesome, the iconic font and CSS toolkit
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
نبدأ بطريقة تركيب التنبيهات داخل منتدانا ,,
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
إذا كانت منطقة تسجيل الدخول بالهيدر ,,
1- إذهب إلى لوحة تحكم منتداك ,,
كود:
http://www.yourdomain.com/vb/admincp
2- الإستايلات والقوالب >> التحكم بالإستايلات >> إختر الإستايل الذى تريد العمل عليه ,, >> ثم إضغط على إذهب ,,
إضافة كود التنبيهات بدون هاك بإستخدام مكتبة Font Awesome
3- ناخذ نسخة احتياطية للقالب قبل التعديل ,,
4- فى قالب الهيدر إبحث عن ,,
كود:
<if condition="$show['member']">
أضف تحتها مباشرة هذا الكود ,,
كود بلغة HTML:
<!--Alert Icons By EGY BASMA - 3ashek El7ozn-->
<div class="Member-Alert">
<ul>
<li><!--رسائل خاصة-->
<if condition="$bbuserinfo[pmunread]">
<a rel="nofollow" title="الرسائل الخاصة" href="private.php"><span style="margin-top:2px;" class="fa fa-envelope"></span></a>
<div title="لديك رسائل خاصة جديدة" class="IF-Noti">$bbuserinfo[pmunread]</div>
<else />
<a rel="nofollow" title="الرسائل الخاصة" href="private.php"><span style="margin-top:2px;" class="fa fa-envelope"></span></a>
</if>
</li><!--/رسائل خاصة-->
<li><!--رسائل زوار-->
<if condition="$bbuserinfo[vmunreadcount]">
<a rel="nofollow" title="رسائل الزوار" href="member.php?u=$bbuserinfo[userid]&amp;tab=visitor_messaging"><span style="margin-top:2px;" class="fa fa-comments"></span></a>
<div title="لديك رسائل زوار جديدة" class="IF-Noti">$bbuserinfo[vmunreadcount]</div>
<else />
<a rel="nofollow" title="رسائل الزوار" href="member.php?u=$bbuserinfo[userid]&amp;tab=visitor_messaging"><span style="margin-top:2px;" class="fa fa-comments"></span></a>
</if>
</li><!--/رسائل زوار-->
<li><!--طلبات صداقة-->
<if condition="$bbuserinfo[friendreqcount]">
<a rel="nofollow" title="طلبات الصداقة" href="profile.php?do=buddylist"><span style="margin-top:2px;" class="fa fa-user-plus"></span></a>
<div title="لديك طلبات صداقة جديدة" class="IF-Noti">$bbuserinfo[friendreqcount]</div>
<else />
<a rel="nofollow" title="طلبات الصداقة" href="profile.php?do=buddylist"><span style="margin-top:2px;" class="fa fa-user-plus"></span></a>
</if>
</li><!--/طلبات صداقة-->
<li><!--تعليقات-->
<if condition="$bbuserinfo[pcunreadcount]">
<a rel="nofollow" title="تعليقات على الصور" href="album.php?do=unread"><span style="margin-top:3px;margin-right:1px;" class="fa fa-picture-o"></span></a>
<div  title="لديك تعليقات جديدة على الصور" class="IF-Noti">$bbuserinfo[pcunreadcount]</div>
<else />
<a rel="nofollow" title="تعليقات على الصور" href="album.php?do=unread"><span style="margin-top:3px;margin-right:1px;" class="fa fa-picture-o"></span></a>
</if>
</li><!--/تعليقات-->
<li>
<li><!--الإعجاب-->
<if condition="$vboptions['ls_onoff']">
<if condition="$bbuserinfo[likes_by_ali]"> 
<a rel="nofollow" title="الإعجابات" href="member.php?u=$bbuserinfo[userid]&amp;tab_likes=received#like_share_by_ali"><span style="margin-top:3px;" class="fa fa-thumbs-o-up fa-flip-horizontal"></span></a>
<div title="لديك إعجابات جديدة" class="IF-Noti"> $bbuserinfo[likes_by_ali]</div>
<else />
<a rel="nofollow" title="الإعجابات" href="member.php?u=$bbuserinfo[userid]&amp;tab_likes=received#like_share_by_ali"><span style="margin-top:3px;" class="fa fa-thumbs-o-up fa-flip-horizontal"></span></a>
</if>
</if>
</li><!--/الإعجاب-->
<li><!--التقييم-->
<if condition="$repcount">
<a rel="nofollow" title="التقييم" href="usercp.php"><span style="margin-top:4px;margin-right:1px;" class="fa fa-heart"></span></a>
<div  title="لديك تقييم جديد" class="IF-Noti">$repcount</div>
<else />
<a rel="nofollow" title="التقييم" href="usercp.php"><span style="margin-top:4px;margin-right:1px;" class="fa fa-heart"></span></a>
</if>
</li><!--/التقييم-->
</ul>
</div>
<!--/Alert Icons By EGY BASMA - 3ashek El7ozn-->
كما بالصورة ,,
إضافة كود التنبيهات بدون هاك بإستخدام مكتبة Font Awesome
5- ثم ضع هذه الأكواد فى تعاريف CSS الإضافية/Additional CSS Definitions ,,
كود:
/*Alert Icons By EGY BASMA - 3ashek El7ozn*/
.Member-Alert{
float:right;
position:absolute;
margin:20px 60px 20px 0;
}
.Member-Alert ul{
float:right;
list-style:none;
}
.Member-Alert li{
float:right;
list-style:none;
padding:0 4px 0 0;
}
.Member-Alert li a{
display:inline-block;
font-size:20px;
width:28px;
height:25px;
border-radius:50%;
padding:1px;
text-align:center;
vertical-align:bottom;
color:#A3B3C5;
margin:0 5px 0 0;
background:#E5EAEE;
box-shadow:0px 0px 0px 3px #D3D6E2;
border:4px solid #A7AEC4;
transition: all 1.5s;
}
.Member-Alert li a:hover{
box-shadow:0 0 0 3px #24356C;
border:4px solid #D2D0D0;
color:#818181;
transition: all 1.5s;
}
.IF-Noti{
position:relative;
background:#FF0000;
border-radius:7px;
color:#FFFFFF;
width:15px;
height:15px;
font-size:10px;
text-align:center;
line-height:14px;
bottom:36px;
right:30px;
padding:0 1px 0 1px;
}
/*Alert Icons By EGY BASMA - 3ashek El7ozn*/
* ملحوظة ,,
اقتباس :-
يمكنك التحكم فى مكان ظهور الأيقونات من خلال التحكم فى ,,
كود:
margin:20px 60px 20px 0;
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
أما اذا كانت منطقة تسجيل الدخول بالناف بار ,,
1- إذهب إلى لوحة تحكم منتداك ,,
كود:
http://www.yourdomain.com/vb/admincp
2- الإستايلات والقوالب >> البحث في القوالب >> إختر الإستايل الذى تريد العمل عليه >> ثم أكتب فى مكان البحث اسم القالب كما بالصورة ,,
كود:
navbar
إضافة كود التنبيهات بدون هاك بإستخدام مكتبة Font Awesome
ثم إضغط بحث ,,
3- بعد فتح القالب ناخذ نسخة احتياطية للقالب قبل التعديل ,,
4- بداخل القالب قم بالبحث عن التالى وإحذفه ,,
كود:
    <td class="alt2" nowrap="nowrap">
    <div class="smallfont">
        <strong><phrase 1="$bbuserinfo[username]" 2="member.php?$session[sessionurl]u=$bbuserinfo[userid]">$vbphrase[welcome_x_link_y]</phrase></strong><br />
        <phrase 1="$pmbox[lastvisitdate]" 2="$pmbox[lastvisittime]">$vbphrase[last_visited_x_at_y]</phrase>

        <if condition="$show['notifications']">
            <div><span id="notifications"><a href="usercp.php$session[sessionurl_q]">$vbphrase[your_notifications]:</a> <strong>$notifications_total</strong></span></div>
            <if condition="$show['popups']">
                <script type="text/javascript"> vBmenu.register("notifications"); </script>
            <else />
                <script type="text/javascript" src="clientscript/vbulletin_notifications_nopopups.js?v=$vboptions[simpleversion]"></script>
                <script type="text/javascript"> vBulletin.register_control("vB_Notifications_NoPopups", "notifications");  </script>
            </if>
        <else /><if condition="$show['pmstats']">
            <div><phrase 1="$vbphrase[unread_x_nav_compiled]" 2="$vbphrase[total_x_nav_compiled]" 3="$session[sessionurl_q]">$vbphrase[private_messages_nav]</phrase></div>
        </if></if>

        <if condition="$show['pmwarning']"><div><strong><phrase 1="$vbphrase[pmpercent_nav_compiled]">$vbphrase[your_pm_box_is_x_full]</phrase></strong></div></if>
    </div>
    </td>
<else />
<td class="alt2" nowrap="nowrap" style="padding:0px">
5- نقوم بإضافة الكود التالى مكان الذى حذفناه ,,
كود بلغة HTML:
<!--Alert Icons By EGY BASMA - 3ashek El7ozn-->
<div class="Member-Alert">
<ul>
<li><!--رسائل خاصة-->
<if condition="$bbuserinfo[pmunread]">
<a rel="nofollow" title="الرسائل الخاصة" href="private.php"><span style="margin-top:2px;" class="fa fa-envelope"></span></a>
<div title="لديك رسائل خاصة جديدة" class="IF-Noti">$bbuserinfo[pmunread]</div>
<else />
<a rel="nofollow" title="الرسائل الخاصة" href="private.php"><span style="margin-top:2px;" class="fa fa-envelope"></span></a>
</if>
</li><!--/رسائل خاصة-->
<li><!--رسائل زوار-->
<if condition="$bbuserinfo[vmunreadcount]">
<a rel="nofollow" title="رسائل الزوار" href="member.php?u=$bbuserinfo[userid]&amp;tab=visitor_messaging"><span style="margin-top:2px;" class="fa fa-comments"></span></a>
<div title="لديك رسائل زوار جديدة" class="IF-Noti">$bbuserinfo[vmunreadcount]</div>
<else />
<a rel="nofollow" title="رسائل الزوار" href="member.php?u=$bbuserinfo[userid]&amp;tab=visitor_messaging"><span style="margin-top:2px;" class="fa fa-comments"></span></a>
</if>
</li><!--/رسائل زوار-->
<li><!--طلبات صداقة-->
<if condition="$bbuserinfo[friendreqcount]">
<a rel="nofollow" title="طلبات الصداقة" href="profile.php?do=buddylist"><span style="margin-top:2px;" class="fa fa-user-plus"></span></a>
<div title="لديك طلبات صداقة جديدة" class="IF-Noti">$bbuserinfo[friendreqcount]</div>
<else />
<a rel="nofollow" title="طلبات الصداقة" href="profile.php?do=buddylist"><span style="margin-top:2px;" class="fa fa-user-plus"></span></a>
</if>
</li><!--/طلبات صداقة-->
<li><!--تعليقات-->
<if condition="$bbuserinfo[pcunreadcount]">
<a rel="nofollow" title="تعليقات على الصور" href="album.php?do=unread"><span style="margin-top:3px;margin-right:1px;" class="fa fa-picture-o"></span></a>
<div  title="لديك تعليقات جديدة على الصور" class="IF-Noti">$bbuserinfo[pcunreadcount]</div>
<else />
<a rel="nofollow" title="تعليقات على الصور" href="album.php?do=unread"><span style="margin-top:3px;margin-right:1px;" class="fa fa-picture-o"></span></a>
</if>
</li><!--/تعليقات-->
<li>
<li><!--الإعجاب-->
<if condition="$vboptions['ls_onoff']">
<if condition="$bbuserinfo[likes_by_ali]"> 
<a rel="nofollow" title="الإعجابات" href="member.php?u=$bbuserinfo[userid]&amp;tab_likes=received#like_share_by_ali"><span style="margin-top:3px;" class="fa fa-thumbs-o-up fa-flip-horizontal"></span></a>
<div title="لديك إعجابات جديدة" class="IF-Noti"> $bbuserinfo[likes_by_ali]</div>
<else />
<a rel="nofollow" title="الإعجابات" href="member.php?u=$bbuserinfo[userid]&amp;tab_likes=received#like_share_by_ali"><span style="margin-top:3px;" class="fa fa-thumbs-o-up fa-flip-horizontal"></span></a>
</if>
</if>
</li><!--/الإعجاب-->
<li><!--التقييم-->
<if condition="$repcount">
<a rel="nofollow" title="التقييم" href="usercp.php"><span style="margin-top:4px;margin-right:1px;" class="fa fa-heart"></span></a>
<div  title="لديك تقييم جديد" class="IF-Noti">$repcount</div>
<else />
<a rel="nofollow" title="التقييم" href="usercp.php"><span style="margin-top:4px;margin-right:1px;" class="fa fa-heart"></span></a>
</if>
</li><!--/التقييم-->
</ul>
</div>
<!--/Alert Icons By EGY BASMA - 3ashek El7ozn-->
كما بالصورة ,,
إضافة كود التنبيهات بدون هاك بإستخدام مكتبة Font Awesome
5- ثم ضع هذه الأكواد فى تعاريف CSS الإضافية/Additional CSS Definitions ,,
كود:
/*Alert Icons By EGY BASMA - 3ashek El7ozn*/
.Member-Alert{
float:right;
position:absolute;
margin:20px 60px 20px 0;
}
.Member-Alert ul{
float:right;
list-style:none;
}
.Member-Alert li{
float:right;
list-style:none;
padding:0 4px 0 0;
}
.Member-Alert li a{
display:inline-block;
font-size:20px;
width:28px;
height:25px;
border-radius:50%;
padding:1px;
text-align:center;
vertical-align:bottom;
color:#A3B3C5;
margin:0 5px 0 0;
background:#E5EAEE;
box-shadow:0px 0px 0px 3px #D3D6E2;
border:4px solid #A7AEC4;
transition: all 1.5s;
}
.Member-Alert li a:hover{
box-shadow:0 0 0 3px #24356C;
border:4px solid #D2D0D0;
color:#818181;
transition: all 1.5s;
}
.IF-Noti{
position:relative;
background:#FF0000;
border-radius:7px;
color:#FFFFFF;
width:15px;
height:15px;
font-size:10px;
text-align:center;
line-height:14px;
bottom:36px;
right:30px;
padding:0 1px 0 1px;
}
/*Alert Icons By EGY BASMA - 3ashek El7ozn*/
* ملحوظة ,,
اقتباس :-
يمكنك التحكم فى مكان ظهور الأيقونات من خلال التحكم فى ,,
كود:
margin:20px 60px 20px 0;
النتيجة النهائية ,,

إضافة كود التنبيهات بدون هاك بإستخدام مكتبة Font Awesome
*-.-**-.-**-.-**-.-**-.-**-.-**-.-**-.-*
وإلى هنا نكون قد وصلنا إلى نهاية موضوعنا اليوم ,,
دمتم بود ,,
إضافة كود التنبيهات بدون هاك بإستخدام مكتبة Font Awesome
الـمـصـدر : معهد بسمة مصرية - مـن : قسم تطوير الـ vBulletin - كـاتـب الـمـوضـوع : WRONG WAY

مـن مـواضـيع WRONG WAY
مساحة إعلانية
قديم 2015-06-26, 03:54 PM
المشاركة : ( 2 )
صورة رمزية إفتراضية
3saltoot
.:: عـضـو جـديـد ::.
افتراضي رد: إضافة كود التنبيهات بدون هاك بإستخدام مكتبة Font Awesome
بارك الله فيك ،،،
مبدع
قديم 2015-06-26, 04:28 PM
المشاركة : ( 3 )
.:: ! HTML PROF ::.
الصورة الرمزية WRONG WAY
WRONG WAY
.:: EGY BASMA ::.
Post رد: إضافة كود التنبيهات بدون هاك بإستخدام مكتبة Font Awesome
شرفنى مرورك يا غالى :thumb-up-facebook-e
قديم 2016-12-11, 12:06 PM
المشاركة : ( 4 )
Kurd-Sat Admin
الصورة الرمزية FOR SAT
FOR SAT
.:: مـشـرف ::.
افتراضي رد: إضافة كود التنبيهات بدون هاك بإستخدام مكتبة Font Awesome
أبدااااااااااع


إضافة كود التنبيهات بدون هاك بإستخدام مكتبة Font Awesome
أدوات الموضوع
انواع عرض الموضوع

الانتقال السريع
المواضيع المتشابهه
الموضوع
[ HTML ] تغيير كلاسات الـ Font Awesome عند الضغط عليها
[ شـرح ] طريقة إستبدال أزرار المحرر بـ مكتبة Font Awesome مع تلميحات Tooltip
[ شـرح ] إضافة Acronym Tag أو Abbr Tag بدون إستخدام VBSEO
[ Blogger ] إضافة فتات الخبز لمدونات بلوجر
[ شـرح ] شرح لكيفية إستخدام تلميحات Tooltip مع مكتبة Font Awesome