You can make the Property Card contact buttons larger with custom CSS. No template edit is needed for this part.

The contact buttons use these CSS classes:

.wpestate_property_card_contact_wrapper
.wpestate_property_card_contact_wrapper_phone
.wpestate_property_card_contact_wrapper_email
.wpestate_property_card_contact_wrapper_whatsupp

Add the CSS in Appearance → Customize → Additional CSS, or in the style.css file of your child theme.

/* Bigger, more visible contact buttons on property cards */

.wpestate_property_card_contact_wrapper_email,
.wpestate_property_card_contact_wrapper_phone,
.wpestate_property_card_contact_wrapper_whatsupp,
.wpestate_property_card_contact_wrapper a {
    min-height: 44px;
    min-width: 44px;
    padding: 10px 14px;
    font-size: 19px;
    line-height: 1;
    border-radius: 8px;
}

You can adjust the values if you need larger or smaller buttons.

Why does Lighthouse show “Links must have discernible text” for the WhatsApp button?

This can happen because the WhatsApp button on the Property Card is icon-only. Since there is no visible text inside the link, Lighthouse may report that the link does not have discernible text.

The recommended accessibility fix is to add an aria-label to the WhatsApp link. This gives screen readers a text label without changing the visible design.

Adding visible text next to the icon is not recommended for most card layouts because the Property Card contact area has limited space and the design can break on smaller screens.

How can I add an aria-label to the WhatsApp icon link?

This requires a child theme template override.

Copy this file from the main theme:

wpresidence/templates/property_cards_templates/property_card_details_templates/property_card_contact.php

to the same path in your child theme:

wpresidence-child/templates/property_cards_templates/property_card_details_templates/property_card_contact.php

In the copied file, find the WhatsApp link inside this wrapper:

wpestate_property_card_contact_wrapper_whatsupp

Then add an aria-label to the WhatsApp anchor, for example:

<a aria-label="WhatsApp" ...>

This change improves accessibility without adding visible text to the card.

Can I hide the WhatsApp button on mobile instead?

Yes, this may be possible with CSS, depending on your layout. If you prefer to hide the WhatsApp button on mobile instead of editing the template, this can be checked separately.

Important note about custom code

The CSS adjustment is safe to add through Appearance → Customize → Additional CSS.

The template override and aria-label change are custom code directions. They should be applied by a developer and tested on your website.

Custom code changes and template overrides are outside the standard support agreement and are considered custom development. Please make a full site backup before applying any changes.

We will also add the accessibility improvement idea to our wishlist. Since the Property Card contact area has limited space, adding visible text or changing the icon structure may affect the design, so we cannot confirm if or when this change will be added directly to the theme.