Documentation search bar

[alan-cugler]

The documentation needs a search bar for combing through all the pages, so someone can quickly find any references or examples to the feature or syntax they are struggling with. Its overly time consuming (and frustrating) looking for explanations to small problems.

Example need case:
Everything that someone new is struggling with and needs docs support to overcome.

[nixjdm]

There is https://www.getlektor.com/docs/search/, but it's not very eye catching. Having the actual bar right on every doc page would probably make it actually be used. I doubt many see it.

[goanpeca]

Agreed!

[alan-cugler]

I suggest embedding it in the top right (standard for websites) with the navigation menu. or just below the navigation menu when they enter the docs pages.

[goanpeca]

@alan-cugler maybe adding a screenshot could help materialize what you suggest :-)

[alan-cugler]

Where the yellow boxes are.

[nixjdm]

Keep in mind the design is bound by that content width. So those two locations shouldn't actually extend that far off to the right. They should only be as far right as anything else.

That top bar with "Lektor" "Downloads" etc I don't think will work since we're adding "Plugins" soon, and I want to leave room for "Themes" too. At least, not without removing something else. There won't be enough room.

For the second box on the same line as Data Modeling, some titles would conflict with the box if it's moved back to the left to be within the normal content width. Maybe we could move the section with Data Modeling all down a bit? That might look ok.

Also, should the search bar only be present on doc pages? All other pages have a big banner image to content with.

[alan-cugler]

Traditionally the search bar is in the top-right or top-center.
However, if page space is an obvious problem in the future expansions in the Lektor website, I suggest either having the search Icon as a button, or maybe your option of moving up the search page on the navigation tree will suffice.

[nixjdm]

I'm not proposing having it in the nav tree. I think it deserves a bit more horizontal space than that. I'm proposing putting it at the top of the class="col-sm-9 div, bumping the <h1> down a little bit. This would still be right-justified. This is nearly where your lower yellow box is, just not overflowing out of class="container".