What

This recipe will show you how to:

  1. Add a search box to any Rock Settings page that filters down the list of child pages as you type
  2. Create a page for quickly viewing and searching all setting pages
  3. Sort Setting Child Page links alphabetically by running a small SQL update statement
  4. Add a search box to the Rock Shop

Why

It is not immediately clear what settings are found under what pages. Navigating to a setting page can also be difficult because the child pages are not sorted in alphabetical order. Implementing this recipe will save time/clicks especially for new admins in Rock.

How

1. Adding a search box to a Rock Settings page

Here is what we are going to create:

Settings_Page_With_Search_Box.png

When you start typing in the search box any page whose name does not contain the search term will disappear.

For example just these two pages are left to click on after I type the search term "Tag".

Settings_Page_With_Search_Box_Search_Term_Tag.png

Setup
  1. Navigate to a Settings page such as the "CMS Configuration" page.
  2. Edit the Page Menu block on the page update the Template field with the code here: https://pastebin.com/yZZ0izmX
    Screenshot_2021-12-22_174006.png

2. Create an All Rock Settings page

Here is what we are going to create:

This page will have a panel for each child page under Admin Tools.

Screenshot_2021-12-30_100545.jpg


Setup
  1. Under the Rock Settings Page add a child page called "All Settings".
    Screenshot_2021-12-30_102228.jpg
  2. Add a Page Menu block to the page.
  3. Set Number of Levels setting to 2 in your Page Menu block 
  4. Change the Template field setting in your Page Menu block with this code: https://pastebin.com/n0jBY3yS
    image.png
  5. Set the Root Page setting in your Page Menu block to "Rock Settings".

3. Sort Setting Child Page links alphabetically on all Setting Pages

This can be quickly accomplished by running an update SQL statement via SSMS or the SQL Command page under Power Tools.

After clearing the cache the pages on each setting page will show up in Alphabetical order.

Screenshot_2021-12-30_113855.jpg

4. Bonus Search Rock Shop 

This same pattern can be applied to other areas of Rock such as the rock shop promo results. All we are doing is adding a little jquery to limit a set of elements on a page.  As long as you can load a page with all the elements you want to search (i.e. without paging) this pattern can be applied. 
Here is what it looks like in the Rock shop:
  1. Update the Featured Promos block to show all promos
    Screenshot_2022-07-28_141937.jpg
  2. Update the lava template for the Featured Promos block with this template: https://pastebin.com/v6bjyXB8

This template has ja couple differences from template featured above to add search to the a rock setting page.

The first difference is that we are using a different selector for our jquery filter function on line 24:

Screenshot_2022-07-28_153751.jpg

The second difference is a change to the last line.
Screenshot_2022-07-28_153927.jpg

This line includes the original lava that builds the promo results we intend to filter.


Follow Up

Please don't hesitate to leave a comment or message me on Rocket Chat (@tony.visconti) if you have questions or find any issues with this recipe.
The Rock community site doesn't currently notify recipe authors when you comment below. 

Change Log

~2022-01 Initial Version
~2022-07-28 Add another example of how this search pattern can be used on the Rock Shop page.
~2022-09-18 Simplified instructions for updating the template field on referenced page menu blocks.