📄 docs: Update readme

This commit is contained in:
Keith Solomon
2025-11-11 11:35:46 -06:00
parent aae6608153
commit 111bde4808

115
README.md
View File

@@ -16,58 +16,59 @@ AC Bug/Issue Tracking: [https://next-app.activecollab.com/119590/projects/4553?m
```plaintext ```plaintext
VDI-Starter-v5/ VDI-Starter-v5/
├── acf/ # ACF field group JSON definitions ├── acf/ # ACF field group JSON definitions
├── bin/ # Build scripts ├── bin/ # Build scripts
├── content/ # Sample page and post content for testing ├── content/ # Sample page and post content for testing
├── lib/ # PHP library files ├── lib/ # PHP library files
│ ├── class-breadcrumbs.php # Breadcrumb generation │ ├── class-breadcrumbs.php # Breadcrumb generation
│ ├── class-acf.php # ACF integration │ ├── class-acf.php # ACF integration
│ ├── class-enqueue.php # Assets enqueuing │ ├── class-enqueue.php # Assets enqueuing
│ ├── class-menuitems.php # Navigation menu builder │ ├── class-menuitems.php # Navigation menu builder
│ ├── class-resources.php # Custom Resources post type │ ├── class-resources.php # Custom Resources post type
│ ├── extras.php # Miscellaneous theme functions │ ├── extras.php # Miscellaneous theme functions
│ ├── helpers.php # Helper functions │ ├── helpers.php # Helper functions
│ ├── hooks.php # WordPress hooks and filters │ ├── hooks.php # WordPress hooks and filters
── search-features.php # Enhanced search functionality ── search-features.php # Enhanced search functionality
├── static/ # Static assets │ └── show-template.php # Script to show which template is used for the current page
│ ├── dist/ # Compiled assets ├── static/ # Static assets
│ ├── img/ # Static theme images │ ├── dist/ # Compiled assets
── js/ # JavaScript files ── img/ # Static theme images
├── components/ # JS components └── js/ # JavaScript files
│ └── button.js # Button custom component ├── components/ # JS components
├── modules/ # JS theme modules │ └── button.js # Button custom component
│ ├── FocusStyling.js # Replace focus styling for keyboard navigation ├── modules/ # JS theme modules
│ │ ├── GetHeaderHeight.js # Calculate header height and set it as a CSS variable │ │ ├── GetHeaderHeight.js # Calculate header height and set it as a CSS variable
│ │ ── Navigation.js # Script controlling navigation behavior │ │ ── Navigation.js # Script controlling navigation behavior
├── admin.js # Admin-specific JS │ └── TagExternalLinks.js # Tags external links with appropriate attributes
── theme.js # Main theme JS ── admin.js # Admin-specific JS
├── styles/ # CSS styles │ └── theme.js # Main theme JS
│ ├── backend/ # Admin styles ├── styles/ # CSS styles
│ ├── base/ # Base styles │ ├── backend/ # Admin styles
│ ├── blocks/ # Block styles │ ├── base/ # Base styles
│ ├── components/ # Component styles │ ├── blocks/ # Block styles
│ ├── fonts/ # Font styles │ ├── components/ # Component styles
── theme.css # Main CSS entry point ── fonts/ # Font styles
├── tests/ # Automated Playwright tests │ └── theme.css # Main CSS entry point
│ └── site-a11y.spec.js # Site Accessibility tests ├── tests/ # Automated Playwright tests
├── views/ # Template views │ └── site-a11y.spec.js # Site Accessibility tests
│ ├── blocks/ # Custom ACF blocks ├── views/ # Template views
│ ├── icons/ # SVG icons │ ├── blocks/ # Custom ACF blocks
│ ├── forms/ # Form templates │ ├── icons/ # SVG icons
── partials/ # Reusable template parts ── forms/ # Form templates
├── 404.php # 404 error template │ └── partials/ # Reusable template parts
├── footer.php # Footer template ├── 404.php # 404 error template
├── front-page.php # Front page template ├── footer.php # Footer template
├── functions.php # Main functions file ├── front-page.php # Front page template
├── header.php # Header template ├── functions.php # Main functions file
├── index.php # Main template ├── header.php # Header template
├── page.php # Page template ├── index.php # Main template
├── search.php # Search results template ├── page.php # Page template
├── sidebar.php # Main sidebar template ├── search.php # Search results template
├── sidebar-page.php # Page sidebar template ├── sidebar.php # Main sidebar template
├── single.php # Single post template ├── sidebar-page.php # Page sidebar template
├── style.css # Theme metadata ├── single.php # Single post template
── whitelist.php # Tailwind class whitelist ── style.css # Theme metadata
└── whitelist.php # Tailwind class whitelist
``` ```
## Core Files and Templates ## Core Files and Templates
@@ -85,6 +86,7 @@ VDI-Starter-v5/
- **helpers.php**: Utility functions for common tasks - **helpers.php**: Utility functions for common tasks
- **hooks.php**: Contains WordPress hooks and filters for theme functionality - **hooks.php**: Contains WordPress hooks and filters for theme functionality
- **search-features.php**: Enhances search functionality with custom queries and filters - **search-features.php**: Enhances search functionality with custom queries and filters
- **show-template.php**: Outputs the current template file being used for debugging
- **whitelist.php**: Contains Tailwind CSS class whitelist for styles used in WordPress editor - **whitelist.php**: Contains Tailwind CSS class whitelist for styles used in WordPress editor
### Template Files ### Template Files
@@ -401,9 +403,15 @@ The theme includes a simple build system in the bin directory:
3. Install dependencies (if asked to overwrite, choose "no"): 3. Install dependencies (if asked to overwrite, choose "no"):
```bash ```bash
# Install theme dependencies
composer install composer install
npm i npm i
# Configure playwright for testing
npm init playwright@latest --yes "--" . '--quiet' '--browser=chromium' '--browser=firefox' '--browser=webkit' '--lang=js' npm init playwright@latest --yes "--" . '--quiet' '--browser=chromium' '--browser=firefox' '--browser=webkit' '--lang=js'
# Perform initial build
npm run build
``` ```
4. Create .env file from .env.example and set: 4. Create .env file from .env.example and set:
@@ -413,7 +421,6 @@ The theme includes a simple build system in the bin directory:
5. Start building your project. 5. Start building your project.
- Run `npm run build` to build the basic styles.
- Run `npm run start` to start the development server with live reloading. - Run `npm run start` to start the development server with live reloading.
- Activate the theme in your WordPress admin. - Activate the theme in your WordPress admin.
- (Optional) Import the sample content from `content`. - (Optional) Import the sample content from `content`.
@@ -439,7 +446,7 @@ The theme includes a suite of testing tools to ensure code quality and functiona
Accessibility tests using Playwright and Axe: Accessibility tests using Playwright and Axe:
- Test files located in `tests`. - Test files located in `tests`.
- Run via the [VSCode Playwright extension](https://marketplace.visualstudio.com/items/?itemName=ms-playwright.playwright) or with `npx playwright test` in your terminal. - Run via the [VSCode Playwright extension](https://marketplace.visualstudio.com/items/?itemName=ms-playwright.playwright) or with `npx playwright test --ui` in your terminal for the dedicated Playwright window.
- Tests include: - Tests include:
- `site-a11y.spec.js`: Accessibility tests for the site. - `site-a11y.spec.js`: Accessibility tests for the site.
- Generates reports in `playwright-report` and screenshots in `test-results`. - Generates reports in `playwright-report` and screenshots in `test-results`.