How To Use Cookie-Free Domains The Complete Tutorial

Jan 2, 2023
Sitting in front of a computer learning how to use cookie free domains

It's feasible to reduce dead weight (in the case of dead cookies) by using cookie-free domains. In this complete guide, we'll review the basics of domains that are cookie-free, their benefits, and why they're useful, and how you can configure your WordPress website to make use of the services.

However, before that, let's dig into the digital cookie jar and look at how domains use cookies -- for better or for worse.

Cookie-free domains are parts of a site that don't send cookies to users web browsers.

However, why should we not be sending cookies all the time? In the end, wouldn't it be courteous to send users the most cookies possible?

Not necessarily. When we're talking about cookie-free domains, we're of course referring to HTTP cookies. Contrary to the delicious baked goodies we enjoy, HTTP cookies are little packets of data that websites send to the browsers of users. Though they're not exactly delicious however, they're very useful in helping websites "remember" visitors when they return.

However, just like actual cookies, it's not a good idea to serve too many HTTP cookies. In the next paragraph, visitors love a few cookies, but serving greater than they require will make them feel sluggish and full of gas.

What are HTTP cookies?

HTTP cookies are everywhere on the internet.

When you go to a site you're likely to find that the site will require for you to save cookies using your web browser. In addition to information about the website itself and the page you've visited, cookies also contain a personal ID that you can associate with your web browser. The identifier allows websites to "remember" even if you've previously visited the page.

Let's look a bit closer at how this cookie exchange functions (spoiler hint: there's no cute wicker baskets, or girl scouts in the mix).

How websites send HTTP cookies to users’ web browsers
How do websites transmit HTTP cookies to their users' web browsers

As shown in the image above, this exchange could be broken down into three stages:

  1. The web server transmits both the webpage and cookie. After receiving your request the web server sends back the page you requested and also an informational cookie. As we mentioned earlier, it is almost always your personal identification number and your browser.
  2. The browser requests another page from the same server. Let's suppose you click the link for a different page within the website for example "Shop" or "About Us" on an online store. Here, your browser sends an additional request to the web server, along with the cookie that it originally received. Once the web server has received this request, it sees the previous cookie and also remembers the website you've previously been to. By using this data that the server has, it is able to offer more personal experiences by keeping your login active or adding products in your shopping cart.

There are also different cookies to serve different functions. In the example above the web server involved in session management maintains your account login and shopping cart products -- or also known as your personal session is stored on their site. Similarly, cookies can also be utilized to provide personalized experiences, such as the latest orders or products you have viewed, or specific advertisements.

It may be nice receiving cookies no matter where you go, it's actually not all it's made out to be. In the next section, it's actually possible for a website to deliver more than one cookie and some that many people would rather not "eat."

How Domains Use HTTP Cookies

Personal identifiers may be a extremely important reason to use HTTP cookies, they're not the only uses. Cookies can be used for a wide variety of reasons to offer more personalized web experiences, deliver targeted content, and many more.

How cookies might be used to violate privacy
What are the ways cookies can be used to violate privacy

The article previously covered the way that web browsers and websites exchange HTTP cookies to "remember" you. While this is useful in ensuring logins are maintained and displaying shopping cart items, cookies could also serve even more violent (or outright annoying) motives.

Here are some of the most commonly used ways for domains to make use of HTTP cookies.

  • Management of sessions. It's a term you've probably heard already. Session management is generally thought of as the most "benign" use for HTTP cookies since it's sole function is to deliver a consistent user experience that helps the user avoid having to repeat certain actions. Even though seeing prior activity could cause privacy issues for certain users, it's generally safe. Privacy issues arise when cookies are used to perform monitoring, and we'll discuss this shortly.

It is good to know that most HTTP cookies are used to manage sessions and for personalization. However, even the most benign cookies could cause issues.

So far, we've explored the notion of a page that sends one cookie. However, a single page typically transmits multiple cookies, usually one for every element of the page -- HTML, image files etc. While some of the cookies are necessary for session management and personalization, the majority of them aren't.

It's possible to send too many cookies. This can cause several problems. We'll discuss those problems in the following section.

Doing Too Much Cookies

Like most other documents, web pages are a collection of various elements, which provide them with form an identity, structure, and function. Each element can be a part of a cookie.

Although the standard documents we browse in .pdf or .docx format may appear to be a single "combination" of text and pictures Web pages consist out of many small parts.

HTML, CSS, and JavaScript are major components of most websites
HTML, CSS, and JavaScript are major components of many websites.

If the server on your website is also sending cookies, it may be able to automatically transmit a cookie for every single element in this procedure. That might not mean much on a page that has only a couple of pictures, but it could quickly become overwhelming if an online page contains several hundred or more elements and it is also creating a cookie for every one.

Just like eating too many cookies in actual life when you send and receive more HTTP cookies leads to sluggish performance. Because sending additional data takes more time and energy and sending cookies with every element can easily use up lots of resources on the network.

The solution to sending too many cookies employs the same analogy in real life: to improve performance, simply consume (read and send) smaller amounts of cookies.

But which cookies do we need to surrender? It's generally the best practice to remove cookies from all web page that has static elements.

The static elements are ones don't change according to the user's behavior, such as static images, or static files such as CSS files. Therefore, they aren't required to have cookies associated with them. This makes removing them one of the best methods to decrease network load and improve efficiency.

Naturally, eliminating cookies isn't as simple as unchecking the "cookies" box.

Structure of a URL showing a subdomain
Structure of a URL showing the subdomain

It's not too difficult to set up domains that are cookie-free if you use the correct tools and creating a subdomain isn't the only way to do this.

Before we get our hands dirty we'll look into some of the greatest advantages of using cookies-free domains and the magnitude the impact it can affect your website (and your budget).

Removing extra cookies may sound like a small action -- and in truth this is.

This small step has some significant advantages. In sending only the cookies that you require, you'll lighten your network usage and gain several other advantages that are listed below -- many that have nothing to do with anything to do with performance.

Reduces the amount of unnecessary network traffic

Most benefits of using cookies-free domains are due to reducing the burden on your network from excessive cookies.

We have already discussed that sending elements of your page to users requires a certain quantity of network resources. In addition to the element itself the elements (or even multiple parts of an element) is sent along by way of response headers, which contain routing information, along with other elements such as cookies.

Although cookies are tiny data files, the need to transmit a large amount of them in everypage request could quickly add up. As a result, users must wait longer for the page to load as your poor web host is overloaded (and consequently it goes over budget).

If you use cookie-free domains, however, you'll eliminate most of the bulk caused through the use of cookies that aren't needed.

Enhances the Performance of Websites

SEO Benefits and Improves User Experience

Experience for customers is one of the main benefits that comes with having a lower load time, customers can gain access to the information they require more quickly. This means they'll be more inclined to explore your website (and the products and services you offer) and less likely leave your website in anger.

Similar benefits apply for SEO. Although loading times for pages don't directly affect SEO, your bounce rate -- the proportion of users who click off your page -is definitely affecting.

Shoppers don’t want to wait long for a page to load
Page load speeds

Based on a survey by Unbounce, three-quarters of shippers are likely to leave a site if they have to wait more than four seconds for it to load.

Lowers Hosting Costs

The traffic generated by networks eventually costs money in web hosting fees.

That means if you're sending cookies more than you're required in addition to paying higher hosting costs for your website. When cookies impact web page performance, the harm can be doubled. In addition to paying for more visitors, you'll also need to shell out additional traffic to receive similar results due to the increased bounce rate caused by slow load times.

Cookies-free Future Ready

Techniques for Using Cookies-Free Domains

By this approach, you'll create a separate domain for hosting your website's static components like images, and CSS.

Are you interested in knowing the ways we have increased volume by more than 1000 per cent?

Join over 20,000 others to receive our weekly newsletter that contains insider WordPress advice!

If you want to register an entirely separate domain name, it's generally cheaper and less expensive to create a subdomain of your existing domain name. Most cookie-free domains simply use a static prefix (e.g., "static.yourdomain.com") as their subdomain.

When you create your cookie-free domain, you can upload static components, like your CSS components as well as images, text as well as JavaScript.

Use the Content Delivery Network (CDN)

Instead of creating separate subdomains and edit configuration files, you can simply tell your CDN to ignore and strip cookies from the response headers of your static elements. That may sound a bit difficult, but it's a simple feature in many CDNs.

Be aware that not every CDN has this capability. This is why it's usually better to alter your website's configuration unless you're already working with an CDN that allows you to disallow cookies.

Reconfigure Your WordPress Site

Utilize a WordPress Plugin

Another simple WordPress solution is to make use of the plugin to build dynamic versions of WordPress websites.

One popular plugin for doing this is WP2Static (literally "WordPress-to-Static"). After installing the plugin, simply open it in your WordPress dashboard and then configure the settings to export your site's content to static versions:

Creating a static version of a WordPress site in WP2Static
WP2Static

Like I said, WordPress offers an easy method to set up cookie-free domains. The procedure is boiled down to a few simple steps:

  1. The addition of an alternate subdomain as well as an its DNS
  2. Informing WordPress the domain that will offer static assets
  3. Refreshing existing WordPress databases to include the new address

Below, we'll discuss both.

customers can associate subdomains (or entirely other domains) to customers can associate subdomains (or completely different domains) with a WordPress instance within My. My dashboard. Many customers will also use My's tools to configure DNS for those domains.

In this example we'll set up a cookie-free domain at static.example.com for our site that is already running at www.example.com.

Step 1. Create a Subdomain in My

If you initially established your WordPress site using the wildcard feature with the Domain name (like: *.example.com) You are ready to accept all subdomain names. If you don't, add the new domain for cookie-free content like this:

  • Choose WordPress Websites on the left-hand menu.
  • Select the URL of your WordPress website.
  • Select Domains from the menu left.
  • Click the "Add" Domain click.
Screenshot: Adding another domain within My.
Adding a subdomain inside My.

The following dialogue:

  • Type the name of your domain that is cookie-free.
  • Click the "Add" Domain click.
Screenshot: Typing a new domain name within My.
Specifying the new subdomain in My.

Your new static domain needs a DNS record pointing at your current website. If you manage DNS on behalf of your domains through the services of a third party, you will use their tools for this. If your DNS is hosted by us, configure your domain's new name in My like this:

  • Click DNS in the left-hand menu on the MyKinta homepage.
  • Then, on the DNS Management page, scroll down to the DNS Records block and then click on the "Add DNS Record" button.

We suggest adding your brand newly created subdomain in DNS as an CNAME record, allowing users to use only the second-level domain name to make association with IP addresses. Below, we've added a CNAME record for static which points at example.com:

Screenshot: Creating a DNS record within My.
Making an CNAME record in My DNS management.

Step 2. Disable Cookies on Your static subdomain

We'll now edit your WordPress site's wp-config.php file so that assets within the wp-content folder are served up through the "static" domain and cookies are only delivered through only the "www" website address.

A majority of users will utilize an FTP/SFTP-based client to sign in to their WordPress website and then upload wp-config.php to their desktop to edit:

Screenshot: Downloading wp-config.php with an SFTP client.
Downloading the wp-config.php document to your desktop.

Make use of a text editor insert the following line of code into your wp-config.php file (replacing the default domains with your own):

define("WP_CONTENT_URL", "https://static.example.com/wp-content");
 define("COOKIE_DOMAIN", "www.example.com");

Once you have saved the file, upload it to your WordPress website, and replace the original version.

3. Move existing assets over to the Subdomain

The steps above will allow cookies to be distributed as browsers load information such as blog entries and pages using"www. "www" address, but can cause media files and other assets such as JavaScript, CSS and fonts within themes to be associated with that "static" domain.

However, your website may already have content that contains hyperlinks to these assets with"www" addresses "www" URL. You can clean that by performing a search and replace within the WordPress database itself.

  • Click on WordPress Websites on the left-hand menu on the My Dashboard.
  • Click the link to your WordPress site.
  • Select Domains on the left-hand menu.
  • On the Site Information page, scroll down to The Database Access block. (You are able to copy your details about the database's username and password there if you need to.)
  • Click the Open the phpMyAdmin link.
  • Log in into Your WordPress database.
  • Click the SQL tab.
Screenshot: Updating content in the WordPress database using phpMyAdmin.
Running an SQL query to refresh asset links in WordPress the content.

Follow the below command to be sure that all links in your existing posts are directed to the cookie-free subdomain (again be sure to substitute the domains for the ones you own):

UPDATE wp_posts SET post_content = REPLACE(post_content, 'www.example.com/wp-content/', ' static.example.com/wp-content/')
 

1. Make a subdomain using cPanel.

Go to the Domains section on the cPanel homepage. Within the Subdomains tool, simply create a subdomain connected to the top-level domain of your current WordPress website.

These settings can be seen below, to make this Subdomain static.example.com.

Creating a subdomain in cPanel
Creating a subdomain in cPanel

2. Configure the subdomain as static within cPanel

With your new static subdomain set to go, it's time to make it live up to its name by making it serve static content in WordPress.

This is done by changing the WordPress website's wp-config.php file. One of the easiest ways to access this file is in cPanel's File Manager software.

In the File Manager, navigate to your website's public_html directory and select wp-config.php (1). Select Edit option (2) to edit the file. Edit option (2) to change the file.

Locating the wp-config.php file in the cPanel File Manager tool
Locate the wp-config.php file

In the wp-config.php file, simply include the following line (being certain to replace the domains with your own! ):

define("WP_CONTENT_URL", "https://static.example.com/wp-content");
 define("COOKIE_DOMAIN", "www.example.com");

Select " Save Changes."

3. Transfer existing posts to the Subdomain

Within the Database section of cPanel, open the PhpMySQL software. Pick the database for your website, and after that, its _posts table.

Select for the SQL tab of the _posts table. Use the following command to verify that your post URLs will be directed to the cookie-free subdomain (again, being sure to substitute the domains for the ones you own):

UPDATE wp_posts SET post_content = REPLACE(post_content, 'www.example.com/wp-content/', ' static.example.com/wp-content/')
 
Redirecting existing posts to the new static subdomain
Redirecting existing posts to the new subdomain that is static

It's that easy! You've now established a domain that is cookie-free on WordPress by using cPanel. Use the cookie-free domain for static content such as photos, CSS, JavaScript, as well as fonts. All you need to do is allow cookies to be used on the principal domain.

Summary

Using cookie-free domains is an effective strategy to improve your site performance as well as reduce hosting costs as well as improve your user experience and search engine optimization.

  • Easy setup and management in the My dashboard
  • 24/7 expert support
  • The most efficient Google Cloud Platform hardware and network that is powered by Kubernetes for the highest scalability
  • A high-end Cloudflare integration for speed and security
  • Reaching a global audience with up to 35 data centers as well as more than 275 PoPs in the world.