I mentioned in another post about using an open-source application called OpenReplay to monitor how customers and users use your website. In this article, I will explain how to add OpenReplay to WordPress for UX research.
Let’s recap what OpenReplay is quick. OpenReplay is an app to record user sessions on your website. OpenReplay saves those sessions so that you can watch the person using your website as if you were standing behind them IRL. It does this by recording DOM events and playing back those events on a timeline.
WordPress is one of the most popular website platforms on the web. That’s why we’ll explain how to add OpenReplay to WordPress in this article today.
As a side note, we will not explain how to capture user accounts, or how to identify users, in OpenReplay from WordPress in this article. We will save that for another article. The purpose of using OpenReplay for this article is for UX research. In this case, we’ll use OpenReplay to find common issues in our website to fix later.
So, let’s get into it.
First, log into your OpenReplay wen portal and navigate to the settings area. Once in the settings area of OpenReplay, click on ‘Projects’ in the left-hand menu.
For the purposes of this article, we are going to assume you have a project already made in OpenReplay. If not, click on the blue + symbol next to Projects in the top-left of the OpenReplay Dashboard. Otherwise, click on ‘Tracking Code’ next to your project in the OpenReplay dashboard.
Once the Tracking Code menu opens, click on the ‘Script’ tab and then ‘Copy’.
This will copy the tracking code into the clipboard on your computer.
Now that we have the OpenReplay tracking code, it’s time to add OpenReplay to WordPress. Navigate to your WordPress website, log in to an account with Admin rights, and then go to the WordPress Dashboard.
Once in the WordPress Dashboard, click ‘Themes’ in the left-hand navigation menu. Then click on ‘Theme File Editor’.
Once the Theme Editor loads, look for Theme Header in the right-hand navigation menu. The specific order for this menu might change depending on the theme you have loaded in WordPress.
In the Theme Header file, look for the end head tag. It will look like this: </head>
On the line directly above the </head> tag, copy the OpenReplay tracking code there.
That’s it! You’re all done. Give it a little bit and OpenReplay will connect itself to your website.
One last note, there is a lag time between when users stop using your website and when their sessions appear in your OpenReplay dashboard. If you are waiting for a session to display, give it a bit and ask your user to navigate away from your website when they are done using it.
