Make agent info block clickable, add Agent Profile button

- Wrapped agent avatar/name/title in single clickable link to profile
- Added Agent Profile button between Call and Email buttons
- Added hover styles for agent info link block

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Hanson.xyz Dev
2025-11-30 18:49:40 -06:00
parent e5220dcf88
commit 220ae51df8
3 changed files with 47 additions and 20 deletions
File diff suppressed because one or more lines are too long
@@ -47,30 +47,31 @@ if ($agent_id && get_post_type($agent_id) === 'agent') {
?>
<?php if ($has_agent) : ?>
<?php $agent_profile_url = get_permalink($agent_id); ?>
<!-- Agent Card -->
<div class="sidebar-widget agent-card">
<h3 class="widget-title">Listing Agent</h3>
<div class="agent-info">
<div class="agent-avatar">
<?php if ($agent_photo_url) : ?>
<img src="<?php echo esc_url($agent_photo_url); ?>" alt="<?php echo esc_attr($agent_name); ?>">
<?php else : ?>
<div class="agent-avatar-placeholder">
<svg width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
<path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/>
<circle cx="12" cy="7" r="4"/>
</svg>
</div>
<?php endif; ?>
<a href="<?php echo esc_url($agent_profile_url); ?>" class="agent-info-link">
<div class="agent-info">
<div class="agent-avatar">
<?php if ($agent_photo_url) : ?>
<img src="<?php echo esc_url($agent_photo_url); ?>" alt="<?php echo esc_attr($agent_name); ?>">
<?php else : ?>
<div class="agent-avatar-placeholder">
<svg width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
<path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/>
<circle cx="12" cy="7" r="4"/>
</svg>
</div>
<?php endif; ?>
</div>
<div class="agent-details">
<p class="agent-name"><?php echo esc_html($agent_name); ?></p>
<p class="agent-role"><?php echo esc_html($agent_title ?: 'Real Estate Agent'); ?></p>
</div>
</div>
<div class="agent-details">
<p class="agent-name">
<a href="<?php echo esc_url(get_permalink($agent_id)); ?>"><?php echo esc_html($agent_name); ?></a>
</p>
<p class="agent-role"><?php echo esc_html($agent_title ?: 'Real Estate Agent'); ?></p>
</div>
</div>
</a>
<div class="agent-contact">
<?php if ($agent_phone) : ?>
@@ -82,6 +83,14 @@ if ($agent_id && get_post_type($agent_id) === 'agent') {
</a>
<?php endif; ?>
<a href="<?php echo esc_url($agent_profile_url); ?>" class="btn btn-secondary">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
<path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/>
<circle cx="12" cy="7" r="4"/>
</svg>
Agent Profile
</a>
<?php if ($agent_email) : ?>
<a href="mailto:<?php echo esc_attr($agent_email); ?>?subject=<?php echo esc_attr('Inquiry about ' . $property_title); ?>" class="btn btn-secondary">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
@@ -326,6 +326,24 @@
padding: 1.5rem;
}
// Agent Info Link (clickable block)
.agent-info-link {
display: block;
text-decoration: none;
color: inherit;
border-radius: 0.375rem;
margin: -0.5rem;
padding: 0.5rem;
&:hover {
background-color: var(--color-bg-dark);
.agent-name {
color: var(--color-accent-light);
}
}
}
.agent-card-header {
margin-bottom: 1.25rem;
padding-bottom: 1rem;