MaryMatlow

@kongondo and @Robin S thank you for your help. The textarea field worked. You guys are super. I had been reading that Processwire is structured in such a way that all code is kept out of page edit level because of security concerns. Should I be worried about using code here? Thanks.

@kongondo I did take a look at Hanna Code but really wouldn't know how to set it up. As I explained, I've to put this code snippet at the page editor level, to pull in data from server. I need to pull different data on different pages so that's why can't put in one common template. There is nothing much to it. @Robin S Yes it would occur in the same place, but the thing is I want to use the same template for all pages rather than creating separate ones. What field type would I use to place the code snippet into. I tried textarea fieldtype but it didn't work.

At page editor level I need to place a piece of code which is unique to that page. This is the code: <healcode-widget data-type="class_lists" data-widget-partner="mb" data-widget-id="xxxxxxxx" data-widget-version="0.1"></healcode-widget> This code pulls in data from a third-party site. The Body Field won't accept this code. I could place this in the template file but for that I'd have to crate a separate template file for each page. I'd rather use a common "basic_page" template file for most pages. Also, I would like to give the client the ability to change/edit code when necessary if it is at page editor level. Is there any way to achieve this? Thanks.

Thank you @adrian for the prompt reply. It worked Much appreciated!!!

@Robin S The code worked fine on localhost, but when I migrate the site on server it throws this error: Fatal error: Using $this when not in object context Would you know how to fix this? Thanks.

Thank you for your thoughtful replies. I will surely explore the suggestions you've made. I've found that working with a framework is a good thing, it frees you from sweating over small/routine stuff. But that's me. In any case, I'm loving Processwire although it has been/and is going to be a steep learning curve. I'm a PHP novice. Yet, I can see the freedom and flexibility it affords. Thanks again.

@Robin S Thank you! Thank you! Your code worked, like a charm. Really indebted to you and the others who replied to my persistent queries. Really appreciate it. I don't see how this is a Bootstrap-sepecific problem. Am I the only one using Bootstrap with Processwire, and facing this problem? Just for my information, i would like to know what Framework gels best with Processwire? I concede that Bootstrap can be a bit bloated, is there a leaner and meaner framework out there? Thanks

You are correct, I'm using Bootstrap structure.

@Speed Thank you and others for your patient explanations. I tried your code with no success. The same problem persists. When I look into Dev console I get this error. You were right, it has to do with js: main.js:50 Uncaught TypeError: jQuery(...).scrollingTo is not a function(…)(anonymous function) @ main.js:50(anonymous function) @ main.js:51i @ jquery.min.js:2fireWith @ jquery.min.js:2ready @ jquery.min.js:2J @ jquery.min.js:2 When I click on main.js it points to this function: jQuery(document).ready(function(){ "use strict"; new WOW().init(); (function(){ jQuery('.smooth-scroll').scrollingTo(); }()); }); It seems it has something to do with smooth scrolling function. This is strange. How can this be resolved? Thanks once again.

@ottogal Thanks for your reply, but I don't think this can be solved by css rules. Is there a standard way to apply this navigation code? What I'm trying to do here is nothing special. All I want is first level nav, and the second level dropdown menu for the items with children. The problem is with "data-toggle=dropdown" attribute. When I remove it everything works fine, except in responsive mobile mode, the items with dropdown menu don't open up. And when I don't remove it, none of the menu items at any level are clickable. 'item_tpl' => '<a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false" aria-controls="navbar" href="{url}">{title}</a>', Again, this is all pretty standard, and it works for the rest of you. So I don't why it shouldn't it my case. It's so frustrating. Thanks.

Thanks for your responses. I have applied your suggestions and this is what my code looks like now. The issue that I see with the code is that, every single <a href> has the attributes class="dropdown-toggle" and data-toggle="dropdown". When only the links where the "has_children" class gets applied should have those. Since these attributes are applied everywhere the links become unclickable. Here's the output markup: <nav class="collapse navbar-collapse navbar-right" role="navigation"> <div class="main-menu"><ul class="nav navbar-nav"> <li class="level-1 has_children dropdown"><a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false" aria-controls="navbar" href="/classes/">Classes</a> <div class="dropdown-menu"><ul> <li class="level-2"><a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false" aria-controls="navbar" href="/classes/class-schedule/">Class Schedule</a></li> <li class="level-2"><a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false" aria-controls="navbar" href="/classes/class-descriptions/">Class Descriptions</a></li> <li class="level-2"><a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false" aria-controls="navbar" href="/classes/new-to-yoga/">New to Yoga</a></li> <li class="level-2"><a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false" aria-controls="navbar" href="/classes/teachers/">YogaSpace Teachers</a></li> </ul></div> </li> <li class="level-1"><a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false" aria-controls="navbar" href="/workshops/">Workshops</a></li> <li class="level-1"><a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false" aria-controls="navbar" href="/prices/">Prices</a></li> <li class="level-1 has_children dropdown"><a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false" aria-controls="navbar" href="/about/">About Us</a> <div class="dropdown-menu"><ul> <li class="level-2"><a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false" aria-controls="navbar" href="/about/what-we-offer/">What We Offer</a></li> <li class="level-2"><a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false" aria-controls="navbar" href="/about/the-studio/">The Studio</a></li> <li class="level-2"><a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false" aria-controls="navbar" href="/about/gallery/">Gallery</a></li> <li class="level-2"><a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false" aria-controls="navbar" href="/about/community/">Community</a></li> <li class="level-2"><a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false" aria-controls="navbar" href="/about/join-our-team/">Join Our Team</a></li> </ul></div> </li> <li class="level-1"><a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false" aria-controls="navbar" href="/contact/">Contact</a></li> </ul></div></nav> Here is my code: <?php $treeMenu = $modules->get("MarkupSimpleNavigation"); // load the module $options = array( 'has_children_class' => 'has_children dropdown', // overwrite class name for entries with children 'levels' => true, // wether to output "level-1, level-2, ..." as css class in links 'max_levels' => 2, // set the max level rendered 'selector' => 'template!=MediaLibrary', // define custom PW selector, you may sanitize values from user input 'outer_tpl' => '<nav class="collapse navbar-collapse navbar-right" role="navigation"> <div class="main-menu"><ul class="nav navbar-nav">||</ul></div></nav>', // template string for the outer most wrapper. || will contain entries 'inner_tpl' => '<div class="dropdown-menu"><ul>||</ul></div>', // template string for inner wrappers. || will contain entries 'list_tpl' => '<li%s>||</li>', // template string for the items. || will contain entries, %s will replaced with class="..." string 'list_field_class' => '', // string (default '') add custom classes to each list_tpl using tags like {field} i.e. {template} p_{id} 'item_tpl' => '<a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false" aria-controls="navbar" href="{url}">{title}</a>', // template string for the inner items. Use {anyfield} and {url}, i.e. {headline|title}, if field is of type image it will return url to image (first image if multiple) 'item_current_tpl' => '<a class="current" href="{url}">{title}</a>', // template string for the active inner items. ); echo $treeMenu->render($options); // render menu ?>

Hello, Anyone out there who can help!!!! I'm new to Processwire and was hoping for an active community here.

Yes, its the source code from browser. And below is the screenshot from the Chrome Inspect window:

Sure. Here's the php code: <?php $treeMenu = $modules->get("MarkupSimpleNavigation"); // load the module $options = array( 'parent_class' => 'parent', // overwrite class name for current parent levels 'current_class' => 'current', // overwrite current class 'has_children_class' => 'has_children', // overwrite class name for entries with children 'levels' => true, // wether to output "level-1, level-2, ..." as css class in links 'levels_prefix' => 'level-', // prefix string that will be used for level class 'max_levels' => 2, // set the max level rendered 'firstlast' => false, // puts last,first class to link items 'collapsed' => false, // if you want to auto-collapse the tree you set this to true 'show_root' => false, // set this to true if you want to rootPage to get prepended to the menu 'selector' => 'template!=MediaLibrary', // define custom PW selector, you may sanitize values from user input '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 'outer_tpl' => '<nav class="collapse navbar-collapse navbar-right" role="navigation"> <div class="main-menu"><ul class="nav navbar-nav">||</ul></div></nav>', // template string for the outer most wrapper. || will contain entries 'inner_tpl' => '<div class="dropdown-menu"><ul>||</ul></div>', // template string for inner wrappers. || will contain entries 'list_tpl' => '<li class="dropdown">||</li>', // template string for the items. || will contain entries, %s will replaced with class="..." string 'list_field_class' => '', // string (default '') add custom classes to each list_tpl using tags like {field} i.e. {template} p_{id} 'item_tpl' => '<a class="dropdown-toggle" data-toggle="" href="{url}">{title}</a>', // template string for the inner items. Use {anyfield} and {url}, i.e. {headline|title}, if field is of type image it will return url to image (first image if multiple) 'item_current_tpl' => '<a class="current" href="{url}">{title}</a>', // template string for the active inner items. 'xtemplates' => '', // specify one or more templates separated with a pipe | to use the xitem_tpl and xitem_current_tpl markup 'xitem_tpl' => '<a href="{url}">{title}</a>', // same as 'item_tpl' but for xtemplates pages, can be used to define placholders 'xitem_current_tpl' => '<span>{title}</span>', // same as 'item_current_tpl' but for xtemplates pages 'date_format' => 'Y/m/d', // default date formatting for Datetime fields and native created/modified 'code_formatting' => true, // enable or disable code indentations and newslines in markup output 'debug' => false, // show some inline information about rendertime and selectors used as html comments ); echo $treeMenu->render($options); // render menu ?> And here's the output code: <!-- main menu --> <nav class="collapse navbar-collapse navbar-right" role="navigation"> <div class="main-menu"><ul class="nav navbar-nav"> <li class="dropdown"><a class="dropdown-toggle" data-toggle="" href="/classes/">Classes</a> <div class="dropdown-menu"><ul> <li class="dropdown"><a class="dropdown-toggle" data-toggle="" href="/classes/class-schedule/">Class Schedule</a></li> <li class="dropdown"><a class="dropdown-toggle" data-toggle="" href="/classes/class-descriptions/">Class Descriptions</a></li> <li class="dropdown"><a class="dropdown-toggle" data-toggle="" href="/classes/new-to-yoga/">New to Yoga</a></li> <li class="dropdown"><a class="dropdown-toggle" data-toggle="" href="/classes/teachers/">YogaSpace Teachers</a></li> </ul></div> </li> <li class="dropdown"><a class="dropdown-toggle" data-toggle="" href="/workshops/">Workshops</a></li> <li class="dropdown"><a class="dropdown-toggle" data-toggle="" href="/price-passes/">Prices</a></li> <li class="dropdown"><a class="current" href="/about/">About Us</a> <div class="dropdown-menu"><ul> <li class="dropdown"><a class="dropdown-toggle" data-toggle="" href="/about/what-we-offer/">What We Offer</a></li> <li class="dropdown"><a class="dropdown-toggle" data-toggle="" href="/about/the-studio/">The Studio</a></li> <li class="dropdown"><a class="dropdown-toggle" data-toggle="" href="/about/gallery/">Gallery</a></li> <li class="dropdown"><a class="dropdown-toggle" data-toggle="" href="/about/community/">Community</a></li> <li class="dropdown"><a class="dropdown-toggle" data-toggle="" href="/about/join-our-team/">Join Our Team</a></li> </ul></div> </li> <li class="dropdown"><a class="dropdown-toggle" data-toggle="" href="/contact/">Contact</a></li> </ul></div></nav> <!-- /main nav --> Appreciate your help. Thanks.

I'm using MarkupSimpleNav and somehow the main level item with children do not have the "has_children" class name appended to it? What am I doing wrong? Thanks

I'm facing a strange problem. I'm using the MrkupSimpleNavigation module. In the _navigation.php file when the data-toggle attribute has the "dropdown" value the menu items are unclickable on Web and Mobile. The dropdown opens on all devices but can't be clicked. When I remove the "dropdown" value everything works but on mobile the submenu doesn't open up. I searched on this forum and elsewhere but couldn't find anything. Would anyone of you experts know what is wrong. Here's my _navigation.php code: <?php $treeMenu = $modules->get("MarkupSimpleNavigation"); // load the module $options = array( 'parent_class' => 'parent', // overwrite class name for current parent levels 'current_class' => 'current', // overwrite current class 'has_children_class' => 'has_children', // overwrite class name for entries with children 'levels' => true, // wether to output "level-1, level-2, ..." as css class in links 'levels_prefix' => 'level-', // prefix string that will be used for level class 'max_levels' => 2, // set the max level rendered 'firstlast' => false, // puts last,first class to link items 'collapsed' => false, // if you want to auto-collapse the tree you set this to true 'show_root' => false, // set this to true if you want to rootPage to get prepended to the menu 'selector' => 'template!=MediaLibrary', // define custom PW selector, you may sanitize values from user input '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 'outer_tpl' => '<nav class="collapse navbar-collapse navbar-right" role="navigation"> <div class="main-menu"><ul class="nav navbar-nav">||</ul></div></nav>', // template string for the outer most wrapper. || will contain entries 'inner_tpl' => '<div class="dropdown-menu"><ul>||</ul></div>', // template string for inner wrappers. || will contain entries 'list_tpl' => '<li class="dropdown">||</li>', // template string for the items. || will contain entries, %s will replaced with class="..." string 'list_field_class' => '', // string (default '') add custom classes to each list_tpl using tags like {field} i.e. {template} p_{id} 'item_tpl' => '<a class="dropdown-toggle" data-toggle="dropdown" href="{url}">{title}</a>', // template string for the inner items. Use {anyfield} and {url}, i.e. {headline|title}, if field is of type image it will return url to image (first image if multiple) 'item_current_tpl' => '<a class="current" href="{url}">{title}</a>', // template string for the active inner items. 'xtemplates' => '', // specify one or more templates separated with a pipe | to use the xitem_tpl and xitem_current_tpl markup 'xitem_tpl' => '<a href="{url}">{title}</a>', // same as 'item_tpl' but for xtemplates pages, can be used to define placholders 'xitem_current_tpl' => '<span>{title}</span>', // same as 'item_current_tpl' but for xtemplates pages 'date_format' => 'Y/m/d', // default date formatting for Datetime fields and native created/modified 'code_formatting' => true, // enable or disable code indentations and newslines in markup output 'debug' => false, // show some inline information about rendertime and selectors used as html comments ); echo $treeMenu->render($options); // render menu ?>

BitPoet, thank you for your hint. Adding this to MarkupSimpleNavigation php file worked: 'selector' => 'template!=MediaLibrary', Is there a way to access the MediaLibrary through the "choose file" button through admin. This button appears when you include images field for the page. Thanks once again for your help and a great module.

No, I had not. Thanks, it did help. Also, I want show just the search button or icon and on click make the search field open up. Is there a way to do that? Thanks.

This may be a dumb question, but how do in call it on the page? What would be the markup? Thanks.

Hi, I'm new to Processwire and being a PHP novice having a hard time mastering its many complexities. I'm trying to use MediaLibrary but am stuck with a frustrating issue. When I add a Library, the library name appears in the main site navigation - this being a page, obviously. And when I make it hidden, the library page disappears from the Media list, and also from the dropdown when I access is via CKEditor. What am I doing wrong? Your help would be appreciated.