Skip to content

Commit ba6826f

Browse files
codercatdevAlex Patterson
codercatdev
and
Alex Patterson
authored
fix meta on top levels (CodingCatDev#530)
Co-authored-by: Alex Patterson <alex.patterson@fusionauth.io>
1 parent d0ba2df commit ba6826f

File tree

2 files changed

+53
-36
lines changed

2 files changed

+53
-36
lines changed

‎apps/codingcatdev/src/routes/+layout.svelte‎

Lines changed: 8 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,7 @@
3131
import type { Author, Content } from '$lib/types';
3232
import { analyticsLogPageView } from '$lib/client/firebase';
3333
import CannyButton from './(feedback)/CannyButton.svelte';
34+
import MetaTags from './MetaTags.svelte';
3435
3536
// Scroll heading into view
3637
function scrollHeadingIntoView(): void {
@@ -89,7 +90,11 @@
8990
9091
let content: (Content & Author) | undefined = undefined;
9192
let authors: Author[] | undefined = undefined;
93+
let topLevelPage: boolean | undefined = false;
9294
page.subscribe((page) => {
95+
topLevelPage = page?.route?.id?.includes('top-level-pages');
96+
console.log(topLevelPage);
97+
9398
content = page?.data?.content || page?.data?.course;
9499
authors = page?.data?.authors;
95100
@@ -125,42 +130,9 @@
125130
});
126131
</script>
127132

128-
<svelte:head>
129-
<title>{meta.title}</title>
130-
<!-- Meta Tags -->
131-
<meta name="title" content={meta.title} />
132-
<meta name="description" content={meta.description} />
133-
<meta name="keywords" content="codingcatdev, webdev, webdevelopment, learning, beginner" />
134-
<meta name="theme-color" content="#6366f1" />
135-
<meta name="author" content="CodingCatDev, LLC" />
136-
<!-- Open Graph - https://ogp.me/ -->
137-
<meta property="og:site_name" content="CodingCat.dev" />
138-
<meta property="og:type" content="website" />
139-
<meta property="og:url" content="https://codingcat.dev{$page.url.pathname}" />
140-
<meta property="og:locale" content="en_US" />
141-
<meta property="og:title" content={meta.title} />
142-
<meta property="og:description" content={meta.description} />
143-
<meta property="og:image" content={meta.image} />
144-
<meta property="og:image:secure_url" content={meta.image} />
145-
<meta property="og:image:type" content="image/jpg" />
146-
<meta property="og:image:width" content="1920" />
147-
<meta property="og:image:height" content="1080" />
148-
149-
<!-- OG: Article -->
150-
{#if content}
151-
<meta property="article:published_time" content={meta.article.publishTime} />
152-
<meta property="article:modified_time" content={meta.article.modifiedTime} />
153-
<meta property="article:author" content={meta.article.author} />
154-
{/if}
155-
156-
<!-- Open Graph: Twitter -->
157-
<meta name="twitter:card" content="summary_large_image" />
158-
<meta name="twitter:site" content="@CodingCatDev" />
159-
<meta name="twitter:creator" content="@CodingCatDev" />
160-
<meta name="twitter:title" content={meta.twitter.title} />
161-
<meta name="twitter:description" content={meta.twitter.description} />
162-
<meta name="twitter:image" content={meta.twitter.image} />
163-
</svelte:head>
133+
{#if !topLevelPage}
134+
<MetaTags {meta} {content} page={$page} />
135+
{/if}
164136

165137
<!-- Overlays -->
166138
<CcdDrawer />

‎apps/codingcatdev/src/routes/MetaTags.svelte‎

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
<script lang="ts">
2+
import type { Content, Author } from '$lib/types';
3+
import type { Page } from '@sveltejs/kit';
4+
5+
export let meta: any;
6+
export let content: (Content & Author) | undefined = undefined;
7+
export let page: Page<Record<string, string>, string | null>;
8+
</script>
9+
10+
<svelte:head>
11+
<title>{meta.title}</title>
12+
<!-- Meta Tags -->
13+
<meta name="title" content={meta.title} />
14+
<meta name="description" content={meta.description} />
15+
<meta name="keywords" content="codingcatdev, webdev, webdevelopment, learning, beginner" />
16+
<meta name="theme-color" content="#6366f1" />
17+
<meta name="author" content="CodingCatDev, LLC" />
18+
<!-- Open Graph - https://ogp.me/ -->
19+
<meta property="og:site_name" content="CodingCat.dev" />
20+
<meta property="og:type" content="website" />
21+
<meta property="og:url" content="https://codingcat.dev{page.url.pathname}" />
22+
<meta property="og:locale" content="en_US" />
23+
<meta property="og:title" content={meta.title} />
24+
<meta property="og:description" content={meta.description} />
25+
<meta property="og:image" content={meta.image} />
26+
<meta property="og:image:secure_url" content={meta.image} />
27+
<meta property="og:image:type" content="image/jpg" />
28+
<meta property="og:image:width" content="1920" />
29+
<meta property="og:image:height" content="1080" />
30+
31+
<!-- OG: Article -->
32+
{#if content}
33+
<meta property="article:published_time" content={meta.article.publishTime} />
34+
<meta property="article:modified_time" content={meta.article.modifiedTime} />
35+
<meta property="article:author" content={meta.article.author} />
36+
{/if}
37+
38+
<!-- Open Graph: Twitter -->
39+
<meta name="twitter:card" content="summary_large_image" />
40+
<meta name="twitter:site" content="@CodingCatDev" />
41+
<meta name="twitter:creator" content="@CodingCatDev" />
42+
<meta name="twitter:title" content={meta.twitter.title} />
43+
<meta name="twitter:description" content={meta.twitter.description} />
44+
<meta name="twitter:image" content={meta.twitter.image} />
45+
</svelte:head>

0 commit comments

Comments
 (0)