Page 1 of 1

Is it possible to change the search input position inside the header

Posted: Wed Jan 10, 2024 4:03 pm
by tanja
Hi all,

I am using Oxygen XML version 26 to generate and HTML WebHelp.

We use the webhelp.fragment.before.search.input placeholder to create a welcome text in the header. We would rather have the text on the left and the search input on the right, but there does not seem to be a parameter for that, according to Publishing Template Package Contents for WebHelp Responsive Customizations.

I also had a look at the search templates you provide in your GitHub (which is a great resource, by the way), but none of them puts the search input where we would like to have it. Is it possible to place text and search input next to each other?

Thanks and best regards,
Tanja

Re: Is it possible to change the search input position inside the header

Posted: Thu Jan 11, 2024 1:03 pm
by galanohan

Re: Is it possible to change the search input position inside the header

Posted: Thu Jan 11, 2024 5:53 pm
by tanja
Hi all,

I just realized that my initial question was phrased misleadingly, sorry for that. With "header" I did not mean the part where the menu is displayed, but the one where the search input is located. In your user documentation that would be the big blue area where "Oxygen XML Editor 26.0 User Guide" is displayed, with the search input below. I want to relocate the search input inside this blue area.

Sorry for the confusion.
Best regards, Tanja

Re: Is it possible to change the search input position inside the header

Posted: Wed Jan 17, 2024 12:31 pm
by cosmin_andrei
Hi tanja,
You can achieve this through a CSS customization. More information on how to create your own CSS customization are available here:
https://www.oxygenxml.com/doc/versions/ ... h-css.html

Below is fragment which you can use to obtain the desired result:

Code: Select all

.wh_search_input {
  display: flex;
  justify-content: center;
  align-items: center;
}
 
.wh_welcome:not(:empty) {
  width: initial;
  margin: 0 0;
  padding: 0 0;
}
 
#searchForm {
  width: 50%;
}

Re: Is it possible to change the search input position inside the header

Posted: Tue Jan 23, 2024 11:41 am
by tanja
Hi again,

Thanks for the fragment!
Exactly what I was looking for. It worked :D

Best regards
Tanja