Styling the web app - AtlasOfLivingAustralia/documentation Wiki

Styling these apps

All the applications retrieve a banner.html, head.html and footer.html that they use to format the pages.

Basic styling

If you have installed the ala-demo, then these files should be located in the following directory:

/srv/living-atlas.org/www/ on this machine.

These applications are use a banner, footer and head html block that you can customise.

Examples

GBIF Spain

NBN UK

NBN Wales

Advanced styling

If you want to integrate also things like CAS authentication links, or language menus you need a more advanced banner/head/footer.

For instance ala-bootstrap3 dependency library replace some ::tags:: when rendering the layout:

content = content.replaceAll(/::headerFooterServer::/, headerAndFooterBaseURL)
content = content.replaceAll(/::centralServer::/, alaBaseURL)
content = content.replaceAll(/::searchServer::/, bieBaseURL) // change for BIE to grailServerURL
(...)
content = content.replaceAll(/::loginURL::/, buildLoginLink(attrs))
content = content.replaceAll(/::logoutURL::/, buildLogoutLink(attrs))
content = content.replaceAll(/::loginStatus::/, signedInOutClass)

So this tags used in your header/footer/banner html files are replaced with the correct urls when rendered. See the use in commonui-bs3-2019.

For information about how to add a lang selector, see this.

Clearing the header/footer cache during development

The header and footer is cached so during development you can call this http://collectory.your-l-a.site/headerFooter/clearCache do delete some service header/footer cache. More details.

LA Base styling

The https://github.com/living-atlases/base-branding is a good start in order to have an advanced branding to start with. It uses ALA commonui-bs3-2019 as dependency.