Jump to content
kongondo

Menu Builder

Recommended Posts

On 3/24/2020 at 4:03 PM, maddmac said:

Just a question that might be answered in a previous post. If I want to apply a class to the <a> tag how would I do this using the module options?

See the two posts above yours 😀. Currently, this is not possible if using the render() method but I have added it to my todo list.

  • Like 2

Share this post


Link to post
Share on other sites
7 hours ago, kongondo said:

Actually, this is not true 😀.

I don't know what version you are using but there has always been a save as unpublished or published during menu creation and an unpublish/publish action that can be applied to existing menu items in the menus list/table. See the big green shiny buttons 😁.

Am I missing something?

You're right, It just wasn't obvious at the time, now that I create another menu it's fine, i must have been smoking something.. 🚬🍀

Thanks for this great module!!

Share this post


Link to post
Share on other sites

Hey,

I searched the forum, but I couldn't find any post with a topic of the problem that I am facing with the module. 

I setup multilingual menues nd have different roles which have the menu-builder permission. As soon as Editors save a Menu, the custom title translations of the menu are gone. Menu Item titles of the default language are editable as a non-admin user, but all other language titles are ignored / deleted on save.

Are only admin users allowed to edit title translations?

Thanks for a short hint on that.

Share this post


Link to post
Share on other sites

Hi,

I am using Menu builder on a new multi-language web site. It's a simple use case : only on level on the main menu.
It'is working fine. Thanks again for the module.
However I have one issue. the class for the current item is not rendered in the html.

My code is like this

$menu = $modules->get('MarkupMenuBuilder');
$options = array(
                                            'current_class' => 'active',
                                                                         );

echo $menu->render('MainMenu', $options);

One point though : each menu item is a "custom item" with a url to the page and url segments (2 or 3) and all the menu item points to the same page (with different url segment).

Do you think this is the reason why the current class is not present in the html ? If so is there any workaround ?

Thanks a lot

Share this post


Link to post
Share on other sites
1 hour ago, antpre said:

It'is working fine. Thanks again for the module.

Glad you find the module useful.

1 hour ago, antpre said:

One point though : each menu item is a "custom item" with a url to the page and url segments (2 or 3) and all the menu item points to the same page (with different url segment).

I am not sure I understand this statement. By, "custom item", do you mean external links? (e.g., processwire.com). If not, please explain.

Thanks.

Share this post


Link to post
Share on other sites

Kongondo,

I am refering to the 3 choices you have to add a menu item in the admin interface of the module : Pages / Custom /selector.

Each of the menu item are using the custom option. here are 2 items of this menu

1534615158_Screenshot2020-06-25at11_33_06.png.936ea634153b4a01e4060a7e4f626e05.png1738638171_Screenshot2020-06-25at11_32_46.png.744dd42d6bfbd8075ae16ada3224cd47.png

The base url is the same, cause this a single process wire page, and the 2 last bit of the url are the url segments (ie /type/talk or /type/cours).
 

Share this post


Link to post
Share on other sites
Posted (edited)
2 hours ago, antpre said:

2 last bit of the url are the url segments (

My hunch is that this is the reason. I don't think I ever tested MB with url segments. I'll have to look into this. Not sure when though, sorry.

By the way, although the option to use HTML in the title is available, I'd encourage you to use the method getMenuItems() instead (in your template file). It is much more powerful and will give you full control over the markup.

Edited by kongondo

Share this post


Link to post
Share on other sites

Hello,

Im kinda lost here, can't make it work, what am I doing wrong here. It kinda work but not the way it should it looks messy.

HTML:

<nav class="collapse">
  <ul class="nav nav-pills" id="mainNav">
    <li class="dropdown"><a class="dropdown-item dropdown-toggle" href="#">Features</a>
      <ul class="dropdown-menu">
        <li class="dropdown-submenu">
          <a class="dropdown-item" href="#">Headers</a>
            <ul class="dropdown-menu">
            	<li><a class="dropdown-item" href="feature-headers-overview.html">Overview</a></li>
            </ul>
        </li>
      </ul>
    </li>
  </ul>
</nav>
												<?php 
												$menu = $modules->get('MarkupMenuBuilder');
												$options = array(
													'wrapper_list_type' => 'ul',// ul, ol, nav, div, etc.
													'list_type' => 'li',// li, a, span, etc.
													'menu_css_id' => 'mainNav',// a CSS ID for the menu
													'menu_css_class' => 'nav nav-pills',// a CSS Class for the menu
													'submenu_css_class' => 'dropdown dropdown-menu dropdown-item',// CSS Class for sub-menus
													'has_children_class' => 'dropdown dropdown-submenu',// CSS Class for any menu item that has children
													'first_class'=>'',// CSS Class for the first item in 
													'last_class' => '',
													'current_class' => 'active',
													'default_title' => 0,// 0=show saved titles;1=show actual/current titles
													'include_children' => 4,// show 'natural' MB non-native descendant items as part of navigation
													'm_max_level' => 5,// how deep to fetch 'include_children'
													'current_class_level' => 1,// how high up the ancestral tree to apply 'current_class'
													'default_class' => '',// a CSS class to apply to all menu items
												);
												echo $menu->render(1022, $options);
												?>

This is the best combination I could found that doesn't look totaly broken.

Any help appreciated

thank you

R

Share this post


Link to post
Share on other sites
1 hour ago, Roych said:

Im kinda lost here, can't make it work

How should it work? What is not working? 😊

1 hour ago, Roych said:

what am I doing wrong here

Impossible to tell since we don't know what is not working and what you mean by 'working'.

1 hour ago, Roych said:

It kinda work but not the way it should it looks messy.

No idea what this means. What do you mean messy? Maybe show us what you are trying to replicate first.

1 hour ago, Roych said:

I could found that doesn't look totaly broken.

Is it broken or does it look broken? What is broken? Looks like valid HTML to me.

@Roych, please give a better description and/or illustration of how you want the menu output to appear. Thanks.

Share this post


Link to post
Share on other sites

Sorry for beeing so unclear.

So the menu doesnt look like it should. The main menu looks ok, but the submenu looks messy. It does not work as in normal html. I guess my classes in code are not in the right place.

posting gifs below

Looking good: (original HTML)

Working.gif.a732f35b18a017a9fd8c6684b9f19f95.gif

 

Not looking good (my code)

Not-Working.gif.08a9c1c6a3d9b1abe815a3873ec17f46.gif

 

I hope Im making more sense now

Thank you

R

Share this post


Link to post
Share on other sites
1 hour ago, Roych said:

I guess my classes in code are not in the right place.

Probably. Please copy paste here the original menu HTML that you are trying to replicate.

Share this post


Link to post
Share on other sites
19 minutes ago, kongondo said:

Probably. Please copy paste here the original menu HTML that you are trying to replicate.

here is my original html (already posted above) 😉

<nav class="collapse">
  <ul class="nav nav-pills" id="mainNav">
    <li class="dropdown"><a class="dropdown-item dropdown-toggle" href="#">Features</a>
      <ul class="dropdown-menu">
        <li class="dropdown-submenu">
          <a class="dropdown-item" href="#">Headers</a>
            <ul class="dropdown-menu">
            	<li><a class="dropdown-item" href="feature-headers-overview.html">Overview</a></li>
            </ul>
        </li>
      </ul>
    </li>
  </ul>
</nav>

Thank you

R

Share this post


Link to post
Share on other sites
2 minutes ago, Roych said:

here is my original html (already posted above) 😉

I thought this was the output from echo $menu->render(1022, $options);, hence the confusion. In that case then, please post the 'messy/broken' output that results from echo $menu->render()....

Share this post


Link to post
Share on other sites
1 hour ago, kongondo said:

I thought this was the output from echo $menu->render(1022, $options);, hence the confusion. In that case then, please post the 'messy/broken' output that results from echo $menu->render()....

Here it is:

<ul id="mainNav" class="nav nav-pills">
	<li class="active">
		<a href='/'>Domov</a>
	</li>
	<li class="dropdown dropdown-submenu">
		<a href='/about/'>Mladi</a>
		<ul class="dropdown dropdown-menu dropdown-item">
			<li class="dropdown dropdown-submenu">
				<a href='/site-map/'>Site Map</a>
				<ul class="dropdown dropdown-menu dropdown-item">
					<li class="dropdown dropdown-submenu">
						<a href='#'>Test 1</a>
						<ul class="dropdown dropdown-menu dropdown-item">
							<li>
								<a href='#'>Test 2</a>
							</li>
						</ul>
					</li>
				</ul>
			</li>
		</ul>
	</li>
	<li>
		<a href='#'>Test 3</a>
	</li>
</ul>

Thank you

R

Share this post


Link to post
Share on other sites

@Roych

The menu you want cannot presently be achieved by using the render() method. For instance, looking at your <li> tags, going down the levels/depth, they have different classes. This is currently not possible in MB but I will add it to my todo list, e.g. a 'levels class'.

For custom menus such as yours, it is better to use the getMenuItems() method together with a custom recursive function. Below is an example recursive function that will output the example menu you provided. You can adapt it to your needs if you find it useful. It might need a bit of polishing.

Spoiler

<?php namespace ProcessWire;

function buildMenuFromObject($parent = 0, $menu, $first = 0, $level = 0) {
 if (!is_object($menu)) return;

 $level += 1;

 //------- LEVELS CLASSES -------
 //
 $liLevelClasses = '';
 $aLevelClasses = 'dropdown-item';
 if ($level === 1) {
  $liLevelClasses = 'dropdown';
  $aLevelClasses .= ' dropdown-toggle';
 } elseif ($level === 2) $liLevelClasses = 'dropdown-submenu';
 
 //----------

 $out = '';
 $hasChild = false;
 foreach ($menu as $m) {
  // if this menu item is a parent; create the sub-items/child-menu-items
  if ($m->parentID == $parent) {

   // if this is the first child
   if ($hasChild === false) {
    $hasChild = true; // is a parent
    // top/outer <ul></ul>
    if ($first == 0) {
     $out .= "<ul id='mainNav' class='nav nav-pills'>\n";
     $first = 1;
    }
    // submenu/inner <ul></ul>
    else $out .= "\n<ul class='dropdown-menu'>\n";
   }

   // CLASSES FINAL
   // ** li classes **
   // current class
   if ($m->isCurrent) $liLevelClasses .= ' active';
   $liClasses = $liLevelClasses ? " class='{$liLevelClasses}'" : '';

   // ** anchor classes **
   $aClasses = $aLevelClasses ? " class='{$aLevelClasses}'" : '';

   // anchor link (hash for top 2, else real URL)
   $href = $level < 3 ? '#' : $m->url;
   //---------
   // single menu item
   $out .= "<li$liClasses><a$aClasses href='$href'>{$m->title}</a>";

   // call function again to generate nested list for sub-menu items belonging to this menu item.
   $out .= buildMenuFromObject($m->id, $menu, $first, $level);
   $out .= "</li>\n";

  } // end if parent

 } // end foreach

 if ($hasChild === true) {
  $out .= "</ul>\n";
 }
 return $out;

}

//---------------- END FUNCTIONS -------------
$options = array('include_children' => 1, 'm_max_level' => 3);
$mb = $modules->get('MarkupMenuBuilder');
/* grab menu items as a WireArray with Menu objects */
$menuItems = $mb->getMenuItems(1022, 2, $options);
// render custom menu
echo '<nav class="collapse">' . buildMenuFromObject(0, $menuItems) . '</nav>';

 

 

  • Like 1

Share this post


Link to post
Share on other sites

Yes, it would be a great feature for the module. Im mostly using MB. 😉 Thank you for the code I'll try to addapt it to my needs 😉 

Thank you very much

R

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.

  • Similar Content

    • By d'Hinnisdaël
      Format Datetime fields as Carbon instances.
      You can find the latest release and the complete readme on Github.
      Installation
      composer require daun/datetime-carbon-format Usage
      All Datetime fields will now be formatted as Carbon instances instead of strings. Some examples:
      // $page->date is a Datetime field // Output format: j/n/Y echo $page->date; // 20/10/2020 echo $page->date->add('7 days'); // 27/10/2020 echo $page->date->format('l, F j'); // Monday, October 20 echo $page->date->year; // 2020 echo $page->date->diffForHumans(); // 28 minutes ago Frontend only
      The ProcessWire admin seems to expect datetime fields to be strings. This module will only return Carbon instances on frontend page views.
      Date output format
      When casting a Carbon instance to a string (usually when outputting the field in a template), the field's date output format will be respected.
      Links
      GitHub • Readme • Carbon docs
       
       
      PS. I remember reading about a Carbon module in a recent newsletter, but couldn't find it anywhere. Was that you, @bernhard?
    • By MoritzLost
      TrelloWire
      This is a module that allows you to automatically create Trello cards for ProcessWire pages and update them when the pages are updated. This allows you to setup connected workflows. Card properties and change handling behaviour can be customized through the extensive module configuration. Every action the module performs is hookable, so you can modify when and how cards are created as much as you need to. The module also contains an API-component that makes it easy to make requests to the Trello API and build your own connected ProcessWire-Trello workflows.
      Warning: This module requires ProcessWire 3.0.167 which is above the current stable master release at the moment.
      Features
      All the things the module can do for you without any custom code: Create a new card on Trello whenever a page is added or published (you can select applicable templates). Configure the target board, target list, name and description for new cards. Add default labels and checklists to the card. Update the card whenever the page is updated (optional). When the status of the card changes (published / unpublished, hidden / unhidden, trashed / restored or deleted), move the card to a different list or archive or delete it (configurable). You can extend this through hooks in many ways: Modifiy when and how cards are created. Modify the card properties (Target board & list, title, description, et c.) before they are sent to Trello. Create your own workflows by utilizing an API helper class with many convenient utility methods to access the Trello API directly. Feedback & Future Plans
      Let me know what you think! In particular:
      If you find any bugs report them here or on Github, I'll try to fix them. This module was born out of a use-case for a client project where we manage new form submissions through Trello. I'm not sure how many use-cases there are for this module. If you do use it, tell me about it! The Trello API is pretty extensive, I'll try to add some more helper methods to the TrelloWireApi class (let me know if you need anything in particular). I'll think about how the module can support different workflows that include Twig – talk to me if you have a use-case! Next steps could be a dashboard to manage pages that are connected to a Trello card, or a new section in the settings tab to manage the Trello connection. But it depends on whether there is any interest in this 🙂 Links
      Repository on Github Complete module documentation (getting started, configuration & API documentation) TrelloWire in the modules directory Module configuration

    • By David Karich
      ProcessWire InputfieldRepeaterMatrixDuplicate
      Thanks to the great ProModule "RepeaterMatrix" I have the possibility to create complex repeater items. With it I have created a quite powerful page builder. Many different content modules, with many more possible design options. The RepeaterMatrix module supports the cloning of items, but only within the same page. Now I often have the case that very design-intensive pages and items are created. If you want to use a content module on a different page (e.g. in the same design), you have to rebuild each item manually every time.
      This module extends the commercial ProModule "RepeaterMatrix" by the function to duplicate repeater items from one page to another page. The condition is that the target field is the same matrix field from which the item is duplicated. This module is currently understood as proof of concept. There are a few limitations that need to be considered. The intention of the module is that this functionality is integrated into the core of RepeaterMatrix and does not require an extra module.
      Check out the screencast
      What the module can do
      Duplicate multible repeater items from one page to another No matter how complex the item is Full support for file and image fields Multilingual support Support of Min and Max settings Live synchronization of clipboard between multiple browser tabs. Copy an item and simply switch the browser tab to the target page and you will immediately see the past button Support of multiple RepeaterMatrix fields on one page Configurable which roles and fields are excluded Configurable dialogs for copy and paste Duplicated items are automatically pasted to the end of the target field and set to hidden status so that changes are not directly published Automatic clipboard update when other items are picked Automatically removes old clipboard data if it is not pasted within 6 hours Delete clipboard itself by clicking the selected item again Benefit: unbelievably fast workflow and content replication What the module can't do
      Before an item can be duplicated in its current version, the source page must be saved. This means that if you make changes to an item and copy this, the old saved state will be duplicated Dynamic loading is currently not possible. Means no AJAX. When pasting, the target page is saved completely No support for nested repeater items. Currently only first level items can be duplicated. Means a repeater field in a repeater field cannot be duplicated. Workaround: simply duplicate the parent item Dynamic reloading and adding of repeater items cannot be registered. Several interfaces and events from the core are missing. The initialization occurs only once after the page load event Attention, please note!
      Nested repeaters cannot be supported technically. Therefore a check is made to prevent this. However, a nested repeater can only be detected if the field name ends for example with "_repeater1234". For example, if your MatrixRepeater field is named like this: "content_repeater" or "content_repeater123", this field is identified as nested and the module does not load. In version 2.0.1 the identification has been changed so that a field ending with the name repeater is only detected as nested if at least a two-digit number sequence follows. But to avoid this problem completely, make sure that your repeater matrix field does NOT end with the name "repeater".
      Changelog
       
      2.0.1
      Bug fix: Thanks to @ngrmm I could discover a bug which causes that the module cannot be loaded if the MatrixRepeater field ends with the name "repeater". The code was adjusted and information about the problem was provided 2.0.0
      Feature: Copy multiple items at once! The fundament for copying multiple items was created by @Autofahrn - THX! Feature: Optionally you can disable the copy and/or paste dialog Bug fix: A fix suggestion when additional and normal repeater fields are present was contributed by @joshua - THX! 1.0.4
      Bug fix: Various bug fixes and improvements in live synchronization Bug fix: Items are no longer inserted when the normal save button is clicked. Only when the past button is explicitly clicked Feature: Support of multiple repeater fields in one page Feature: Support of repeater Min/Max settings Feature: Configurable roles and fields Enhancement: Improved clipboard management Enhancement: Documentation improvement Enhancement: Corrected few typos #1 1.0.3
      Feature: Live synchronization Enhancement: Load the module only in the backend Enhancement: Documentation improvement 1.0.2
      Bug fix: Various bug fixes and improvements in JS functions Enhancement: Documentation improvement Enhancement: Corrected few typos 1.0.1
      Bug fix: Various bug fixes and improvements in the duplication process 1.0.0
      Initial release Support this module
      If this module is useful for you, I am very thankful for your small donation: Donate 5,- Euro (via PayPal – or an amount of your choice. Thank you!)
      Download this module (Version 2.0.1)
      > Github: https://github.com/FlipZoomMedia/InputfieldRepeaterMatrixDuplicate
      > PW module directory: https://modules.processwire.com/modules/inputfield-repeater-matrix-duplicate/
      > Old stable version (1.0.4): https://github.com/FlipZoomMedia/InputfieldRepeaterMatrixDuplicate/releases/tag/1.0.4
    • By picarica
      so i am trying to put CustomHooksForVariations.module, a custom module, i am placing it into site/modules direcotry yet my modules page in admin panel gives me errors
      so this is the screen show when i refresh modules, i dont know why the shole hook is written on top of the page :||

      and this next image is when i try to install it, i saw that it is not defiuned modules.php but it shouldnt need to be ?, any ways i dont want to edit site's core just to make one moulde work there has to be a way

    • By Robin S
      A new module that hasn't had a lot of testing yet. Please do your own testing before deploying on any production website.
      Custom Paths
      Allows any page to have a custom path/URL.
      Note: Custom Paths is incompatible with the core LanguageSupportPageNames module. I have no experience working with LanguageSupportPageNames or multi-language sites in general so I'm not in a position to work out if a fix is possible. If anyone with multi-language experience can contribute a fix it would be much appreciated!
      Screenshot

      Usage
      The module creates a field named custom_path on install. Add the custom_path field to the template of any page you want to set a custom path for. Whatever path is entered into this field determines the path and URL of the page ($page->path and $page->url). Page numbers and URL segments are supported if these are enabled for the template, and previous custom paths are managed by PagePathHistory if that module is installed.
      The custom_path field appears on the Settings tab in Page Edit by default but there is an option in the module configuration to disable this if you want to position the field among the other template fields.
      If the custom_path field is populated for a page it should be a path that is relative to the site root and that starts with a forward slash. The module prevents the same custom path being set for more than one page.
      The custom_path value takes precedence over any ProcessWire path. You can even override the Home page by setting a custom path of "/" for a page.
      It is highly recommended to set access controls on the custom_path field so that only privileged roles can edit it: superuser-only is recommended.
      It is up to the user to set and maintain suitable custom paths for any pages where the module is in use. Make sure your custom paths are compatible with ProcessWire's $config and .htaccess settings, and if you are basing the custom path on the names of parent pages you will probably want to have a strategy for updating custom paths if parent pages are renamed or moved.
      Example hooks to Pages::saveReady
      You might want to use a Pages::saveReady hook to automatically set the custom path for some pages. Below are a couple of examples.
      1. In this example the start of the custom path is fixed but the end of the path will update dynamically according to the name of the page:
      $pages->addHookAfter('saveReady', function(HookEvent $event) { $page = $event->arguments(0); if($page->template == 'my_template') { $page->custom_path = "/some-custom/path-segments/$page->name/"; } }); 2. The Custom Paths module adds a new Page::realPath method/property that can be used to get the "real" ProcessWire path to a page that might have a custom path set. In this example the custom path for news items is derived from the real ProcessWire path but a parent named "news-items" is removed:
      $pages->addHookAfter('saveReady', function(HookEvent $event) { $page = $event->arguments(0); if($page->template == 'news_item') { $page->custom_path = str_replace('/news-items/', '/', $page->realPath); } }); Caveats
      The custom paths will be used automatically for links created in CKEditor fields, but if you have the "link abstraction" option enabled for CKEditor fields (Details > Markup/HTML (Content Type) > HTML Options) then you will see notices from MarkupQA warning you that it is unable to resolve the links.
      Installation
      Install the Custom Paths module.
      Uninstallation
      The custom_path field is not automatically deleted when the module is uninstalled. You can delete it manually if the field is no longer needed.
       
      https://github.com/Toutouwai/CustomPaths
      https://modules.processwire.com/modules/custom-paths/
×
×
  • Create New...