If you don't have any specific requirements for your 404 page, you can use Uscreen's default page without any additional steps.
To brand your 404 page, you can add the following code with your modifications to the Head Code section of the Code Snippets.
This 404 page will display your site's logo by default and will be presented for any 404 page on your site. If you wish to further customize this and aren't familiar with basic HTML/CSS, you'll need to hire a developer.
Customization Code
Copy the following code into the Head Code section of your code snippets.
<script>
let detect404Page = () => {
let notFoundContainer = document.querySelector('.not-found')
if (notFoundContainer) {
if (!notFoundContainer.classList.value.includes('touched')) {
let markup = 'ADD YOUR OWN TEXT HERE'
let description = document.querySelector('.not-found .description')
description.innerText = ''
description.insertAdjacentHTML('afterbegin', markup)
notFoundContainer.classList.add('touched')
}
document.querySelector('div.title-area.mb-4').textContent=""
}
setTimeout(() => detect404Page(), 500)
}
detect404Page()
</script>
<style>
.not-found {
margin-top: 13vw !important;
}
.not-found .brand-logo {
max-height: 150px;
}
.not-found .error-image {
display: none;
}
.not-found .title-area,
.not-found .description {
font-size: 0;
}
.not-found.touched .description {
font-size: 20px;
text-align: center;
max-width: 800px;
}
body > div.relative.z-100 > div.not-found.touched > div{
height:100%;
}
.not-found .description {
margin-top: 10px;
}
.not-found .title-area:before {
content: 'ADD YOUR OWN TEXT HERE';
font-size: 35px;
}
</style>
Please be advised that our support team is not equipped to provide assistance with custom coding. If you require guidance on implementation or utilizing the code beyond its current state, we recommend seeking the assistance of a skilled developer.