Welcome, Guest!
By registering with us, you'll be able to discuss, share and private message with other members of our community.
Search the Community
Showing results for tags 'admin menu'.
Found 2 results
-
Hi guys Problem: One some menus, screen resolutions and window sizes: I've encountered a niggling issue in the Admin menu (for me at least), where long Admin menu items can cause the next menu items to not be reachable (as there is no expand / contract or scrolling functionality on the menu). The only way to access the menu items below this menu (as far as I know) is to literary go to another menu item to force the large one to contract (wtf). Solution: For me this hampers the user experience a bit. And maybe because I'm used to accordion menus... To make my life easier, I've written a little jQuery solution that can be added to the Admin menu js. This solution creates an expand / contract icon next to an Active menu item (that has a submenu and when the menu is not in the collapsed state). And without having to navigate to another menu item, it expands / contracts the active menu accordingly. The hover / fly over menu is still available. This is my first attempt at writing some code for TB, and I've decided to share it with the community. Hope it provides some value. Instructions Go to admin***\themes\default\js\admin-theme.js Find: function navSidebar() { var sidebar = $('#nav-sidebar'); sidebar.off(); $('.expanded').removeClass('expanded'); $('.maintab').not('.active').closest('.submenu').hide(); After $('.maintab').not('.active').closest('.submenu').hide(); insert the following code: /// Expand Contract Icon for Active Admin Menu Items /// // Set text for expand / contract tooltip var tooltipcontract = 'Contract dropdown menu'; var tooltipexpand = 'Expand dropdown menu'; var expandicon = '+'; var contracticon = '-'; // Finds active admin menu item and generates expand/contract icon element in opened state $('.maintab.active.has_submenu').find('a:eq(0)').append('<div class="expandcontracticon expandcontracticon-open" title="' + tooltipcontract + '">' + contracticon + '</div>'); $('.expandcontracticon').attr('style', 'background-color: #2F3237; width: 10%; float: right; margin-right: 5px; display: block; text-align: center; font-weight: bold;'); // Binds expand / contract functionality to icon $('.expandcontracticon').on('click', function (e) { // Prevents the menuitem a element from opening the default link when the icon is clicked: e.preventDefault(); /// Ensures all submenus are hidden $('.maintab').removeClass('active'); $('.maintab').removeClass('hover'); // Checks open/closed state: var checkifopen = $(this).hasClass('expandcontracticon-open'); // Does sub menu work on menu item for active and not active states // Changes icon's +- text and title tooltip depending on state if (checkifopen == true) { // If the current state is opened, close the submenu and display 'expand/+' state $(this).html(expandicon); $(this).removeClass('expandcontracticon-open'); $(this).addClass('expandcontracticon-closed'); $(this).attr('title', tooltipexpand); } else { // If the current state is closed, show the submenu and display 'contract/-' state $(this).html(contracticon); $(this).parent('a').parent('li').addClass('active'); $(this).removeClass('expandcontracticon-closed'); $(this).addClass('expandcontracticon-open'); $(this).attr('title', tooltipcontract); } }); // Checks if the Sidebar is collapsed and hides / shows icon accordingly // Check on page load $('.page-sidebar-closed').find(".expandcontracticon").hide(); $("body").not('.page-sidebar-closed').find(".expandcontracticon").show(); // Check on Toggle Sidebar menu button action and hides the icon as it's not required on collapsed sidebar // Slight timeout to allow for page-side-bar-closed class to be applied first sidebar.find('.menu-collapse').on("click", function () { setTimeout(function () { $('.page-sidebar-closed').find(".expandcontracticon").hide(); $("body").not('.page-sidebar-closed').find(".expandcontracticon").show(); }, 100); }); /// *** *** /// Save, refresh and party 😄 Hope it helps 🙂- 7 replies
-
- 1
-
-
- admin menu
- expand contract
- (and 2 more)
-
Hi Is there a way to access the FileManager directly, i.e. add a link to it in the Admin Menu? I know you can access it through a CMS page, but this feels like an unnecessary run around. Is there a more direct way? I tried creating an Admin Menu item, but not sure what the class is and I'm getting Controller not found...