Personalization is no longer optional – it’s expected. Tailoring your website’s content to the specific needs and interests of each visitor isn’t just a “nice-to-have”; it’s a proven strategy for driving engagement, building trust, and ultimately converting visitors into customers. At Air Traffic Control, we take this a step further by enabling hyper-relevant content recommendations through deep HubSpot integrations. But what if you’re running your website on WordPress? The good news is, you can seamlessly bring HubSpot’s contact property magic – including those generated by Air Traffic Control – directly to your WordPress web pages.
This blog post will walk you through how to leverage HubSpot contact properties to create highly personalized WordPress pages. We’ll also highlight the role Air Traffic Control can play in supercharging your personalization efforts.
Before diving into the technical details, let’s address why personalization is so powerful:
By connecting your website to HubSpot’s rich contact properties – especially those enhanced by Air Traffic Control’s recommendations – you can deliver this level of personalization at scale.
Air Traffic Control integrates deeply with HubSpot to enhance its already powerful CRM. Our solution analyzes your content library and contact data to create personalized content recommendations for each contact. These recommendations are then stored in HubSpot as custom contact properties, ready to be used across all your marketing channels – including your WordPress site.
Imagine this: A visitor lands on your WordPress site, and instead of seeing generic content, they’re greeted with blog posts, whitepapers, or product suggestions tailored specifically to their interests. With Air Traffic Control and HubSpot, this isn’t just possible – it’s straightforward.
Let’s get practical. Here’s how you can create a personalized WordPress page that displays HubSpot contact property values for known visitors.
To personalize content for visitors, you first need to identify them. HubSpot’s tracking code enables this by recognizing known contacts based on their cookies. If you haven’t already, install the HubSpot tracking code on your WordPress site.
If you’re using Air Traffic Control, this step is handled for you. Our platform automatically creates and populates properties like:
These properties can be displayed directly on your WordPress site to provide dynamic, personalized content.
Use the following JavaScript snippet to retrieve a visitor’s contact ID and fetch their HubSpot properties:
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function() {
// Fetch the contact properties
fetch(`/wp-json/hubspot/v1/contact`)
.then(response => response.json())
.then(data => {
if (data && data.properties) {
// Populate the page with personalized content
document.getElementById('recommended-title').innerText = data.properties.ATC_Blog_Headline_1.value;
document.getElementById('recommended-link').href = data.properties.ATC_Blog_Link_1.value;
document.getElementById('recommended-image').src = data.properties.ATC_Blog_Image_1.value;
}
});
});
</script>
In WordPress, you’ll need a REST API endpoint to securely retrieve HubSpot contact properties. Add this code to your theme’s functions.php file or a custom plugin:
add_action('rest_api_init', function () {
register_rest_route('hubspot/v1', '/contact', array(
'methods' => 'GET',
'callback' => 'fetch_hubspot_contact',
'permission_callback' => '__return_true',
));
});
function fetch_hubspot_contact($data) {
$contact_email = $_COOKIE['hubspotutk']; // Example for identifying user; adjust based on your needs
$response = wp_remote_get(
'https://api.hubapi.com/crm/v3/objects/contacts/' . $contact_email . '?properties=ATC_Blog_Headline_1,ATC_Blog_Link_1,ATC_Blog_Image_1',
array('headers' => array('Authorization' => 'Bearer ' . HUBSPOT_API_KEY))
);
if (is_wp_error($response)) {
return $response;
}
return json_decode(wp_remote_retrieve_body($response), true);
}
Use the following HTML structure in your WordPress page:
<div>
<h2 id="recommended-title">Loading...</h2>
<a id="recommended-link" href="#">
<img id="recommended-image" src="" alt="Recommended Content">
</a>
</div>
The JavaScript and API endpoint will dynamically populate these elements with personalized content for each known visitor.
With the combination of HubSpot’s CRM, Air Traffic Control’s advanced personalization capabilities, and the flexibility of WordPress, you can create web experiences that feel tailored, relevant, and impactful. Whether you’re displaying personalized blog recommendations, targeted product suggestions, or custom calls-to-action, this integration opens up endless possibilities.
At Air Traffic Control, our mission is to help you deliver a personal future of revenue. If you’re ready to take your website personalization to the next level, get in touch with us or start your free trial today!