keith/VDI-Starter
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

📄 docs: Update readme

Browse Source
This commit is contained in:
Keith Solomon
2025-11-11 11:35:46 -06:00
parent aae6608153
commit 111bde4808
1 changed files with 61 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

115
README.md
View File

@@ -16,58 +16,59 @@ AC Bug/Issue Tracking: [https://next-app.activecollab.com/119590/projects/4553?m
```plaintext
VDI-Starter-v5/
├── acf/ # ACF field group JSON definitions
├── bin/ # Build scripts
├── content/ # Sample page and post content for testing
├── lib/ # PHP library files
│ ├── class-breadcrumbs.php # Breadcrumb generation
│ ├── class-acf.php # ACF integration
│ ├── class-enqueue.php # Assets enqueuing
│ ├── class-menuitems.php # Navigation menu builder
│ ├── class-resources.php # Custom Resources post type
│ ├── extras.php # Miscellaneous theme functions
│ ├── helpers.php # Helper functions
│ ├── hooks.php # WordPress hooks and filters
│ └── search-features.php # Enhanced search functionality
├── static/ # Static assets
│ ├── dist/ # Compiled assets
│ ├── img/ # Static theme images
│ └── js/ # JavaScript files
│ ├── components/ # JS components
│ │ └── button.js # Button custom component
│ ├── modules/ # JS theme modules
│ │ ├── FocusStyling.js # Replace focus styling for keyboard navigation
│ │ ├── GetHeaderHeight.js # Calculate header height and set it as a CSS variable
│ │ └── Navigation.js # Script controlling navigation behavior
│ ├── admin.js # Admin-specific JS
│ └── theme.js # Main theme JS
├── styles/ # CSS styles
│ ├── backend/ # Admin styles
│ ├── base/ # Base styles
│ ├── blocks/ # Block styles
│ ├── components/ # Component styles
│ ├── fonts/ # Font styles
│ └── theme.css # Main CSS entry point
├── tests/ # Automated Playwright tests
│ └── site-a11y.spec.js # Site Accessibility tests
├── views/ # Template views
│ ├── blocks/ # Custom ACF blocks
│ ├── icons/ # SVG icons
│ ├── forms/ # Form templates
│ └── partials/ # Reusable template parts
├── 404.php # 404 error template
├── footer.php # Footer template
├── front-page.php # Front page template
├── functions.php # Main functions file
├── header.php # Header template
├── index.php # Main template
├── page.php # Page template
├── search.php # Search results template
├── sidebar.php # Main sidebar template
├── sidebar-page.php # Page sidebar template
├── single.php # Single post template
├── style.css # Theme metadata
└── whitelist.php # Tailwind class whitelist
├── acf/ # ACF field group JSON definitions
├── bin/ # Build scripts
├── content/ # Sample page and post content for testing
├── lib/ # PHP library files
│ ├── class-breadcrumbs.php # Breadcrumb generation
│ ├── class-acf.php # ACF integration
│ ├── class-enqueue.php # Assets enqueuing
│ ├── class-menuitems.php # Navigation menu builder
│ ├── class-resources.php # Custom Resources post type
│ ├── extras.php # Miscellaneous theme functions
│ ├── helpers.php # Helper functions
│ ├── hooks.php # WordPress hooks and filters
│ ├── search-features.php # Enhanced search functionality
│ └── show-template.php # Script to show which template is used for the current page
├── static/ # Static assets
│ ├── dist/ # Compiled assets
│ ├── img/ # Static theme images
│ └── js/ # JavaScript files
│ ├── components/ # JS components
│ │ └── button.js # Button custom component
│ ├── modules/ # JS theme modules
│ │ ├── GetHeaderHeight.js # Calculate header height and set it as a CSS variable
│ │ ├── Navigation.js # Script controlling navigation behavior
│ │ └── TagExternalLinks.js # Tags external links with appropriate attributes
│ ├── admin.js # Admin-specific JS
│ └── theme.js # Main theme JS
├── styles/ # CSS styles
│ ├── backend/ # Admin styles
│ ├── base/ # Base styles
│ ├── blocks/ # Block styles
│ ├── components/ # Component styles
│ ├── fonts/ # Font styles
│ └── theme.css # Main CSS entry point
├── tests/ # Automated Playwright tests
│ └── site-a11y.spec.js # Site Accessibility tests
├── views/ # Template views
│ ├── blocks/ # Custom ACF blocks
│ ├── icons/ # SVG icons
│ ├── forms/ # Form templates
│ └── partials/ # Reusable template parts
├── 404.php # 404 error template
├── footer.php # Footer template
├── front-page.php # Front page template
├── functions.php # Main functions file
├── header.php # Header template
├── index.php # Main template
├── page.php # Page template
├── search.php # Search results template
├── sidebar.php # Main sidebar template
├── sidebar-page.php # Page sidebar template
├── single.php # Single post template
├── style.css # Theme metadata
└── whitelist.php # Tailwind class whitelist
```
## Core Files and Templates
@@ -85,6 +86,7 @@ VDI-Starter-v5/
- **helpers.php**: Utility functions for common tasks
- **hooks.php**: Contains WordPress hooks and filters for theme functionality
- **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
### 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"):
```bash
# Install theme dependencies
composer install
npm i
# Configure playwright for testing
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:
@@ -413,7 +421,6 @@ The theme includes a simple build system in the bin directory:
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.
- Activate the theme in your WordPress admin.
- (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:
- 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:
- `site-a11y.spec.js`: Accessibility tests for the site.
- Generates reports in `playwright-report` and screenshots in `test-results`.