Live search within websites
Live search within websites
If you provide longer lists of entries - be it a keyword list (A-Z), download files, dates or similar - it can be useful to be able to search quickly within these lists. For this purpose, a search field can be added at the beginning of the list, which reacts immediately to text entries and reduces the list to those entries in which the entered character string is found.
Video: Live search within websites
In an online training course, it was shown how a real-time search can be added to a list on a website (e.g. bibliography, linked A-Z keyword list, etc.) using an input field. Extras are also possible, such as tags, which can then be filtered using a separate selection menu.
- Introduction to the topic (0'00")
Note: The video is only accessible to members of the university.
Basics for using the live search
Aprerequisite for using the live search is a given list of elements. This list must be available in full on the website. During the search, there is no interaction with the web server, but only the non-matching entries are hidden from the overall list using the search. The search therefore functions as a filter.
Entries in a normal bulleted list, a list of download documents, addresses, calendar appointments or news articlescan be searched in this way . However, other constellations can also be made possible - if necessary, through an additional definition of how the "elements" to be filtered can be recognised as such by the search program used under the bonnet.
Restriction: At present, the live search may only be activated once on a website at the same time, as otherwise functional errors may occur.
Examples
- An enumeration list (e.g. A-Z search of the TYPO3 documentation) with further links.
- The EINBLICKE archive uses a menu of pages with summaries. For this purpose, the "Summaries" field in the page properties was filled accordingly for each page in order to provide a basis for the search.
- With a file links content element can be used to filter download documents.
- BibTeX literature list with search field and automatic categories
Supplementary, automatic selection field with categories
Under certain circumstances, each listed element can include certain keywords - similar to the so-called "tags" for certain blog articles or categories. The automatic system used at the UOL automatically interprets what is written in square brackets as a "category". A selection menu is then automatically generated from all the categories found, which is displayed in addition to the live search field and thus, to a certain extent, offers pre-prepared search terms that then explicitly search only within these categories.
Preventing the automatic selection menu
The text may contain terms in square brackets that are not intended to be used to generate a selection menu. In this case, you can also give the content element the CSS class ls_noselect, i.e. livesearch ls_noselect must be included there.
Self-defined additional selection menus
It is also possible, but somewhat more technically complex, to define additional selection menus yourself. This can be useful to be able to filter according to different criteria at the same time.
Examples:
The use of this search option requires additional configuration information in the website, from which the structure of these selection menus can be seen. This option can be set up or supported by the internet coordinator if required.
Alternative: Filtering by category using buttons
If no text search is required, but only a filtering based on certain categories (e.g. within the dates of a calendar), buttons can be useful:
Example: Dates from the International Office
Additional variants ...
... are generally possible. Please contact the Internet Coordinator about your specific requirements.
Examples of additional configuration options:
- Renaming the "Search" heading
- Additional selection menus search explicitly only in certain sub-areas of the list elements, e.g. only for a certain cell of a table row.
- Definition of further criteria for identifying the list to be searched