MenuManager

A plugin to enable management of menus within October CMS

Back to MenuManager Support

rickybarnett1179
rickybarnett1179

Hi,

I have a menu in a partial:

[menu] start = "id-9" activeNode = "id-9" listItemClasses = "item" primaryClasses = "nav nav-pills" secondaryClasses = "dropdown-menu" numberOfLevels = 2

If I render the component like so:

{% component 'menu' %}

It works as normal, if I try the syntax/markup manually it doesn't work?


{% if parentNode and parentNode.getChildCount %}
    {% for primaryNav in parentNode.getChildren %}
        {% if primaryNav.enabled %}
            
  • {{ primaryNav.title }}
  • {% endif %} {% endfor %} {% endif %}

    I need my own markup so can't use the default.

    Last updated

    benfreke
    benfreke

    Hi Ricky

    What you need to do, is in your theme over-ride the markup of the component. You still need to include it on the page, which is why it's not displaying unless use use {% component 'menu' %}

    https://octobercms.com/forum/post/overriding-plugins-templates?page=1 seems to be a simple way to over-ride output to do what you need to do.

    I have a memory of this working, and I know I posted about it. But that was when OctoberCMS was in beta, so it may no longer be possible.

    point4d27635
    point4d27635

    Here, i fixed it :- )

        /**
        plugins\benfreke\menumanager\components\Menu.php
         */
    <?php namespace BenFreke\MenuManager\Components;
    
    use App;
    use BenFreke\MenuManager\Models\Menu as menuModel;
    use Cms\Classes\ComponentBase;
    use DB;
    use Lang;
    use Request;
    
    class Menu extends ComponentBase
    {   
        public $topNode;
        public $activeNode;
        public function componentDetails()
        {
            return [
                'name'        => 'benfreke.menumanager::lang.menu.name',
                'description' => 'benfreke.menumanager::lang.menu.description'
            ];
        }
    
        /**
         * @return array
         * @todo Change start to parentNode to match my naming
         */
        public function defineProperties()
        {
            return [
                'start'            => [
                    'description' => 'benfreke.menumanager::lang.component.start.description',
                    'title'       => 'benfreke.menumanager::lang.component.start.title',
                    'default'     => 1,
                    'type'        => 'dropdown'
                ],
                'activeNode'       => [
                    'description' => 'benfreke.menumanager::lang.component.activenode.description',
                    'title'       => 'benfreke.menumanager::lang.component.activenode.title',
                    'default'     => 0,
                    'type'        => 'dropdown'
                ],
                'listItemClasses'  => [
                    'description' => 'benfreke.menumanager::lang.component.listitemclasses.description',
                    'title'       => 'benfreke.menumanager::lang.component.listitemclasses.title',
                    'default'     => 'item',
                    'type'        => 'string'
                ],
                'primaryClasses'   => [
                    'description' => 'benfreke.menumanager::lang.component.primaryclasses.description',
                    'title'       => 'benfreke.menumanager::lang.component.primaryclasses.title',
                    'default'     => 'nav nav-pills',
                    'type'        => 'string'
                ],
                'secondaryClasses' => [
                    'description' => 'benfreke.menumanager::lang.component.secondaryclasses.description',
                    'title'       => 'benfreke.menumanager::lang.component.secondaryclasses.title',
                    'default'     => 'dropdown-menu',
                    'type'        => 'string'
                ],
                'tertiaryClasses'  => [
                    'description' => 'benfreke.menumanager::lang.component.tertiaryclasses.description',
                    'title'       => 'benfreke.menumanager::lang.component.tertiaryclasses.title',
                    'default'     => '',
                    'type'        => 'string'
                ],
                'numberOfLevels'   => [
                    'description' => 'benfreke.menumanager::lang.component.numberoflevels.description',
                    'title'       => 'benfreke.menumanager::lang.component.numberoflevels.title',
                    'default'     => '2', // This is the array key, not the value itself
                    'type'        => 'dropdown',
                    'options'     => [
                        1 => '1',
                        2 => '2',
                        3 => '3'
                    ]
                ]
            ];
        }
    
        /**
         * Returns the list of menu items, plus an empty default option
         *
         * @return array
         */
        public function getActiveNodeOptions()
        {
            $options = $this->getStartOptions();
            array_unshift($options, 'default');
    
            return $options;
        }
    
        /**
         * Returns the list of menu items I can select
         *
         * @return array
         */
        public function getStartOptions()
        {
            $menuModel = new menuModel();
    
            return $menuModel->getSelectList();
        }
    
        /**
         * Build all my parameters for the view
         *
         * @todo Pull as much as possible into the model, including the column names
         */
        public function onRun()
        {
            // Set the parentNode for the component output
            $this->topNode = menuModel::find($this->getIdFromProperty($this->property('start')));
            $this->page['parentNode'] = $this->topNode;
    
            // What page is active?
            $this->page['activeLeft'] = 0;
            $this->page['activeRight'] = 0;
            $this->activeNode = $this->getIdFromProperty($this->property('activeNode'));
    
            if ($this->activeNode) {
    
                // It's been set by the user, so use what they've set it as
                $this->activeNode = menuModel::find($this->activeNode);
            } elseif ($this->topNode) {
    
                // Go and find the page we're on
                $baseFileName = $this->page->page->getBaseFileName();
    
                // Get extra URL parameters
                $params = $this->page->controller->getRouter()->getParameters();
    
                // And make sure the active page is a child of the parentNode
                $this->activeNode = menuModel::where('url', $baseFileName)
                    ->where('nest_left', '>', $this->topNode->nest_left)
                    ->where('nest_right', '<', $this->topNode->nest_right);
    
                $this->activeNode = $this->activeNode->first();
            }
    
            // If I've got a result that is a node
            if ($this->activeNode && menuModel::getClassName() === get_class($this->activeNode)) {
                $this->page['activeLeft'] = (int)$this->activeNode->nest_left;
                $this->page['activeRight'] = (int)$this->activeNode->nest_right;
            }
    
            // How deep do we want to go?
            $this->page['numberOfLevels'] = (int)$this->property('numberOfLevels');
    
            // Add the classes to the view
            $this->page['primaryClasses'] = $this->property('primaryClasses');
            $this->page['secondaryClasses'] = $this->property('secondaryClasses');
            $this->page['tertiaryClasses'] = $this->property('tertiaryClasses');
            $this->page['listItemClasses'] = $this->property('listItemClasses');
        }
    
        /**
         * Gets the id from the passed property
         *  Due to the component inspector re-ordering the array on keys, and me using the key as the menu model id,
         *  I've been forced to add a string to the key. This method removes it and returns the raw id.
         *
         * @param $value
         *
         * @return bool|string
         */
        protected function getIdFromProperty($value)
        {
            if (!strlen($value) > 3) {
                return false;
            }
    
            return substr($value, 3);
        }
    
    }

    `

    point4d27635
    point4d27635

    Works only if you select Active Node, though. Needs more fixing ;- )

    1-4 of 4