This is some HTML and CSS designed to go in the Custom Header of Vega Discover site configuration. It is based on Fauquier Public Library’s Vega WebBuilder site. The header code was extracted from the WebBuilder (Wix Studio) site (created by Clarivate’s Nathan James) and modified with assistance from Google Gemni. It is responsive/works on a mobile device. It incorporates FPL’s brand standards (any images are stored on FPL’s Wix site/media manager). It includes annotations to assist with customization, but you will want to customize elements to fit your own environment. For example, the GA tag, all the links in the drop-down menus…they go to FPL content. I am too lazy to remove all of that before posting.
Apologies in advance for any inconsistencies or mistakes!
To see what it looks like, see test kiosk site - FPL Menu Version Teal. Our go live date will probably be September 2026 - our director is still deciding what color header to go with - teal, orange, green, plum or grey.
Here is another custom header, this one using Rochester Hills, Roanoke Valley and Lee County, FL’s example code (thank you, thank you, thank you), with a lot of help from Google Gemini. All mistakes are mine and I’m sure I’ll find some flaws/things I missed later on. It may contain code/commands that don’t apply to our system, apply to one of the other libraries I copied from, so apologies in advance.
It incorporates one of our brand colors (#006f79) and font style (Montserrat).
You will need to add your GA code (or stick that in the footer) and update the logo, links, etc.
The icons on the upper menu are stored on Fauquier’s Wix/Web Builder site, so you will want to make/host your own vs. pointing to ours, in case we move to something else. I got them on svgrepo.com.
I don’t have link in the menu(s) opening in a new window (target=“_blank”), may change that at some point.
We haven’t decided whether to use this version or not, is being used in comparison to https://fpl-fauqp.na.iiivega.com/ (no icons on menu) or https://fplplum-fauqp.na.iiivega.com/ (uses icons and is using #70004b), both of which are closer in line with our website. Our director may end up wanting something completely different and I will be back to the drawing board, but wanted to post this in case anyone else is struggling with creating a custom header/footer. Thank goodness other libraries were kind enough to share their code to get me started.