Skip to content
Grav 2.0 is officially stable. Read the announcement →

Community guidelines

Please keep discussions civil and on-topic. Repeated violations may lead to a temporary ban.

General

Plugin/theme Menu Builder?

plugin plugins theme

Started by Rayan 7 years ago · 6 replies · 2420 views
7 years ago

Hi everyone !

I was hoping to find if there is a "menu builder" from a plugin or theme that allow to modify your menu as you wish ?
Actually I did this menu : https://codepen.io/BirdOne/pen/rPydKy (thanks to some help from Grav's users), and I was actually hoping if there is some plugin/theme that can help me to change it and to build another menu "easily" with just somes clicks like Taxonomy list or like in Wordpress.

My goal is to create a 3D environment and give Grav as a tool to common users of the web. This way my environnement (and btw Grav too) will have more users even if they don't know how to code one simple line in html/css/php/twig.

Sorry if my english is broken and thanks all for your help.

7 years ago

Hi @BirdOne, my Bootstrap4 Open Matter theme supports building menus using standard Grav Blueprint elements.

Here is the relevant Blueprint code:
https://github.com/hibbitts-design/grav-theme-bootstrap4-open-matter/blob/master/blueprints.yaml#L211-L237

And related Theme template code:
https://github.com/hibbitts-design/grav-theme-bootstrap4-open-matter/blob/master/blueprints.yaml#L211-L237

You can download the Open Course Hub skeleton for a work demo too.

Hope the above helps!
Paul

7 years ago

Hi @paulhibbitts, thanks you for your reply. I'm trying to get how your code is working. Shall I replace the file blueprints.yaml by your code ?

I already read Grav tutorial about blueprints but since I'm French I can't get 100% what they're explaining (even if my english is still ok). Before using your code I'd like to understand it. Do you have a video that explain or show how we can use it ? Or even screens after the installation ? 🙂

I'd like to understand.

Thx for your help Paul ! 😃

last edited 02/04/19 by Rayan
7 years ago

No, more is needed than just replacing the existing blueprint file. Depending on what theme you are using you would add the relevant YAML code to that blueprint. In addition, if you are wanting these changes to be kept after any theme updates you should create an inherited theme.

You could post the existing theme's blueprints.yaml file and I can try to add the needed menu building YAML as a first step. Next step would be to modify the template in your theme to display the menu items.

last edited 02/04/19 by Paul Hibbitts
7 years ago

Hi @paulhibbitts

I uploaded the theme on mega.nz just here : https://mega.nz/#!hUUlRArC!La3K658-sRSBnkBNKBFtXOPhYvcXoGTQA0cutuPDGtw

You can also find it on Github : https://github.com/GhezziRayhan/theme

It's the basical theme when you create it with dev tools ... I didn't do a lot of modifcation since I don't know what I shall change 😢 . I'd like to be able to create any menu I want from just somes clicks like this one : image|690x331

Like creating items with sub-items, change orders items, the color background but with buttons to helps "casual" people that don't know how to code.

Thanks a lot for your help Paul !

Edit : I was looking for something made in wordpress and here it is : https://fr.wordpress.org/plugins/admin-menu-editor/ this plugin can grant you lot of things about editing your menu ! I'd like to create something like that for Grav, If we can create such a plugin I'd like to upload it as a plugin for Grav for everyone.

Edit 2 : I don't things I've such competence to create it alone, if someone would like to help me on this (you're concerned Paul !), I'll take it. It will help Grav to become a better CMS !

last edited 02/05/19 by Rayan
7 years ago

I can help you with creating the menu items themselves via a Blueprint, but not the presentation of the menu as you shared above. Grav does not have a visual menu builder, but as I mentioned you can use Blueprints to create Grav theme menus. Someone else here more experience in CSS/HTML might be able to help though...

Here is what a modified theme blueprint would look like to support creating a simple list of custom menu items (I am using the same Blueprint YAML as I use for my Bootstrap4 Open Matter Theme):

YAML
name: Meza
version: 0.1.0
description: Theme Meza
icon: rebel
author:
  name: Rayhan
  email: <your email>
homepage: <your repo>
demo: <you demo>
keywords: grav, theme, etc
bugs: <your repo>/issues
readme: <your repo>/README.md
license: MIT

form:
  validation: loose
  fields:
    dropdown.enabled:
        type: toggle
        label: Dropdown in Menu
        highlight: 1
        default: 1
        options:
          1: PLUGIN_ADMIN.ENABLED
          0: PLUGIN_ADMIN.DISABLED
        validate:
          type: bool

    menubar:
        type: section
        title: 'Menubar'
        underline: true

    displaycustommenus.enabled:
        type: toggle
        label: 'Display Custom Menu Items'
        help: 'Determines if any defined custom menu entries are displayed in the menubar.'
        default: 0
        highlight: 1
        options:
            1: 'Yes'
            0: 'No'
        validate:
            type: bool

    custommenu:
        name: menu
        type: list
        label: 'Custom Menubar Items'
        fields:
            .text:
                type: text
                label: Text
                description: 'Text label for menu item.'
            .icon:
                type: text
                label: Icon
                description: 'Font Awesome icon for menu item.'
            .url:
                type: text
                label: URL
                description: 'URL for menu item.'
            .target:
                type: select
                label: Target
                default: _self
                size: medium
                options:
                    _blank: 'Open in a new window'
                    _parent: 'Open in the parent frame'
                    _top: 'Open in the full body of the window'
                    _self: 'Open in the same frame as clicked'

The above will allow you to create a simple list of custom menubar items in your Theme settings, and the results are saved to user/config/themes/THEMENAME.yaml

I might still be not understanding what you are asking for - the above is to create custom menu items that are not Grav pages within a site. With the term 'Menu Builder' what exactly are you looking for? Depending on your needs etc you might also want to check out Gantry (http://gantry.org/) for Grav and RocketTheme Gantry themes (https://rockettheme.com/grav/themes).

last edited 05/31/24 by pamtbaau
7 years ago

I'd like to create a plugin. This plugin have to show an interface that will help you to create your menu like in this photo :
image|324x329

For this you have to be able to chose the position (center, right, left) choose how the menu will show, the menu order page(1.Menu 2.Dashboard 3.User ...), sub-menus, how the menu is build (in line ? in block ?). This way you can create menu with simple actions.

Thanks for grant, in first view it seem to be helpful ! Thanks too for the Blueprint YALM !

last edited 02/06/19 by Rayan

Suggested topics

Topic Participants Replies Views Activity
General · by Jerry Hunt, 4 days ago
2 82 11 hours ago
General · by pamtbaau, 17 hours ago
1 55 16 hours ago
General · by Andy Miller, 1 day ago
0 45 1 day ago
General · by Marcel, 12 months ago
6 348 5 days ago
General · by Duc , 5 days ago
3 43 5 days ago