Skip to main content

Not Available (Access Restricted) Page

Understanding and customizing your Restricted Access page

Updated today

A Restricted Access page (also known as the "Not Available" page) appears when users try to access content that is geo-blocked in their location. This page serves as a boundary notification, informing visitors that the content they're attempting to view is not available in their region due to geographic restrictions you've set up.

This can happen when:

  • The website is restricted to specific countries or regions

  • The content is restricted by geo-blocking

🔗 Learn more about Geo-Blocking Feature

ℹ️ INFO: The Restricted Access page helps maintain a professional user experience even when access must be denied.


Why is the Page Important?

A Restricted Access page can:

  • Clearly explain why the content is unavailable

  • Maintain your brand's professional appearance

  • Reduce user frustration by providing context

  • Guide users to content that is available to them

  • Support your geo-blocking strategy while preserving user experience

ℹ️ INFO: Without a proper Restricted Access page, users might be confused about why they can't access content, potentially leading to support inquiries or negative impressions of your brand.


Default Restricted Access Page

By default, Uscreen provides a standard Restricted Access (/not_available) page that displays your site's logo. When your users try to access content that is geo-blocked in their location, they will land on the Restricted Access page.


Customize your Restricted Access Page

You can personalize your Restricted Access page by adding custom code to the Head Code section of your Code Snippets.

📝 NOTE: Please be advised that our support team cannot assist with custom coding. If you need help implementing these customizations, we recommend consulting with a developer.

Here's how:

  1. Navigate to Website

  2. On the Website Editor, go to the Advanced tab

  3. Scroll down and select Head Code

  4. Add the following code to the Head Code section

Custom Code

<script>
let applyNotAvailablePageContent = () => {
if (!document.location.pathname.includes('/not_available')) {
return;
}

const notFoundContainer = document.querySelector('.not-found');

if (!notFoundContainer || notFoundContainer.dataset.contentAppliedNotAvailable === 'true') {
if (notFoundContainer && notFoundContainer.dataset.contentAppliedNotAvailable === 'true') {
return;
}
setTimeout(applyNotAvailablePageContent, 100);
return;
}

if (!document.getElementById('not-available-dynamic-styles')) {
const styleTag = document.createElement('style');
styleTag.id = 'not-available-dynamic-styles';
styleTag.textContent = `
.not-found .brand-logo {
max-height: 150px;
}
.not-found .error-image {
display: none;
}
img.error-image,
.logo-area,
.title-area {
margin-bottom: 0!important;
}
.not-found .title-area,
.not-found .description {
font-size: 0;
}
.not-found.processed-not-available .description {
text-align: center;
max-width: 800px;
margin-top: 10px;
}
.not-found.processed-not-available .title-area {
text-align: center;
}
body > div.relative.z-100 > div.not-found.processed-not-available > div {
height: 100%;
}
.content {
height: auto;
}
.description {
width: auto!important;
}
.not-available-redirect-button {
display: inline-block;
padding: 10px 20px;
margin-top: 20px;
background-color: #016AFF;
color: white;
text-decoration: none;
border-radius: 5px;
font-size: 16px;
cursor: pointer;
border: none;
}
.not-available-redirect-button:hover {
background-color: #1e40af;
}
`;
document.head.appendChild(styleTag);
}

/* ----- Replace the subheading and button text ----- */
const markup = `
Access to this content is currently restricted.<br>
<a href="/catalog" class="not-available-redirect-button">Back to Catalog</a>
`;
// ----- Replace with Heading text -----
const newTitle = 'Page Not Available';

const description = notFoundContainer.querySelector('.description');
const title = document.querySelector('.title-area');
const errorImage = notFoundContainer.querySelector('.error-image');

if (description) {
description.innerText = '';
description.insertAdjacentHTML('afterbegin', markup);
description.style.fontSize = '20px';
description.style.marginTop = '10px';
}

if (title) {
title.innerText = '';
title.insertAdjacentHTML('afterbegin', newTitle);
title.style.fontSize = '35px';
}

/* ----- Replace the Image URL ----- */
if (errorImage) {
errorImage.style.background = 'url(https://s3.amazonaws.com/unode1/assets/9224/Rh74UFFATPqZhVf7bqeJ_geoblocked.png) no-repeat';
errorImage.style.width = '400px';
errorImage.style.height = '400px';
errorImage.style.paddingLeft = '400px';
errorImage.style.display = 'block';
}

notFoundContainer.dataset.contentAppliedNotAvailable = 'true';
notFoundContainer.classList.add('processed-not-available');
};

applyNotAvailablePageContent();
</script>

ℹ️ INFO: The Timeout in the code is used to ensure the page has fully loaded before modifications occur. This approach is necessary because Uscreen's default 404 page may not be immediately available when the script runs.

Result


Redirect Restricted Access Pages to Catalog

If you prefer to redirect users to your catalog page instead of showing the Restricted Access error, you can use this alternative code in your Head Code Snippet.

📝 NOTE: While redirecting might seem convenient, it's generally better for SEO to handle 404 errors properly rather than automatically redirecting them. Search engines prefer sites that maintain proper error responses.

Custom Code

<script>
let detectRestrictedPage = () => {
if (document.location.href.includes('/not_available')) {
let notFoundContainer = document.querySelector('.not-found')
if (notFoundContainer && !notFoundContainer.classList.value.includes('touched')) {
window.location.href = "/catalog"
}
}
setTimeout(() => detectRestrictedPage(), 500)
}
detectRestrictedPage()
</script>

💬 We'd love to hear from you, so here's how you can submit feedback.

Did this answer your question?