mega-menu-block's Introduction

Mega Menu Block

This plugin registers an experimental Mega Menu block.

You can test the block in your browser using Playground. Try adding the Menu Menu block to a Navigation block and configure a menu template in the Settings Sidebar.

Requirements

WordPress 6.5+
PHP 7.0+

Limitations

This block is experimental, so there are a few limitations, and you will likely run into some oddities on the front end. It's recommended that you use this plugin as a starting point and adapt it to your theme.

You must be using a block theme. (e.g., Twenty Twenty-Four)
There is no support for vertically positioned Navigation blocks.
The width of each mega menu is restricted to either full width or content and wide width as defined in theme.json.
Menu template parts are created in the Site Editor. There is no UI in the Navigation block itself.

mega-menu-block's People

Contributors

Stargazers

Watchers

mega-menu-block's Issues

Error on getSite().url

I know this is experimental but i found an issue testing on my local, when you save the Mega Menu Block, It works as expected on the front end, but when you go back to the editor it throws an error when you refresh the editor:

TypeError: Cannot read properties of undefined (reading 'url')
    at edit.js:63:69
    at data.min.js?ver=7c62e39de0308c73d50c:9:2045
    at __unstableMarkListeningStores (data.min.js?ver=7c62e39de0308c73d50c:2:22094)
    at Object.__unstableMarkListeningStores (data.min.js?ver=7c62e39de0308c73d50c:2:22352)
    at p (data.min.js?ver=7c62e39de0308c73d50c:9:2010)
    at data.min.js?ver=7c62e39de0308c73d50c:9:2612
    at Qe (data.min.js?ver=7c62e39de0308c73d50c:9:2824)
    at Ye (data.min.js?ver=7c62e39de0308c73d50c:9:3141)
    at Edit (edit.js:63:27)
...

It seems that by the time the js is loaded and the block is render on the editor getSite().url retruns undefined which breaks the block, a quick fix was to adding a optional chaining operator before accessing the property fix the issue. This is probably known by you since it’s experimental, but just in case someone else encounters this issue while using it, I wanted to share the solution.

const siteUrl = useSelect( ( select ) => select( 'core' ).getSite()?.url );

By the way, thank you for all you do!

Recommend Projects

ndiego / mega-menu-block Goto Github PK

mega-menu-block's Introduction

Mega Menu Block

Requirements

Limitations

mega-menu-block's People

Contributors

Stargazers

Watchers

Forkers

mega-menu-block's Issues

Error on getSite().url

Recommend Projects

React

Vue.js

Typescript

TensorFlow

Django

Laravel

D3

Recommend Topics

javascript

web

server

Machine learning

Visualization

Game

Recommend Org

Facebook

Microsoft

Google

Alibaba

D3

Tencent