Differences

This shows you the differences between two versions of the page.

--- components:searchbar:index [2025/07/10 09:29] – [Searchbar Tool] admin
+++ components:searchbar:index [2025/07/19 14:58] (current) – external edit 127.0.0.1
@@ Line 1: / Line 1: @@
 ====== Searchbar ======
-The page searchbar is the section below the site toolbar, containing the site logo and the search field.
+The page searchbar is the section below the site toolbar, containing at least the site logo and the search widget.
-In the simplest form, it can look like this:
+There are additional configuration options, like showing either the user menu, or a languages menu (provided the Translation plugin is installed). It can also show additional static content, and of course everything can be re-configured.
-<figure>{{:components:searchbar:searchbar-simple.png?700|Nuropa Searchbar}}<figcaption>Simple searchbar</figcaption></figure>
+In the simplest form, the search bar may look like this:
+<figure box>{{:components:searchbar:searchbar-simple.png?700|Nuropa Searchbar}}<figcaption>Simple searchbar</figcaption></figure>
 ===== Components =====
@@ Line 29: / Line 31: @@
 For more information, see: <b maniculus>[[tool|Searchbar tools]]</b>.
+===== Configuration =====
+==== Template settings ====
+In the <a [href=?do=admin&page=config#tpl____nuropa____tpl_settings_name] [target=_blank]>DokuWiki Configuration for this plugin</a>, the following options are directly related to the search bar:
+  * **Site logo** – How should the [[sitelogo|site logo]] be displayed?
+  * **Searchbar Tool** – What tool should be shown as [[tool|searchbar tool]]? Options are: “User information”, “Languages menu” or “Nothing”.
+For more information, please see the page <span maniculus>[[customisation:settings|Settings]]</span>.
+==== Style settings ====
+In the <a [href=?do=admin&page=styling] [target=_blank]>Template Style Settings</a>, the following options are directly related to the appearance of the search bar:
+  * **Searchbar height** – configures the minimum height of the search bar. Adjust to make more space, e.g. for the logo.
+  * **Searchbar background colour** <strong red>*</strong> – Background colour for the searchbar.
+  * **Searchbar icon colour** <strong red>*</strong> – Colour for icons in the searchbar.
+  * **Searchbar link colour** <strong red>*</strong> – Colour for links in the searchbar.
+  * **Searchfield fonts** – Fonts that should be used for the search field.
+  * **Search field background** <strong red>*</strong> – Background colour of the search field.
+  * **Search field text colour** <strong red>*</strong> – Text colour in the search field.
+  * **Search field border** <strong red>*</strong> – Border colour of the search field.
+  * **Search popup background** <strong red>*</strong> – Background colour of the search popup.
+<aside info>**Note 1:** All “colour” items (marked with <strong red>*</strong>) exist in two variants, the second of which is used for the “dark mode”, if enabled.</aside>