README

在Sulu中使用区域、图片项、外部URL、自定义URL等创建复杂的树形菜单。

安装

在您的composer.json中添加SuluMegamenuBundle

  composer require the-cocktail/sulu-megamenu-bundle

注册插件

在您的 config/bundles.php 中注册插件

<?php
// config/bundles.php
return [
    // ...
    TheCocktail\Bundle\MegaMenuBundle\SuluMegamenuBundle::class => ['all' => true],       
    // ...
];

使用以下命令更新您的数据：

bin/console doctrine:schema:update --force

或者执行以下SQL语句：(推荐：使用Doctrine迁移生成差异迁移)

CREATE TABLE mm_menuitem (id INT AUTO_INCREMENT NOT NULL, media_id INT DEFAULT NULL, parent_id INT DEFAULT NULL, resource_key VARCHAR(255) NOT NULL, webspace VARCHAR(255) NOT NULL, title VARCHAR(255) NOT NULL, locale VARCHAR(255) NOT NULL, uuid VARCHAR(255) DEFAULT NULL, link VARCHAR(255) DEFAULT NULL, position INT NOT NULL, INDEX IDX_D6C6460BEA9FDD75 (media_id), INDEX IDX_D6C6460B727ACA70 (parent_id), PRIMARY KEY(id)) DEFAULT CHARACTER SET utf8mb4 COLLATE `utf8mb4_unicode_ci` ENGINE = InnoDB;
ALTER TABLE mm_menuitem ADD CONSTRAINT FK_D6C6460BEA9FDD75 FOREIGN KEY (media_id) REFERENCES me_media (id);
ALTER TABLE mm_menuitem ADD CONSTRAINT FK_D6C6460B727ACA70 FOREIGN KEY (parent_id) REFERENCES mm_menuitem (id)

配置路由

# config/routes/sulu_admin.yaml

sulu_megamenu_api:
    resource: "@SuluMegamenuBundle/Resources/config/routing_api.yaml"
    type: rest
    prefix: /admin/api

配置SuluMegamenu

添加 config/packages/sulu_megamenu.yaml 并配置您所需的菜单

sulu_megamenu:
    menus:
        header_top:
            title: 'Header Top'
        header:
            title: 'Header'
        footer:
            title: 'Footer'
        footer_bottom:
            title: 'Footer Bottom'

权限

请确保您已在此插件的Sulu后端设置了正确的权限！

设置 > 用户角色

Twig函数

sulu_megamenu_render

此函数将渲染默认模板

   {{ sulu_megamenu_render('header')  }}

作为参数的自定义模板

   {{ sulu_megamenu_render('header', 'menu/header.html.twig')  }}

附加参数

   {{ sulu_megamenu_render('header', 'menu/header.html.twig', request.webspaceKey, app.request.locale)  }}

sulu_megamenu_get

获取用于在不同上下文中重用的项目

{% set items = sulu_megamenu_get('header') %}

{% include 'menu/desktop.html.twig' %}
{% include 'menu/mobile.html.twig' %}

附加参数

   {{ sulu_megamenu_get('header', request.webspaceKey, app.request.locale)  }}

享受使用它吧！