feat: enhance Event Management page UI with creation guide and breadcrumbs

- Remove redundant 'Add New Event' and 'View My Events' buttons
- Add breadcrumb navigation to harmonize with other trainer pages
- Add 'Quick Guide to Creating Events' section with 8 essential points:
  - Event Type selection (In-Person, Virtual/Webinar, Hybrid)
  - Essential Details requirements
  - Venue & Organizer management
  - Description content requirements
  - Event image specifications
  - Registration configuration options
  - Virtual event requirements
  - Approval process information
- Style guide section with light gray background for readability
- Maintain The Events Calendar shortcode integration

This improves UX by providing helpful guidance directly on the event
management page while reducing UI clutter.
This commit is contained in:
Ben 2025-08-19 17:34:06 -03:00
parent 8752905f9e
commit b7f2bc84ad
2 changed files with 50 additions and 9 deletions

View file

@ -272,7 +272,7 @@ class HVAC_Community_Events {
'master-trainer/master-dashboard' => 'templates/template-hvac-master-dashboard.php' 'master-trainer/master-dashboard' => 'templates/template-hvac-master-dashboard.php'
// Other pages // Other pages
'trainer/event/manage' => 'templates/page-manage-event.php' 'trainer/event/manage' => 'templates/page-manage-event.php' // Event management with creation guide
'trainer/profile' => 'templates/page-trainer-profile.php' 'trainer/profile' => 'templates/page-trainer-profile.php'
``` ```

View file

@ -42,6 +42,36 @@ get_header();
.hvac-event-manage-wrapper header { .hvac-event-manage-wrapper header {
display: none !important; display: none !important;
} }
/* Event creation guide styling */
.hvac-event-guide {
background: #f8f9fa;
border: 1px solid #dee2e6;
border-radius: 8px;
padding: 20px;
margin: 20px 0;
}
.hvac-event-guide h3 {
color: #2c3e50;
font-size: 18px;
margin-top: 0;
margin-bottom: 15px;
}
.hvac-event-guide ul {
margin: 0;
padding-left: 20px;
}
.hvac-event-guide li {
margin-bottom: 8px;
color: #495057;
}
.hvac-event-guide li strong {
color: #2c3e50;
}
</style> </style>
<div class="hvac-event-manage-wrapper"> <div class="hvac-event-manage-wrapper">
@ -52,17 +82,28 @@ get_header();
} }
?> ?>
<?php
// Display breadcrumbs
if (class_exists('HVAC_Breadcrumbs')) {
echo HVAC_Breadcrumbs::instance()->render_breadcrumbs();
}
?>
<div class="hvac-page-content"> <div class="hvac-page-content">
<?php
// TEC Community Events 5.x uses its own URL structure
// Redirect to the proper TEC Community Events pages
?>
<h2>Event Management</h2> <h2>Event Management</h2>
<p>Manage your events using the links below:</p>
<div class="hvac-event-actions"> <div class="hvac-event-guide">
<a href="/events/network/add/" class="button button-primary">Add New Event</a> <h3>Quick Guide to Creating Events</h3>
<a href="/events/network/" class="button">View My Events</a> <ul>
<li><strong>Event Type:</strong> Choose between In-Person, Virtual/Webinar, or Hybrid formats</li>
<li><strong>Essential Details:</strong> Use descriptive, searchable titles (e.g., "HVAC System Diagnostics Workshop - Dallas")</li>
<li><strong>Venue & Organizer:</strong> Select from existing options or create new ones</li>
<li><strong>Description Must Include:</strong> Learning objectives, prerequisites, what to bring, agenda, and instructor credentials</li>
<li><strong>Event Image:</strong> Upload an eye-catching image (recommended: 1920x1080px)</li>
<li><strong>Registration Options:</strong> Set ticket prices or make it free, define capacity limits, enable RSVPs</li>
<li><strong>Virtual Events:</strong> Add video conference links, access instructions, and technical requirements</li>
<li><strong>Approval Process:</strong> New events require Master Trainer approval (typically within 24 hours)</li>
</ul>
</div> </div>
<?php <?php