Get the extension here - https://store.ncengine.com/l/framer-search
Demo - https://nc-engine-demos.framer.website/search
Current Version - v0.1.2
Report bugs and Requests - https://github.com/NoCode-Engine/extensions-bug-triage/issues/new?assignees=gate3&labels=framer-search&projects=&template=bug_report.md
The documentation covers how to use the Framer CMS Search Extension by NoCode Engine. We ran into some issues recently while building a website that has a lot of CMS items and it was difficult to find what we wanted on our long list of items, so we decided to build this extension to solve our issue and also to help anybody that needs this.
If you are familiar with our work, you will know we value flexibility and functionality over anything else, we try our best to not interfere with your creative process. This extension follows thesame ethos.
To learn how to add custom classes to a component/element in framer, visit this page. Here are the classes currently available:
Class Name | Description | Required |
---|---|---|
nc-item | The class for each framer item in a collection list. The item should be placed in a Parent Frame and then this class should be added to that frame. | True |
nc-rl-searchinput | The class for the input textbox you wish to enter your search terms into | True |
nc-rl-searchable | This class identifies an element that contains the data you wish to the extension to search through. You might decide to only let some parts of your collection list items be searchable. Simply add this to the element containing the text that should be searchable by the extension. | True |
nc-rl-filterInput | The class for the element that should be used to toggle a filter on and off. Currently this supports a button and a checkbox. It works as a toggle in both cases which means, when you click on the element when it has not been selected as a filter initially, it will filter all using the text/value of the element, the next time you click it, it will remove this filter | False |
nc-rl-filterable | This class is similar to nc-rl-searchable, but in this case it should be added to an element or section of the collection list that should be used in a filter | False |
This is super simple. After copying the extension using its link into your project, just:
To serve you better and in order to get to your bug requests quickly, kindly create an issue using the link below. You can also add your questions and suggestions as well.