Adds page title alignment and width options to the Page Settings block. Closes #536.

How to Test
1. Add a Page Settings block to a new or existing page or post
2. Change the alignment and width of the page title
3. Verify the alignment and width options affect the page title on the front end 
4. If the "Hero Content" setting is checked, the new page title settings should have no effect and should not appear in the editor

<img width="1664" alt="Screenshot 2024-11-05 at 4 35 33 PM" src="https://github.com/user-attachments/assets/e9c79c2a-e442-4909-a15d-e20db905cdff">
<img width="1677" alt="Screenshot 2024-11-05 at 4 35 48 PM" src="https://github.com/user-attachments/assets/20c02261-824b-4e2d-8ad3-3b15ba9b2581">


enhancement

This release will focus on adding a directory system to the theme.

WP Theme 3.4.0

Add Page Title Alignment and Width Options

Closes #535 

### How to Test

1. Add a Page Settings block to a page
2. Click the Hero checkbox, add an Embed block inside the hero area, and link a video 
3. Ensure the video embeds correctly in the editor and on the front end
4. Try adding other content to the hero area besides the video
5. Ensure the other content appears correctly in the editor and on the front end


<img width="1679" alt="Screenshot 2024-10-29 at 12 51 24 PM" src="https://github.com/user-attachments/assets/3edb663d-08d5-43eb-b4a4-2bf1ea58fd3f">
<img width="1678" alt="Screenshot 2024-10-29 at 12 51 57 PM" src="https://github.com/user-attachments/assets/8693256e-99d3-4016-9856-5f9521d70001">


editor

Fix Embed Bug in Page Settings Block

## Background

One of the most requested features we've had is to add the ability to change the page title's width and alignment. I've been thinking through ways to accomplish this and think there's a solution after the latest minerva release.

## Description

This issue is to add those controls on a page by page basis, and to the customizer for pages that can not be directly modified.

## Workarounds

The only current workaround is for an admin to add custom CSS inside the page itself, which is often a janky workaround fighting against previously aggressive styles added by minerva.

## Mockups / Proposed solution

I propose that two new options be added to the page settings block. One to control the title alignment and another to control the width.

Using the following markup added in https://github.com/UA-Stratcom/ua-theme_v3/pull/530, the controls should make the following changes:

```php

<?php echo '<div class="ua_layout--standard">';
  echo do_blocks('');
  echo '</div>';
?>

<?php echo '<div class="ua_layout--wide">';
  echo do_blocks('');
  echo '</div>';
?>


<?php echo '<div class="ua_layout--standard">';
  echo do_blocks('');
  echo '</div>';
?>

<?php echo '<div class="ua_layout--standard">';
  echo do_blocks('');
  echo '</div>';
?>
```

Additionally, it should be communicated to the user that these options will have no effect if hero content is added. This can either be hiding the page title options or displaying a message informing the user that these settings will be ignored since hero content is present.

As a bonus, it wouldn't be a bad idea to add a message above the hero content area to remind editors that an h1 must be included in the hero content to meet accessibility best practices and improve SEO

## Additional information

In addition to adding these options to the page settings block, we should also add them to the customizer options for pages that otherwise can't be modified such as the post template, archive template, and home template

Title alignment and width options

## Description

I may have found a bug with the page settings hero block. I'm trying to embed a youtube video, but it only outputs the physical youtube link on the front end, not the video at all. I've tried an html block using an iframe, but it doesn't work either. The embed only works outside the page settings block.

## Additional Information

This was reported by Shamaria Borden on the support channel of the web forum.

Embed not working in hero area

This enhancement will add new customizer settings for toggling the information in the individual directory entries on the Directory archive.

From #513, _"The directory index should also get an entry in the Customizer with toggles for tags, categories, fields in each contact entry, and display options for list view or grid view."_


Add new Customizer settings for displaying Directory entry data

Here's an example of a directory we've created using features already included in the theme: https://stratcomm.ua.edu/staff/. I think the directory archive should essentially be styled the same, but later we'll add an option for "list view" in the customizer, where the contact cards are horizontal and stacked on top of each other. For now, let's not worry about adding any additional styling in the theme and just focus on the functionality.

New functionality for this issue will require two parts: 
1. a new post type - from #513, "_This page would also hold metadata like tags, categories, profile picture, and contact information._" The metadata could be handled with post meta fields.
2. a new directory page template - from #513, _"Categories and Tags should be listed in a sidebar for filtering the list."_




Add "Person" post type and "Directory" archive template

Beyond the usual package update, I believe the following is a comprehensive list of changes needed to various parts of the theme for the new update to work correctly.

- The secondary (sidebar) navigation needs to be updated so that the active page is indicated
- The Titlebar markup needs to be updated
- Every page template should be updated so that the h1 is wrapped in a div with the class `ua_layout--standard`


See patch notes for more information: https://github.com/UA-Stratcom/minerva/releases/tag/v1.4.0, paying special attention to the HTML Changes section.

dependencies

Update Minerva to 1.4.0

From Kyle:

> We need to update our accessibility link in the universal footer. It needs to point to https://accessibility.ua.edu/statement/
 
This is the accessibility link in the crimson footer section

Update accessibility link in universal footer

## Description

While Reaktiv was building a site they caught this error in their accessibility tests:

> Links must have discernible text. In the header, under the site title, there is a link with the class ua_title-bar_subtitle that does not have a href or text value.

As is, this is a violation of WCAG 2.4.9

## Expected behavior

This looks like a mistake in the template for the title bar. When no subtitle is set, this element should not be rendered. We also need to double check that if text for the subtitle is added but no link it should render as a `<span>`

## How to reproduce

Steps to reproduce the behavior. For example:

1. Go to https://afford.ua.edu/
2. Open Inspect Element
3. View the source code in the title bar area
4. See empty `<a>` tag

## Technical information

- Operating System: OS X 10.15
- Browser: Firefox 130.0
- GA Supported: Yes
- Cookies Enabled: Yes
- Browser Size: 1720 x 995
- JavaScript Enabled: Yes
- Browser User Agent String: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:130.0) Gecko/20100101 Firefox/130.0

## Screenshots

<img width="1728" alt="Screenshot 2024-09-11 at 4 19 33 PM" src="https://github.com/user-attachments/assets/dfed61a5-1838-4870-a49d-c86c64d1c9e7">


An issue related to an accessibility concern

accessibility

Empty subtitle element

Closes #505. 

Merging this into `dev` for expediency since it's not a super urgent fix. 

For some reason, wordpress wasn't passing the `url` property to the site in the core data store by default, so I had to register the setting in `functions.php`. https://wordpress.stackexchange.com/a/383170 

What I did to test multisite on local was download MAMP PRO and use the free trial, but you may not want to go to that trouble just to test this fix.

**Note**: This execution removes the "cleanup" `return` function inside of the `useEffect` hook, since this function runs every time a listed dependency changes, and `siteURL` was added to the effect's dependency array to ensure the correct url loads in multisite setups. This change should also resolve #425, but will also make it so that the user has to **uncheck** "sidebar" and "hero" when they want to remove these sections from a page. Deleting the "Page Settings" block will no longer have any effect.

Improve Page Settings functionality for multisite setups

The theme directory system will allow content creators the ability to add robust personnel directories to their website in a centralized and easy to manage location

## Key Features:

```[tasklist]
### Tasks
- [ ] Ability to create a profile page for each person #531 
- [ ] Display structured contact information for each person, both on the person’s profile page and in personnel feeds #531 
- [ ] Display all personnel in the system and filter them using tags or categories, similar to default posts #531
- [ ] Directory index entry in the Customizer with toggles for tags, categories, fields in each contact entry, and display options for list view or grid view. #532 
- [ ] Have a block that can display relevant people based on category or tag selection _(could we just use the built-in Posts Feed block?)_
```

## The Profile Page

I imagine the best way to handle this will be to create a custom post type, where each custom post is the profile page for a specific person. This page would also hold metadata like tags, categories, profile picture, and contact information. A custom block that stores this structured data is probably needed.

## The List

An index at example.ua.edu/directory should be made available to display a list of all people in the directory system. Categories and Tags should be listed in a sidebar for filtering the list. The directory index should also get an entry in the Customizer with toggles for tags, categories, fields in each contact entry, and display options for list view or grid view.

Another part of this might require an archive template for displaying the filtered results, similar to how normal posts function.

## The Block / The Pattern

A new contact block or pattern is needed to display structured data. It will use the card under the hood but will have additional styling rules. All parts of the contact card should be optional. See minerva for contact card markup and options.

## The Feed

A new block should be created that can display people with a specific tag OR category. This way contact information for individuals can be embedded where it makes sense to in the site’s content. For example, displaying academic advising personnel on a page about academic advising. The feed should populate contact blocks with data from the custom post.

A task related to planning / project management

planning

feature

Directory system

Closes #466

How to test: 
1. Create several pages. Content doesn't matter much aside from the "Page Settings" block. In the Page Settings blocks, select "Sidebar", then "Dynamic."
2. Using the "Parent" selector in the page sidebar, create a hierarchy that includes a few levels of nesting of parents, siblings, and children. See the screenshot below for an example.
3. View each page you've created on the front end and see if the sidebar displays the page relationships correctly.

A couple things to note: 
- This execution has a max of 3 levels of nesting, since that's how many levels we accomodate with styling in the minerva component. So if the current page has a parrent, it'll only look for children of the current page and siblings. If the current page doesn't have a parent, then it'll look for children and grandchildren.
- It would probably look better if all of the nested menus were open on page load, and we didn't include the little collapse icon. As is, all collapsible menus are closed with JS on page load. My understanding is there's an open issue in Minerva for this.

<img width="1706" alt="Screenshot 2024-09-05 at 3 22 56 PM" src="https://github.com/user-attachments/assets/f7672466-561b-4e3e-9919-9a541aeac5bc">
<img width="1705" alt="Screenshot 2024-09-05 at 3 23 20 PM" src="https://github.com/user-attachments/assets/09b56359-333d-4f5e-a430-a6f5a4886c4b">
<img width="1704" alt="Screenshot 2024-09-05 at 3 26 41 PM" src="https://github.com/user-attachments/assets/f1c8a1c7-a03e-4aa9-9dfb-25549cc4e677">

add dynamic sidebar option to the page settings block

## Background

Sometimes it is helpful to have page specific CSS, and one way to do that might be to add styles in the HTML block, but `<style>` tags are currently stripped out if a user other than administrator edits the page.

## Workarounds

Pages with custom CSS may only be edited by admins with the unfiltered HTML capability.

## Proposed solution

Add the `<style>` tag as an allowed tag in the HTML block, probably using the `wp_kses_allowed_html` filter.

## Additional information

I'm unsure if admins are able to also add scripts, but that capability should probably be removed if they are. It can also be noted that this behaves differently on my local and on a UA hosted site. On my local, it seems all roles are able to add unfiltered HTML while only admins are able to on UA hosted sites. I'm not sure what configuration may be different.


Whitelist <style> in the HTML block

The code from #451 needs to be cleaned up. Off the top of my head, there probably needs to be a new function to eliminate duplicate code, some attributes should be renamed, and some others should maybe be consolidated. If everything continues to work on the level of functionality, then we can focus on cleaning up the code a bit.

Refactor code for new event feed block features

It would be great to find a way to edit the 404 page content from the editor. Maybe a custom page could override it? Or maybe we could add a widget that overrides the default 404 page content if its available, kind of like how we have the site footer set up.

Custom 404 page content

Requested by Paris Vega, The Nine Digital

## Background

The goal of this element is to allow the user to easily see what child pages are related to the current page they are on. This allows them to easily move down further into the site structure as needed.

## Description

There are plugins for this, and could be done with custom code built as a widget, as part of the page template, or the theme itself. In the past I've executed this on WordPress sites by building the sidebar into a page template, and then selecting that template. Similar to [Method 3 ](https://www.wpbeginner.com/wp-tutorials/how-to-display-a-list-of-child-pages-for-a-parent-page-in-wordpress/#:~:text=Use%20in%20WordPress-,Method%203.%20Dynamically%20Display%20Child%20Pages%20Without%20Any%20Shortcode,-Using%20shortcodes%20is)mentioned in this article

## Workarounds

Create and update menus manually in the menu system

## Additional information

We might be able to add this as an option in the sidebar dropdown. When selected, it would dynamically create the sidebar content based on the page's relatives (parent, children, siblings)


Dynamic Sidebar

It looks like WordPress 6.6 was pretty substantial and make several changes related to development we may need to be aware of.

https://make.wordpress.org/core/2024/06/25/wordpress-6-6-field-guide/

We need to test the theme against the newest version of WordPress and make note of any optimizations we can make in the future, adjusting the requires / tested versions in the theme info as needed.

research

Research relevant changes from WP 6.6

Currently, adding content to the 404 page widget replaces the default 404 page content. It would be cool if we provided an option in the customizer to have that custom content inserted above the default content, below the default content, or have it replace the content as it currently does. I think the default should remain replace, but it would be good to give people more options.

This release will focus on improving the WordPress editor UX for UA Blocks and Styles.

WP Theme 3.5.0

Allow flexibility for placement of custom 404 content

## Background

Often times we get bug reports or support requests that are vague, misdirected, or incomplete.

## Description

This suggested came up at an all staff meeting and I think it's worth adding to the roadmap. We could have a support tab right inside the wordpress dashboard to help direct people to the correct resources or file a bug report using a form with all information needed. This email could then be sent directly to web@ua.edu.

## Workarounds

We currently have people reporting bugs through all kinds of channels, and I don't expect this to replace those, but it would be a better tool to get the information we need about a specific site. I also want to set up a parallel of this page on web.ua.edu

## Mockups / Proposed solution

![Desktop - 1](https://github.com/user-attachments/assets/eb3b6b1b-52f4-411a-bb33-1c55df39f8b9)

![Desktop - 2](https://github.com/user-attachments/assets/f10da33f-8d1d-4c48-8479-febeff7a0ffb)

![Desktop - 3](https://github.com/user-attachments/assets/521a5635-3d6e-4e0c-8fe9-088822984dec)

## Additional information

This is initial thoughts, I know we may run into issues implementing all of this and this might turn into a bigger project than expected. I also want to get feedback from everyone, on if there's anything else we want to include on this page.


Roadmap

Milestones

WP Theme 3.4.0

WP Theme 3.5.0