After the initial section on History and Goals of building this version of the LLIR website, this page describes:

Headers that appear on all webpages in this website
Menus for navigating the website
How we use the Kadence Account feature to support user Login

A separate page in these notes describes how specialized features of the website are implemented using a Kadence feature called conditional elements.

History and Goals

The prototype for this website was built in the spring of 2023 using the WordPress development environment. It started as a proof of concept for switching to the Kadence Pro theme to achieve the goals listed below. If you are not familiar with WordPress, read the overview of our platform. Over the summer of 2023 the prototype became the working basis on which to rejuvenate the website’s content and visual design. The goals are:

Fix issues relating to login. The previous WordPress theme, named Twenty Eleven, was dated and imposed limitations.
Create a website that users find easier and more intuitive to use than LLIR’s initial website that was created 12 years earlier.
Leave the website developed to the point where LLIR volunteers with a good knowledge of the WordPress page editor and ability to learn features of Kadence Pro can take over maintenance
Clarify the responsibilities of LLIR volunteers and the hired programmer and to develop a working interface between them.

The implemented solution displays one header across the top the browser window when a user arrives at the website and a different header after the user logs in as a member. These headers contain the main navigation menus and buttons. The only route to member-only pages is through a conditional header that replaces the initial header only when the current user is a logged- in member.

Initial Priority

The original priority was to set up a login/logout mechanism that protects information that only members should see from unauthorized access.
The assumption is that members can see everything that the public can see and much more. Some pages in the public area are available only before members log in.

Long Term Intension

A long term goal is the separation of back-end business logic from the front end user interface. The back end includes the master database and programming that processes forms submitted by users. Front-end work involves design and maintenance of this website, the interface used by LLIR prospects and members.

An additional set of processes exists for the LLIR Registrar and other members of the LLIR Board to view and update information in the membership database primarily to support annual registration, course assignments and the waitlist. The user interface for those processes is maintained by our hired programmer. It consists of custom utilities that use FileMaker Pro and is fully outside the scope of these notes.

For more detail on the resulting implementation, refer to our Website structure and IT Architecture.

Headers

When a user first enters the site, they see the header called Public Header with a navigation menu across the bottom called Public Menu. When the user logs in, they see a conditional header called Member Header with a navigation menu across the bottom called Member Menu.

Two additional headers are defined but they are never seen by website users:
A header called default that is not in use.
These Developer Notes have their own header called Developer Notes.

The key approach to supporting login is to create conditional headers (a Kadence feature). The condition for displaying the Member Header is that the user is logged in so each user sees it from the time they log in until they leave the website or explicitly log out. To avoid creating security loopholes, follow the principle described in Don’t Break Login Security.

Both headers have two variations, so all modifications to headers must designed, implemented and tested on both variations:
1. A header for large screens (desktop or laptop computers)
2. A header for small screens (smart phone and some mobile devices)

The Public Header contains a row of buttons (Contact Us and Login). The Member Header contains a row of buttons (Contact Us and Logout). The two Contact Us buttons link to different pages. Kadence limits the number of buttons in a headers. On small screens (smart phone and mobile devices) the limit is two (plus the Account feature, which is can look like a button).

See also How to Modify a Header and How to Implement a Conditional Header.

Menus

The table below shows the names of the two menus currently defined for the LLIR website and where those menus appear.
Kadence allows up to 9 menus and assigns them names shown in italics in Where Used column of the table.

Name of Menu	Where used
Public Menu	Primary navigation on Public Header Mobile navigation on Public Header
Member Menu	Secondary navigation on Member Header Mobile Secondary navigation on Member Header
not used	Third navigation
not used	Fourth navigation
not used	Account Logged In
not used	Account Logged Out
not used	Footer navigation

The website defines two menus used in 4 of 9 possible locations.

The Kadence Account feature

The login mechanism uses the Account feature of Kadence Pro.

On the Public Menu, the label on Account is Login. The action is a link to the WordPress login code and form at https://llirto.ca/wp-login.php.
On the Member Menu, the Account feature displays the current user’s name on the blue header line on a link to the My Profile page.
The Logout button is an ordinary button that links to WordPress logout code at https://llirto.ca/wp-login.php?action=logout.

The Rejuvenation Committee of 2023 decided to display all forms related to a member profile data in the main menu under My Profile. Should that decision be revisited in the future, the forms and logout could make up the Account Logged In menu under the current user’ name.

Please Log In