Soma

MarkupSimpleNavigation

Recommended Posts

Hi everyone!

How can I make just all children of root (home) unclickable (they should be the parents of their children but not clickable)?

Share this post


Link to post
Share on other sites
On 10.11.2017 at 9:11 AM, Donald said:

Hi everyone,

I just do not understand how to use css styles with markup simple navigation in the right way.

Could anyone post very basic examples for a complete markup simple navigation tree (with the options and the css styles) for a very basic responsive recursive navigation. If possible with hamburger button for small displays or a basic recursive accordeon  navigation.

Very basic examples would help as long the navigation is responsive and recursive and as the styles already added.

There's nothing special about it. Just as you normally would style a navigation. The module doesn't do that for you, it just outputs a nice clean nested UL, just a few classes for parents and active.

https://www.smartmenus.org/docs/ Is a simple JS Script to generate dropdowns and also resposive. You can drop the smartmenu plugin with their CSS and mobile hamburger button as in the docs (further down) and add the id and class to the outer tpl <ul id="main-nav" class="..."> of MarkupSimpleNavigation and it works out of the box,

Share this post


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

There's nothing special about it. Just as you normally would style a navigation. The module doesn't do that for you, it just outputs a nice clean nested UL, just a few classes for parents and active.

https://www.smartmenus.org/docs/ Is a simple JS Script to generate dropdowns and also resposive. You can drop the smartmenu plugin with their CSS and mobile hamburger button as in the docs (further down) and add the id and class to the outer tpl <ul id="main-nav" class="..."> of MarkupSimpleNavigation and it works out of the box,

Hi Soma, for my old post I already found a solution. The only thing I need one level not clickable like:

HOME A               B            C                D

            a_1           b_1

            a_2           b_2      etc.

The links on the level with (A B C D) should not be clickable at all. Your module works just fine and I just do not want A B C D to be clickable

Share this post


Link to post
Share on other sites

Hook to MarkupSimpleNavigation::getTagString to alter the item:

Little more in the docs on the hook to alter the output of an item: https://github.com/somatonic/MarkupSimpleNavigation#hook-for-custom-item-string-new-in-120

If your top level pages use their own template you could easily use "xtemplates" options to render the items differently using the template you specify there.

Share this post


Link to post
Share on other sites

If I just refer to the default rendering of your module (forget about css styles and other templates):

I can see every level (from root, A B C D down to grandchildren) getting rendered just fine.

Is there nothing really short, quick and dirty like <a href="#">A</a> to tell your module

Otherwise, maybe they are a few more things to explore about your module. I have to have a closer look again.

Thanks for helping me anyways!

 

 

Share this post


Link to post
Share on other sites

No theres nothing short except the xtemplates option.

Share this post


Link to post
Share on other sites

Hey guys,

i want to limit the children of a page (id:1101) to 3 children. Can somebody help me with the hook?

selector_level2" => "limit=3" <- this would do it for all parents..

best regards

Share this post


Link to post
Share on other sites
31 minutes ago, maxf5 said:

Hey guys,

i want to limit the children of a page (id:1101) to 3 children. Can somebody help me with the hook?

selector_level2" => "limit=3" <- this would do it for all parents..

best regards

I'm not sure this needs a hook or even possible with one. 

You could use the 

'selector_field' => 'nav_selector',
    // string (default 'nav_selector') define custom PW selector by using a property or field on a page. Use this setting if you want to overwrite the default nav_selector

to use a field or a property (can be runtime) to define the selector.

See docs: https://github.com/somatonic/MarkupSimpleNavigation#added-support-for-nav_selector-propertyfield-and-selector_leveln-new-in-121

Share this post


Link to post
Share on other sites

Hey @Soma

thank you. I already know that solution and i am using it for the website, 'selector' => 'navhide!=1', (it's a checkbox)

I wanted to get something dynamic when a new children is added.  The parent is the news-listing and the children are the news; you get the point.

I can live with that workaround for the moment ^-^

Share this post


Link to post
Share on other sites

What do you mean? It's not the "selector" option it's the "selector_field" option, where you can define selectors dynamicly, and it's not a workaround but especially for cases like this.

Share this post


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

Hi guys, is it possible to set a menu item that points to an external url? Thank you

You can add any field you like for the url in the item tpl.

ie: "<a href='{external_url|url}'>{title}</a>"

Create a page with an URL field "external_url".

Share this post


Link to post
Share on other sites

So I finally pushed the large children branch performance fix and upped version to 1.3.5. Thanks for being patient.

Share this post


Link to post
Share on other sites
41 minutes ago, gmclelland said:

Hi @Soma,

When I try to upgrade to the newest version of the module using https://github.com/ryancramerdesign/ProcessWireUpgrade, I get the following message for some reason.

Session: Invalid download URL specified

I've tried on several sites.  Not sure what is wrong?

Thanks for the note. I'm not sure, looks like while editing the module entry the download url got fu. There was just a number. I corrected that and it seems to work again?

Not sure how the download url field can be a number only and if you clicked download on the module page you got to page not found... :o

  • Like 1

Share this post


Link to post
Share on other sites

Hi guys,

I'm currently building a dropdown navigation to map the page tree, what schematically looks like this:

|-- Link
+-- Parent
      |-- Child
      |-- Child
      +-- Parent
            |-- Child
            |-- Child
            +-- Parent
                 |-- Child
                 |-- Child

Is it possible to repeat the triggering link of the drop-downs (which should not link to the parent page) inside the dropdowns? The parent link for each submenu should appear again at the top of each submenu.

|-- Link
+-- Parent (Trigger)
      |-- Parent
      |-- Child
      |-- Child
      +-- Parent (Trigger)
            |-- Parent
            |-- Child
            |-- Child
            +-- Parent (Trigger)
                 |-- Parent
                 |-- Child
                 |-- Child

It would be great if this could be solved with MarkupSimpleNavigation? Thank you!

Share this post


Link to post
Share on other sites

Hi,

I have a tree with 3 sublevels and I'm trying to build a sidebar navigation that shows the children when there are children and the siblings when there are no children. The code below doesn't seem to work for me.... the output is alway the complete tree, on every page.

<?php

//sideBarMenuNav change items to view 
if($page->hasChildren) {  //we are on a first level parent page so show sencond level
	$entries = $page->children;
} else {   //we are on second level so show siblings to actual page
	$entries = $page->siblings;
};

$sideBarMenu = $modules->get("MarkupSimpleNavigation");
$options = array(
	'current_class' => 'current-menu-item',
	'has_children_class' => 'has_children',
	'max_levels' => 2,
	'collapsed' => false,
	'show_root' => true,
	'outer_tpl' => '<ul class="menu vertical sidebar_menu">||</ul>',
	'inner_tpl' => '<ul class="menu vertical nested">||</ul>',
	'item_tpl' => '<a href="{url}">{title}</a>',
	'item_current_tpl' => '<a href="{url}">{title}</a>',
);
echo $sideBarMenu->render($options, null, $entries );


It is the approach of mr-fan, from here:


What's wrong with my code? The contents of the variable "entries" are correct, for each page level.

Thanks!

 

Share this post


Link to post
Share on other sites
On 17.1.2018 at 10:59 AM, anyway said:

Hi guys,

I'm currently building a dropdown navigation to map the page tree, what schematically looks like this:

|-- Link
+-- Parent
      |-- Child
      |-- Child
      +-- Parent
            |-- Child
            |-- Child
            +-- Parent
                 |-- Child
                 |-- Child

Is it possible to repeat the triggering link of the drop-downs (which should not link to the parent page) inside the dropdowns? The parent link for each submenu should appear again at the top of each submenu.

|-- Link
+-- Parent (Trigger)
      |-- Parent
      |-- Child
      |-- Child
      +-- Parent (Trigger)
            |-- Parent
            |-- Child
            |-- Child
            +-- Parent (Trigger)
                 |-- Parent
                 |-- Child
                 |-- Child

It would be great if this could be solved with MarkupSimpleNavigation? Thank you!

There's no option for this. There's some jquery code I posted to do this client side.

https://processwire.com/talk/topic/1036-markupsimplenavigation/?page=22&tab=comments#comment-139794

Share this post


Link to post
Share on other sites
On 20.1.2018 at 8:36 AM, anyway said:

Hi,

I have a tree with 3 sublevels and I'm trying to build a sidebar navigation that shows the children when there are children and the siblings when there are no children. The code below doesn't seem to work for me.... the output is alway the complete tree, on every page.


<?php

//sideBarMenuNav change items to view 
if($page->hasChildren) {  //we are on a first level parent page so show sencond level
	$entries = $page->children;
} else {   //we are on second level so show siblings to actual page
	$entries = $page->siblings;
};

$sideBarMenu = $modules->get("MarkupSimpleNavigation");
$options = array(
	'current_class' => 'current-menu-item',
	'has_children_class' => 'has_children',
	'max_levels' => 2,
	'collapsed' => false,
	'show_root' => true,
	'outer_tpl' => '<ul class="menu vertical sidebar_menu">||</ul>',
	'inner_tpl' => '<ul class="menu vertical nested">||</ul>',
	'item_tpl' => '<a href="{url}">{title}</a>',
	'item_current_tpl' => '<a href="{url}">{title}</a>',
);
echo $sideBarMenu->render($options, null, $entries );


It is the approach of mr-fan, from here:


What's wrong with my code? The contents of the variable "entries" are correct, for each page level.

Thanks!

 

I don't think you want to have 

'show_root' => true,

There's no root to show if you add a $entries PageArray. It's only for if you add 1 root page to the navigation options  

Share this post


Link to post
Share on other sites

Thanks a lot for the hints, Soma! Everything works now as expected. I misunderstood the concept of' show_root' => true,

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 kixe
      Email Verification
      This module provides functions to validate email adresses and hosts. The module generates a textfile for blacklisted mailhosts (trashmail), which will be always up to date.
      Download
      https://modules.processwire.com/modules/email-verification/
      API
      // get module $mailcheck = $modules->get('EmailVerification'); // return bool/ string - automatted update of blacklist file $mailcheck->blacklisted(email|domain) // return bool - validate a top level domain, checks against IANA list $mailcheck->validTLD(tld) // return array of punycoded TLDs - cyclic updated, data pulled from IANA $mailcheck->getTLDs(cycle=2592000) // return bool - checks syntax converts to punycode $mailcheck->validDomainName(domain); // return bool - checks punycode encoded syntax $mailcheck->validHostName(host); // return bool - checks syntax and accessibility $mailcheck->validHost(email|domain) // add a single value to blacklist $mailcheck->addToBlacklist(email|domain) USAGE
      $mailcheck = $modules->get('EmailCheck'); $email = 'susi@trashmail.com'; if($mailcheck->blacklisted($email)) echo 'Email Provider not allowed'; if(!$mailcheck->validHost($email)) echo 'Mailhost not available'; Example blacklist file:  blacklist.txt
       
    • By teppo
      Code Blocks Textformatter is a tiny Textformatter module I cooked up to add support for code blocks to text/textarea/RTE fields on some of the sites I work with. Unlike a full-blown Markdown Textformatter – which is something that we already have in the core – this module simply adds support for fenced and inline code blocks.
      The syntax is based on the GitHub code block documentation, so please refer to that for additional instructions. The README at GitHub also includes some basic examples. As with any Textformatter, in order to enable this one, install it and enable it via field settings. Note that there's no syntax highlighting built in (at least for the time being), so use a tool of your choice for that – personally I prefer Prism.js.
      Since this module doesn't use a Markdown tool behind the scenes, but rather some home baked regular expressions, there's always the possibility that I've missed something – but please let me know if you use this module and run into any issues. On the other hand this module should be relatively fast and unobtrusive, as there are no unnecessary bits of code to run 
      GitHub repository: https://github.com/teppokoivula/TextformatterCodeBlocks Modules directory: http://modules.processwire.com/modules/textformatter-code-blocks/
    • By theo
      Here is my first processwire module (beta).
      https://github.com/theo222/ImagePickerField
      A lot of "first times". First time Github, Markdown and of course PW Modules.
      So be gentle please.
      I hope it works.

    • By horst
      Image Animated GIF  v 2.0.2
       
      Module for PW 2.5 stable or newer, but is obsolete for PW Versions greater then 3.0.89 (... read more ...)
       
      This module helps with resizing and cropping of animated GIFs when using the GD-Library.
      The GD-Library does not support this.


      This module is completely based upon the fantastic work of

         László Zsidi (http://www.gifs.hu/, builts the initial classes)
         xurei (https://github.com/xurei/GIFDecoder_optimized, enhanced the classes)


      I have ported it to a PW module and it works with core imagefields, together with Pia and with CropImagefields that uses the new naming scheme since PW 2.5.
       
      ------------------------------------------------------------------------------------------------------------------------------------------
      read more in this post about the rewrite from version 1.0.0 to version 2.0.0
      ------------------------------------------------------------------------------------------------------------------------------------------
      You can find it in the modules directory: https://modules.processwire.com/modules/image-animated-gif/
      and on Github: https://github.com/horst-n/ImageAnimatedGif
      ------
      A preview can be found here