diff --git a/pages/404.js b/pages/404.js
index a5601f35d..4a5f4bd95 100644
--- a/pages/404.js
+++ b/pages/404.js
@@ -6,7 +6,7 @@ export default function Custom404() {
   const { formatMessage, labels } = useMessages();
 
   return (
-    <AppLayout>
+    <AppLayout title={formatMessage(labels.pageNotFound)}>
       <Row>
         <Column>
           <Flexbox alignItems="center" justifyContent="center" flex={1} style={{ minHeight: 600 }}>
diff --git a/pages/dashboard/index.js b/pages/dashboard/index.js
index 61377313f..061697f44 100644
--- a/pages/dashboard/index.js
+++ b/pages/dashboard/index.js
@@ -1,9 +1,12 @@
 import AppLayout from 'components/layout/AppLayout';
 import Dashboard from 'components/pages/dashboard/Dashboard';
+import useMessages from 'hooks/useMessages';
 
 export default function DashboardPage() {
+  const { formatMessage, labels } = useMessages();
+
   return (
-    <AppLayout>
+    <AppLayout title={formatMessage(labels.dashboard)}>
       <Dashboard />
     </AppLayout>
   );
diff --git a/pages/realtime/[id]/index.js b/pages/realtime/[id]/index.js
index 1eabda32a..1cc826ee8 100644
--- a/pages/realtime/[id]/index.js
+++ b/pages/realtime/[id]/index.js
@@ -1,17 +1,23 @@
 import { useRouter } from 'next/router';
 import AppLayout from 'components/layout/AppLayout';
 import RealtimeDashboard from 'components/pages/realtime/RealtimeDashboard';
+import useMessages from 'hooks/useMessages';
+import useApi from 'hooks/useApi';
 
 export default function RealtimeDetailsPage() {
   const router = useRouter();
   const { id: websiteId } = router.query;
+  const { formatMessage, labels } = useMessages();
+  const { get, useQuery } = useApi();
+  const { data: website } = useQuery(['websites', websiteId], () => get(`/websites/${websiteId}`));
+  const title = formatMessage(labels.realtime) + ' | ' + website?.name;
 
   if (!websiteId) {
     return null;
   }
 
   return (
-    <AppLayout>
+    <AppLayout title={title}>
       <RealtimeDashboard key={websiteId} websiteId={websiteId} />
     </AppLayout>
   );
diff --git a/pages/realtime/index.js b/pages/realtime/index.js
index fa0d86d63..bb016173c 100644
--- a/pages/realtime/index.js
+++ b/pages/realtime/index.js
@@ -1,9 +1,11 @@
 import AppLayout from 'components/layout/AppLayout';
 import RealtimeHome from 'components/pages/realtime/RealtimeHome';
+import useMessages from 'hooks/useMessages';
 
 export default function RealtimePage() {
+  const { formatMessage, labels } = useMessages();
   return (
-    <AppLayout>
+    <AppLayout title={formatMessage(labels.realtime)}>
       <RealtimeHome />
     </AppLayout>
   );
diff --git a/pages/settings/profile/index.js b/pages/settings/profile/index.js
index ccbff02bc..c7dd7d6c4 100644
--- a/pages/settings/profile/index.js
+++ b/pages/settings/profile/index.js
@@ -1,10 +1,12 @@
 import AppLayout from 'components/layout/AppLayout';
 import SettingsLayout from 'components/layout/SettingsLayout';
 import ProfileSettings from 'components/pages/settings/profile/ProfileSettings';
+import useMessages from 'hooks/useMessages';
 
 export default function ProfilePage() {
+  const { formatMessage, labels } = useMessages();
   return (
-    <AppLayout>
+    <AppLayout title={formatMessage(labels.profile)}>
       <SettingsLayout>
         <ProfileSettings />
       </SettingsLayout>
diff --git a/pages/settings/teams/[id]/index.js b/pages/settings/teams/[id]/index.js
index 9d5477bc0..400d57359 100644
--- a/pages/settings/teams/[id]/index.js
+++ b/pages/settings/teams/[id]/index.js
@@ -2,17 +2,19 @@ import AppLayout from 'components/layout/AppLayout';
 import SettingsLayout from 'components/layout/SettingsLayout';
 import TeamSettings from 'components/pages/settings/teams/TeamSettings';
 import { useRouter } from 'next/router';
+import useMessages from 'hooks/useMessages';
 
 export default function TeamDetailPage({ disabled }) {
   const router = useRouter();
   const { id } = router.query;
+  const { formatMessage, labels } = useMessages();
 
   if (!id || disabled) {
     return null;
   }
 
   return (
-    <AppLayout>
+    <AppLayout title={formatMessage(labels.teams)}>
       <SettingsLayout>
         <TeamSettings teamId={id} />
       </SettingsLayout>
diff --git a/pages/settings/teams/index.js b/pages/settings/teams/index.js
index 2020a05e9..c2304ab0a 100644
--- a/pages/settings/teams/index.js
+++ b/pages/settings/teams/index.js
@@ -1,14 +1,16 @@
 import AppLayout from 'components/layout/AppLayout';
 import SettingsLayout from 'components/layout/SettingsLayout';
 import TeamsList from 'components/pages/settings/teams/TeamsList';
+import useMessages from 'hooks/useMessages';
 
 export default function TeamsPage({ disabled }) {
+  const { formatMessage, labels } = useMessages();
   if (disabled) {
     return null;
   }
 
   return (
-    <AppLayout>
+    <AppLayout title={formatMessage(labels.teams)}>
       <SettingsLayout>
         <TeamsList />
       </SettingsLayout>
diff --git a/pages/settings/users/[id]/index.js b/pages/settings/users/[id]/index.js
index 48b8218d7..b25d5295a 100644
--- a/pages/settings/users/[id]/index.js
+++ b/pages/settings/users/[id]/index.js
@@ -2,17 +2,19 @@ import AppLayout from 'components/layout/AppLayout';
 import SettingsLayout from 'components/layout/SettingsLayout';
 import UserSettings from 'components/pages/settings/users/UserSettings';
 import { useRouter } from 'next/router';
+import useMessages from 'hooks/useMessages';
 
 export default function TeamDetailPage({ disabled }) {
   const router = useRouter();
   const { id } = router.query;
+  const { formatMessage, labels } = useMessages();
 
   if (!id || disabled) {
     return null;
   }
 
   return (
-    <AppLayout>
+    <AppLayout title={formatMessage(labels.users)}>
       <SettingsLayout>
         <UserSettings userId={id} />
       </SettingsLayout>
diff --git a/pages/settings/users/index.js b/pages/settings/users/index.js
index 54c07fede..5dbb69664 100644
--- a/pages/settings/users/index.js
+++ b/pages/settings/users/index.js
@@ -1,14 +1,16 @@
 import AppLayout from 'components/layout/AppLayout';
 import SettingsLayout from 'components/layout/SettingsLayout';
 import UsersList from 'components/pages/settings/users/UsersList';
+import useMessages from 'hooks/useMessages';
 
 export default function UsersPage({ disabled }) {
+  const { formatMessage, labels } = useMessages();
   if (disabled) {
     return null;
   }
 
   return (
-    <AppLayout>
+    <AppLayout title={formatMessage(labels.users)}>
       <SettingsLayout>
         <UsersList />
       </SettingsLayout>
diff --git a/pages/settings/websites/[id]/index.js b/pages/settings/websites/[id]/index.js
index 1e6f0521f..63afbf815 100644
--- a/pages/settings/websites/[id]/index.js
+++ b/pages/settings/websites/[id]/index.js
@@ -2,17 +2,19 @@ import AppLayout from 'components/layout/AppLayout';
 import { useRouter } from 'next/router';
 import WebsiteSettings from 'components/pages/settings/websites/WebsiteSettings';
 import SettingsLayout from 'components/layout/SettingsLayout';
+import useMessages from 'hooks/useMessages';
 
 export default function WebsiteSettingsPage({ disabled }) {
   const router = useRouter();
   const { id } = router.query;
+  const { formatMessage, labels } = useMessages();
 
   if (!id || disabled) {
     return null;
   }
 
   return (
-    <AppLayout>
+    <AppLayout title={formatMessage(labels.websites)}>
       <SettingsLayout>
         <WebsiteSettings websiteId={id} />
       </SettingsLayout>
diff --git a/pages/settings/websites/index.js b/pages/settings/websites/index.js
index 54ad47803..4599e7935 100644
--- a/pages/settings/websites/index.js
+++ b/pages/settings/websites/index.js
@@ -1,14 +1,16 @@
 import AppLayout from 'components/layout/AppLayout';
 import SettingsLayout from 'components/layout/SettingsLayout';
 import WebsitesList from 'components/pages/settings/websites/WebsitesList';
+import useMessages from 'hooks/useMessages';
 
 export default function WebsitesPage({ disabled }) {
+  const { formatMessage, labels } = useMessages();
   if (disabled) {
     return null;
   }
 
   return (
-    <AppLayout>
+    <AppLayout title={formatMessage(labels.websites)}>
       <SettingsLayout>
         <WebsitesList />
       </SettingsLayout>
diff --git a/pages/websites/[id]/index.js b/pages/websites/[id]/index.js
index 85b2f1301..d2a258e12 100644
--- a/pages/websites/[id]/index.js
+++ b/pages/websites/[id]/index.js
@@ -1,8 +1,10 @@
 import { useRouter } from 'next/router';
 import AppLayout from 'components/layout/AppLayout';
 import WebsiteDetails from 'components/pages/websites/WebsiteDetails';
+import useMessages from 'hooks/useMessages';
 
 export default function DetailsPage() {
+  const { formatMessage, labels } = useMessages();
   const router = useRouter();
   const { id } = router.query;
 
@@ -11,7 +13,7 @@ export default function DetailsPage() {
   }
 
   return (
-    <AppLayout>
+    <AppLayout title={formatMessage(labels.websites)}>
       <WebsiteDetails websiteId={id} />
     </AppLayout>
   );