You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/creating-content/documentation-pages.md
+23-9Lines changed: 23 additions & 9 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -351,11 +351,13 @@ If you set this to false, Hyde will match the directory structure of the source
351
351
352
352
### Introduction
353
353
354
-
The HydeSearch plugin adds a search feature to documentation pages. It consists of two parts, a search index generator that runs during the build command, and a frontend JavaScript plugin that adds the actual search widget.
354
+
Hyde includes a built-in search feature for documentation pages powered by Alpine.js. It consists of two parts:
355
+
1. A search index generator that runs during the build command
356
+
2. An Alpine.js powered frontend that provides the search interface
355
357
356
-
>info Tip: The HydeSearch plugin is what powers the search feature on this site! Why not [try it out](search)?
358
+
>info Tip: The search feature is what powers the search on this site! Why not [try it out](search)?
357
359
358
-
The search feature is enabled by default. You can disable it by removing the `DocumentationSearch` option from the Hyde `Features` config array.
360
+
The search feature is enabled by default. You can disable it by removing the `DocumentationSearch` option from the Hyde `Features` config array:
359
361
360
362
```php
361
363
// filepath: config/hyde.php
@@ -366,17 +368,27 @@ The search feature is enabled by default. You can disable it by removing the `Do
366
368
367
369
### Using the Search
368
370
369
-
The search works by generating a JSON search index which the JavaScript plugin loads asynchronously.
371
+
The search works by generating a JSON search index which Alpine.js loads asynchronously. There are two ways to access the search:
370
372
371
-
Two ways to access the search are added, one is a full page search screen that will be saved to `docs/search.html`.
372
-
373
-
The second method is a button added to the documentation pages, similar to how Algolia DocSearch works. Opening it will open a modal with an integrated search screen. You can also open the dialog using the keyboard shortcut `/`.
373
+
1. A full-page search screen at `docs/search.html`
374
+
2. A modal dialog accessible via a button in the documentation pages (similar to Algolia DocSearch). You can also open this dialog using the keyboard shortcut `/`
374
375
375
376
>info The full page can be disabled by setting `create_search_page` to `false` in the `docs` config.
376
377
378
+
### Search Features
379
+
380
+
The search implementation includes:
381
+
- Real-time search results as you type
382
+
- Context highlighting of search terms
383
+
- Match counting and search timing statistics
384
+
- Dark mode support
385
+
- Loading state indicators
386
+
- Keyboard navigation support
387
+
- Mobile-responsive design
388
+
377
389
### Hiding Pages from Indexing
378
390
379
-
If you have a large page on your documentation site, like a changelog, you may want to hide it from the search index. You can do this by adding the page identifier to the `exclude_from_search` array in the `docs` config, similar to how navigation menu items are hidden. The page will still be accessible as normal but will not be added to the search index JSON file.
391
+
For large pages like changelogs, you may want to exclude them from the search index. Add the page identifier to the `exclude_from_search` array in the docs config:
380
392
381
393
```php
382
394
// filepath: config/docs.php
@@ -385,9 +397,11 @@ If you have a large page on your documentation site, like a changelog, you may w
385
397
]
386
398
```
387
399
400
+
The page will remain accessible but won't appear in search results.
401
+
388
402
### Live Search with the Realtime Compiler
389
403
390
-
The Realtime Compiler that powers the `php hyde serve` command will automatically generate a fresh search index each time the browser requests it.
404
+
When using `php hyde serve`, the Realtime Compiler automatically generates a fresh search index each time it's requested, ensuring your search results stay current during development.
0 commit comments