dan/design
1
0
Fork 0
mirror of https://github.com/danbulant/design synced 2026-06-18 22:01:06 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

better metadata

Browse source
This commit is contained in:
Daniel Bulant 2022-04-11 15:26:12 +02:00
parent 55fd9c183c
commit 9d172c6d1d
2 changed files with 17 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
src/lib/layouts/post.svelte
View file

@ -24,12 +24,16 @@
<meta property="og:article:published_time" content={date} />
<meta property="og:article:author" content="Daniel Bulant" />
<meta property="og:article:tag" content={categories && categories.join(" ") || ""} />
<meta property="og:image" content={bigThumbnail} />
<meta property="og:image:width" content="800" />
<meta property="og:image:height" content="400" />
<meta property="og:image" content={thumbnail} />
<meta property="og:image:width" content="256" />
<meta property="og:image:height" content="256" />
{#if bigThumbnail}
<meta property="og:image" content={bigThumbnail} />
<meta property="og:image:width" content="800" />
<meta property="og:image:height" content="400" />
{/if}
{#if thumbnail}
<meta property="og:image" content={thumbnail} />
<meta property="og:image:width" content="256" />
<meta property="og:image:height" content="256" />
{/if}
</svelte:head>
<main class:dark={$darkmode} class="post-layout">

10
src/routes/index.svelte
View file

@ -1,5 +1,5 @@
<script context="module">
/** @type {import('./[slug]').Load} */
/** @type {import('./index').Load} */
export async function load({ params, fetch, session, stuff }) {
const response = await fetch("/api/posts.json");
@ -28,7 +28,9 @@
var appTypeHover = null;
export var posts;
$: console.log(posts);
$: if(typeof window !== "undefined") console.log(posts);
var selectedPost = posts && posts.find(t => !t.categories.includes("experiment"));
</script>
<svelte:head>
@ -57,7 +59,9 @@
</Hero>
<div class="blog">
I recently started my own blog.<br>
You can checkout &ldquo;<a href={posts[0].path}><b>{posts[0].title}</b></a>&rdquo; and other recent blog posts:<br>
{#if selectedPost}
You can checkout &ldquo;<a href={selectedPost.path}><b>{selectedPost.title}</b></a>&rdquo; and other recent blog posts:<br>
{/if}
<div style="text-align: center; margin-top: 5px;">
<Button href="/posts">blog</Button>
</div>