[CSCN] Moving Staff Tools to Nav Group

[CSCN] Moving Staff Tools to Nav Group 1.0.1

No permission to download
Overview Updates (2) Reviews (5) History Discussion
ShikiSuen

ShikiSuen

Well-known member
ShikiSuen submitted a new resource:

Put StaffBar into NavBar. - Put StaffBar into NavBar (not effective within @xf-responsiveNarrow).

View attachment 224184

Step 1: Edit PAGE_CONTAINER. Find the following block:
HTML: 
            <div class="p-nav-opposite">
                <div class="p-navgroup p-account .....
And add this line right beneath this block: <xf:include template="template_pnavStaffBar" />
Then it looks like:
HTML: 
            <div class="p-nav-opposite">
                <div class="p-navgroup p-account {{ $xf.visitor.user_id ? 'p-navgroup--member' ...
Click to expand...

Read more about this resource...
 
Brilliant idea and simple to execute, thank you for sharing!

I moved the link after the username field and label it "ModCP" (I always liked how that sounded from using vBulletin).

Screen Shot 2020-05-04 at 9.15.44 PM.webp
 
Pandemix said:
Brilliant idea and simple to execute, thank you for sharing!

I moved the link after the username field and label it "ModCP" (I always liked how that sounded from using vBulletin).

View attachment 224328
Click to expand...
The Admin CP is within that menu.
You can check through the codes and call the hidden Admin CP button out, if you wish.

Beware that there will be more button show out if you have new notifications of approving queues and reports.
 
ShikiSuen said:
The Admin CP is within that menu.
You can check through the codes and call the hidden Admin CP button out, if you wish.

Beware that there will be more button show out if you have new notifications of approving queues and reports.
Click to expand...

Since I'm the only admin I'm willing to overlook that detail for now.

Maybe it's also worth mentioning the reports link will show up when there are active reports; this was my only concern going in but you've handled it perfectly.

Screen Shot 2020-05-04 at 9.25.44 PM.webp
 
Pandemix said:
Since I'm the only admin I'm willing to overlook that detail for now.

Maybe it's also worth mentioning the reports link will show up when there are active reports; this was my only concern going in but you've handled it perfectly.

View attachment 224329
Click to expand...
Is this really a good idea to keep all of those texts shown up?
I mean, considering the page-container width, the entire tab-bar may look over-condensed.
 
ShikiSuen said:
(I want to see notification badges directly on the wrench icon, seriously. This will make other badge icons useless.)
Click to expand...

Great idea! I couldn't resist giving it a shot and think I came up with a solid solution. This is the first time I have really worked with XenForo templates so bare with me, but here are my results:

Screen Shot 2020-05-04 at 10.26.18 PM.png

  1. Adds the total # of posts awaiting approval + total open reports together in main badge
  2. Moves approval queue and reports badge into separate dropdown menu
  3. Deletes approval/reports links from main menu
Here's the final code I came up with for the new template_pnavStaffBar template. I hope you can use this and if you see anything that can be improved let me know - it's running on my forum now!

HTML: 
<xf:if contentcheck="true">
    <xf:contentcheck>
        <xf:if contentcheck="true">
            <a class="p-navStaffBar p-navgroup-link p-navgroup-link-staffbar p-navgroup-link--iconic p-navgroup-link--moderatortools badgeContainer {{ ($xf.session.reportCounts.total OR ($xf.visitor.is_moderator && $xf.session.unapprovedCounts.total)) ? ' badgeContainer--highlighted' : '' }}"
                data-xf-click="menu" data-xf-key="alt+m" role="button" tabindex="0" aria-expanded="false" aria-haspopup="true"
                data-badge="{{ $xf.session.reportCounts.total|number + $xf.session.unapprovedCounts.total|number }}"
                title="{{ phrase('moderator') }}"
                aria-label="{{ phrase('approval_queue')|for_attr }}"
                aria-expanded="false"
                aria-haspopup="true">
                <i aria-hidden="true"></i>
                <span class="p-navgroup-linkText">{{ phrase('admin_navigation.tools') }}</span>
            </a>
            <div class="menu menu--structural" data-menu="menu" aria-hidden="true">
                <div class="menu-content">
                    <h4 class="menu-header">{{ phrase('admin_navigation.tools') }}</h4>
                    <xf:contentcheck>
                        <!--[XF:mod_tools_menu:top]-->
                        <xf:if is="$xf.visitor.is_admin">
                            <a href="{{ base_url('admin.php') }}" class="menu-linkRow" title="{{ phrase('admin_control_panel') }}">{{ phrase('admin_control_panel') }}</a>
                        </xf:if>
                        <xf:if is="$xf.visitor.is_moderator">
                            <a href="{{ link('approval-queue') }}" class="menu-linkRow badgeContainer{{ ($xf.visitor.is_moderator && $xf.session.unapprovedCounts.total) ? ' badgeContainer--highlighted' : '' }}" data-badge="{$xf.session.unapprovedCounts.total|number}">{{ phrase('approval_queue') }} </a>
                        </xf:if>
                        <xf:if is="$xf.visitor.is_moderator && !$xf.options.reportIntoForumId">
                            <a href="{{ link('reports') }}" class="menu-linkRow badgeContainer{{ $xf.session.reportCounts.total ? ' badgeContainer--highlighted' : '' }}" data-badge="{{ $xf.session.reportCounts.assigned ? $xf.session.reportCounts.assigned|number . ' / ' . $xf.session.reportCounts.total|number : $xf.session.reportCounts.total|number }}" title="{{ $xf.session.reportCounts.lastBuilt ? phrase('last_report_update:')|for_attr . ' ' . date_time($xf.session.reportCounts.lastBuilt) : '' }}">{{ phrase('reports') }} </a>
                        </xf:if>
                        <!--[XF:mod_tools_menu:bottom]-->
                    </xf:contentcheck>
                </div>
            </div>
        </xf:if>
        <xf:if is="$xf.visitor.is_admin">
            <a href="{{ base_url('admin.php') }}" class="p-navStaffBar p-navgroup-link p-navgroup-link-staffbar p-navgroup-link--iconic p-navgroup-link--admincp" target="_blank" title="{{ phrase('admin') }}" aria-label="{{ phrase('reports')|for_attr }}" aria-expanded="false" aria-haspopup="true">
                <i aria-hidden="true"></i>
                <span class="p-navgroup-linkText">{{ phrase('admin') }}</span>
            </a>
        </xf:if>
    </xf:contentcheck>
</xf:if>
 
Last edited:
Pandemix said:
Great idea! I couldn't resist giving it a shot and think I came up with a solid solution. This is the first time I have really worked with XenForo templates so bare with me, but here are my results.
Click to expand...
The experience of coding templates for XenForo is better than that for vBulletin 3.8, esp. LASS stylesheet system.
(SASS is better but it requires Ruby.)
 
ShikiSuen updated [CSCN] Moving Staff Tools to Nav Group with a new update entry:

1.0.0 Update

Finally, I decided to make this feature (previously exclusive in CSCN-Anniversary theme) into a standalone addon. This plugin turns the XF original staff bar into three parts:

1. The enhanced Alert menu: For Moderators, if there are incoming new reports or approval queue items, the bell icon will be turned into a badged alarm-clock icon indicating moderators & administrators their existence.

2. In the top-right side of Alert menu, the entry links (as badged icons) of reports & approval queue always shown up. // Its CSS style has been specifically tweaked in this style to make sure it always look good in most 3rd-party styles.

3. The wrench-screwdriver icon (to the left of user menu icon) functions as an admin-only button to AdminCP. However, if you installed any add-ons with entries added to the staffbar moderators menu, then this wrench-screwdriver icon will be also available to moderators and will show a dropdown menu containing those new entries introduced by those add-ons.
See the description of this addon.
Click to expand...
 
Ah ok thank you but the problem is that I do not know what to add to this line, if I take this line "& .p-navgroup-link --moderatortools i: after {
.m-faContent (@ fa-var-tools, 1em); " and that I put my link there which is therefore moderatorpanel nothing happens there
Screenshot_5.webp

Sorry to bother you I'm not very good at coding all this,

@Jeremy P Can you help me with this please?
 
I don't use this add-on, so my ability to offer support for it or any modifications thereof are rather limited. In any case, you have a space before --moderatortools which may be the culprit.
 
Is this code good? I don't think so because I ain't no results on my side I'm in despair lol

.p-navStaffBar.p-navgroup-link.p-navgroup-link-staffbar.p-navgroup-link--iconic.p-navgroup-link--moderatorpanel:before
{
display: inline-block;
font-family: Font Awesome 5 Pro;
content: "\f641";
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
margin-right: 5px;
}

( code I put in the '' EXTRA.LESS "
@Jeremy P @ShikiSuen Sorry for the inconvenience
 
Last edited:
#Wz said:
Is this code good? I don't think so because I ain't no results on my side I'm in despair lol

.p-navStaffBar.p-navgroup-link.p-navgroup-link-staffbar.p-navgroup-link--iconic.p-navgroup-link--moderatorpanel:before
{
display: inline-block;
font-family: Font Awesome 5 Pro;
content: "\f641";
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
margin-right: 5px;
}

( code I put in the '' EXTRA.LESS "
@Jeremy P @ShikiSuen Sorry for the inconvenience
Click to expand...
You study how XenForo default template uses FontAwesome, period.
 
#Wz said:
Good evening,

When will the plugin be updated to support xenforo 2.2.8?
Click to expand...
You are suggested to directly upgrade to see how XF auto style merge function works.

My manual update is scheduled to be done in the incoming January, unless there are failure cases reported regarding the automerge.

P.S.: Could you please drop me an URL of your site with this theme applied? Just my curiosity.
 
You must log in or register to reply here.
Back
Top Bottom