Menus

Usage

Here you can create and edit multiple menus for your website/app. You can have different menus for different parts of your website (the header and footer for example), or even for specific pages. Each menu should have it's own unique keyword. You can call a menu directly in the template with a helper function by using it's keyword as parameter:

{{ menu('main') }}

This will output the menu in an unstyled unordered list. If you are using bootstrap you can also call:

{{ menu('main', 'bootstrap') }}

You also have the option to use your own template to render a menu. Say you have blade template in resources/views/main_menu.blade.php:

{{ menu('main', 'main_menu') }}

And here is an example code for the actual template:

<ul>
	@foreach($menuItems as $item)

		@if($item->parent == 0)
			<li @if(url()->current() == $item->link) class="active" @endif>
				<a href="{{ $item->link }}" @if($item->new_window == 1) target="_blank" @endif>
					{!! $item->icon !!} {{ $item->name }}
				</a>
				@if($item->children_count > 0)
					<ul>
						@foreach($item->children as $child)
							<a href="{{ $child->url }}" @if($item->new_window == 1) target="_blank" @endif>
								{!! $item->icon !!} {{ $child->name }}
							</a>
						@endforeach
					</ul>
				@endif
			</li>
		@endif
		
	@endforeach
</ul>

You can also get the menu items as a collection or json:

use TaffoVelikoff\HotCoffee\Facades\HotCoffee;
...

// Get menu items as collection
$menuItems = HotCoffee::menu('main', 'collection');

// Get as a json string
$menuItems = HotCoffee::menu('main', 'json');

For each menu you are able to add, delete and edit elements or re-arrange them with a simple drag and drop interface.

Fields

Title

If your app supports more than one language you will see flag icons at the top of the popup window when creating a new element. Clicking a flag will show the name field for that language/locale. HotCoffee is using spatie/laravel-translatable to make the menu items translatable. So if you need to echo the name of an element you only have to do this: {{ $item->name }}. The easiest way to get a translation for the current locale is to just get the property for the translated attribute. If you need to get the translation in a specific locale you can use {{ $item->getTranslation($attribute, $locale) }}. Refer to spatie/laravel-translatable's documentation to learn more.

Translations are possible thanks to the spatie/laravel-translatable package.

URL

In the "URL" field you can specify where the element should lead your visitors to. You got a few options:

  • Enter a full url, starting with "http://" or "https://" to link an external website. Example: https://google.com/

  • This will create a link to any part of your website. Example: home (will prouce http://yourwebsite.com/home)

  • For single page websites you can enter the name of the section (starting with "#") to scroll down to it. Example: #about

  • If you want to link to one of the info pages you have created chose it from the drop down menu. In this case any URL entered in the field above will be ignored by the system.

  • Leave empty if you don't want to link to anything and just use the element as a title for a submenu.

Icon

In the "Icon code" field you can paste font awesome icon code (or any other package you are using) to add an icon for the element.

Last updated