1LD Tutorials & Blogs

Tutorials

Setup

1. Drag and drop the Quick Finder stack into the Stacks editor.

2. Next, place the content that you want to be searchable inside of the Quick Finder Content stack. Quick Finder treats each nested stack as one single item. So if you put Stack A inside of Stack B, it will treat Stack B as a part of Stack A. If you want Stack A and Stack B to be individual items, place them each within the content stack, but not within another stack or with one inside of the other.

Here’s a visual representation:
cleanTut-01a

3. The Quick Finder Content stack does not need to stay nested in the Quick Finder stack and can be dragged and placed in another location.

4. Select the Quick Finder stack and in the settings menu navigate to the Settings tab and select a Search Function to determine how the stack will handle the search bar input.

Search Function: Show all, narrow results on input
The stack will show all items when the search bar is empty. When a user adds text to the search bar it will hide items that do not contain the current search term or phrase.

Search Function: Hide all, find results on input
The stack will hide all items when the search bar is empty. When a user adds text to the search bar it will show items that contain the current search term or phrase.

Search Function: Show all, sort all on input
The stack will show all items when the search bar is empty. When a user adds text to the search bar it will sort all items with those that contain the current search term or phrase at the top.

5. Optionally enable case sensitive matches.

Case sensitive matches only
When enabled, the search will only find a match when the searched term or phrase is exactly as typed with upper and lower case characters.

6. Using the next option, we can enable search suggestions to make sorting through items even faster. These suggestions will show below the search bar when it is focused. If a suggestion is clicked it will automatically populate the search bar and execute a search using the predefined term or phrase.

Show search suggestions
When enabled, a textfield will display. Here you can define your search term or phrase suggestions in a comma separated list.

7. In the settings menu Search Input Styles section you can change the appearance of the search bar. The customization options are all pretty straight forward and will only affect the appearance of the stack.

8. There are also style settings for the Quick Finder Content

Max width
The Quick Finder Content stack will automatically fill the width of the stack you place it inside of. Use this setting to define a maximum width you want the items to display.

Columns
Define how many items you want in a single row based on screen size. There is also a forth input for setting (Gap) the distance in pixels between each of the items.

Highlight search terms
When enabled, every term or phrase that is found in the items will be highlighted with the defined colors.

9. Lastly, in the Advanced section you can define a unique ID. This ID only needs to be changed if you are using more than one Quick Finder stack on a single stacks page.

10. After you have added a new unique ID (it can be something as simple as the number 2), copy the ID and select the Quick Finder Content stack. In the settings menu, add the ID to the Content ID field. This will assign the search bar to this content.

RapidWeaver Stack Tutorials

RapidWeaver Theme Tutorials

RapidWeaver Project Documentation

Tutorials and documentation for all 1LD Project files can be found at the link below.

See Documentation

Get the power of a framework, for the price of a theme, in the convenience of a prebuilt RapidWeaver project file

Blog

New Release: Kirkland Law Project File

Thanks to user feedback we are continually updating and improving the Deluxe stack framework! macOS Mojave 10.14 is no longer a requirement to use our projects. Support has been tested back to macOS Sierra 10.12. The included php mail forms have also been updated for easier setup and use.

Check out our newest project using some of the latest features. Kirkland Law is a professional service based design project built with the included and ever improving Deluxe stacks. Use this completed project by simply swapping in your own text, images, and branding. Add your own pages and use any 3rd-party stacks you need.

 

Check it out!

Latest News

Newsletter

Join our newsletter to get notified of new releases, updates, and discounts.

Subscribe

Popular Links

Free Stacks & Themes
See Order History
Product Tutorials
FAQs

© 2011 One Little Designer, 1 Little Designer (1LD)

RapidWeaver is a trademark of Realmac Software