Autofocus in search bar?

This forum is for all Flare issues related to the HTML5, WebHelp, WebHelp Plus, and Adobe Air Targets
Post Reply
Imke
Jr. Propeller Head
Posts: 3
Joined: Thu Jul 08, 2021 1:33 am

Autofocus in search bar?

Post by Imke »

Hello everyone. I am using Flare to build an HTML5 help with a side navigation skin and a search bar whithin the header. When users call up the start page, the input focus is not within the search bar, but this is now desired by the product management. The HTML codes for this can be researched, but I don't know where (stylesheet, skin, start page?) I would have to insert which code. Does anyone have any idea how and whether this feature ("autofocus on load") can be achieved in MadCap Flare?
NorthEast
Master Propellus Maximus
Posts: 6365
Joined: Mon Mar 05, 2007 8:33 am

Re: Autofocus in search bar?

Post by NorthEast »

You could do this using JavaScript.
For example, somewhere inside the body of the start page, insert a script using Insert > Script and paste the following:

Code: Select all

$(document).ready(function(){
	/* Set focus to search bar in title bar automatically */
	$(".title-bar .search-field").focus();
});;
However, it's not good practice to do this for accessibility reasons, because it breaks the normal navigation flow of your page for keyboard users. It will jump over things like the 'skip to content' link. I've actually removed this from our help after it failed accessibility tests. So I'd mention that to management!
Imke
Jr. Propeller Head
Posts: 3
Joined: Thu Jul 08, 2021 1:33 am

Re: Autofocus in search bar?

Post by Imke »

Thanks a lot, NorthEast,
I'll definitely mention that to management!
Post Reply