MyBB Community Forums

THEME:https://community.mybb.com/thread-228326.html

Hello everyone,
If you are using ColorFul Theme and install myalerts plugin it will look like this


Use the following tutorial if you want to look like this


GO
ACP >> Templates and style>> Templates>>Colorful Templates>>MyAlerts Templates >>myalerts_headericon
and replace everything with this

<span class="alerts {$newAlertsIndicator}">
    <a href="{$mybb->settings['bburl']}/alerts.php" class="myalerts" onclick="MyBB.popupWindow('/alerts.php?modal=1&amp;ret_link={$myalerts_return_link}', { fadeDuration: 250, zIndex: (typeof modal_zindex !== 'undefined' ? modal_zindex : 9999) }); return false;"><i class="fas fa-bell" aria-hidden="true" style="color: #fff;font-size: 15px;"></i>
       <span class="<if ($mybb->user['unreadAlerts'] == 0) then>newmessageheadericon232</if><if ($mybb->user['unreadAlerts'] > 0) then>newmessageheadericon23224-new</if>"> {$mybb->user['unreadAlerts']}</span></a>

</span>

Go
ACP >> Templates and style>> Templates>>Colorful Templates>>Header Templates>>header_welcomeblock_member

FIND THIS AND DELETE

{$myalerts_headericon}

FIND THIS

<div class="menubar-pms">
<a href="{$mybb->settings['bburl']}/private.php"><i class="fa fa-envelope" style="font-size: 15px;"></i><span class="pmnumber-box"> {$mybb->user['pms_unread']}</span></a>
 </div>

AND REPLACE WITH THIS

<div class="menubar-pms">
<a href="{$mybb->settings['bburl']}/private.php"><i class="fa fa-envelope" style="font-size: 15px;"></i><span class="pmnumber-box"> {$mybb->user['pms_unread']}</span></a>
&nbsp;
{$myalerts_headericon} 
</div>

GO
ACP>>Templates and styles>>Themes>>Colorful Theme>> custom.css
and add this

.pmnumber-box-new{padding: 5px 5px;font-size: 14px;background-color: #ff090959;margin-left: 5px;border-radius: 2px;border-right: 2px solid #00000030;}
.pmnumber-box{padding: 5px 5px;font-size: 14px;background-color: #00000030;margin-left: 5px;border-radius: 2px;border-right: 2px solid #00000030;}
.newmessageheadericon232{padding: 5px 5px;font-size: 14px;background-color: #00000030;margin-left: 5px;border-radius: 2px;border-right: 2px solid #00000030;}
.newmessageheadericon23224-new{padding: 5px 5px;font-size: 14px;background-color: #ff090959;margin-left: 5px;border-radius: 2px;border-right: 2px solid #00000030;}

DONE

you can do it by using font icon in my alerts language file.

this isnt working for me in lobos theme can you help me ....when i do the same thing , i am not getting the envelop icon and my whole navigation goes down ....mean it come out of header

sure, contact with me on discord Lobos#8684