cargdev/pruebas-tecnicas
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add url

Browse Source
This commit is contained in:
Miguel Ángel Durán 2023-07-13 20:26:51 +02:00
parent c6af31e324
commit 358c1fcf9c
3 changed files with 1 additions and 161 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/astro.config.mjs
View File

@ -17,7 +17,7 @@ const SERVER_PORT = 3000;
// the url to access your blog during local development // the url to access your blog during local development
const LOCALHOST_URL = `http://localhost:${SERVER_PORT}`; const LOCALHOST_URL = `http://localhost:${SERVER_PORT}`;
// the url to access your blog after deploying it somewhere (Eg. Netlify) // the url to access your blog after deploying it somewhere (Eg. Netlify)
const LIVE_URL = "https://yourwebsiteurl.com"; const LIVE_URL = "https://pruebastecnicas.com";
// this is the astro command your npm script runs // this is the astro command your npm script runs
const SCRIPT = process.env.npm_lifecycle_script || ""; const SCRIPT = process.env.npm_lifecycle_script || "";
const isBuild = SCRIPT.includes("astro build"); const isBuild = SCRIPT.includes("astro build");

90
web/src/components/BlogPostMeta.astro
View File

@ -1,90 +0,0 @@
---
import { getBlogPostMeta } from "../lib/seo";
import {
SITE_TITLE,
SITE_DESCRIPTION,
SITE_URL,
TWITTER_HANDLE,
MY_NAME,
} from "../config";
export interface Props {
title?: string;
description?: string;
publishDate: string;
pagePath?: string;
ogImageAbsoluteUrl?: string;
ogImageAltText?: string;
ogImageWidth?: number;
ogImageHeight?: number;
}
const {
title,
description,
publishDate,
pagePath,
ogImageAbsoluteUrl,
ogImageAltText,
ogImageWidth,
ogImageHeight,
} = Astro.props;
const { meta, og, twitter } = getBlogPostMeta({
title: title || SITE_TITLE,
description: description || SITE_DESCRIPTION,
pageUrl: pagePath ? new URL(pagePath, SITE_URL).toString() : undefined,
authorName: MY_NAME,
publishDate,
ogImageAbsoluteUrl,
ogImageAltText,
ogImageWidth,
ogImageHeight,
siteOwnerTwitterHandle: TWITTER_HANDLE,
contentAuthorTwitterHandle: TWITTER_HANDLE,
});
---
<!-- Primary Meta Tags -->
<title>{meta.title}</title>
<meta name="title" content={meta.title} />
{meta.description && <meta name="description" content={meta.description} />}
{meta.canonicalUrl && <link rel="canonical" href={meta.canonicalUrl} />}
<!-- Open Graph / Facebook -->
{og.title && <meta property="og:title" content={og.title} />}
{og.description && <meta property="og:description" content={og.description} />}
{og.type && <meta property="og:type" content={og.type} />}
{og.url && <meta property="og:url" content={og.url} />}
{og.author && <meta property="article:author" content={og.author} />}
{
og.publishDate && (
<meta property="article:published_time" content={og.publishDate} />
)
}
{og.image && <meta property="og:image" content={og.image} />}
{og.imageAlt && <meta property="og:image:alt" content={og.imageAlt} />}
{og.imageWidth && <meta property="og:image:width" content={og.imageWidth} />}
{og.imageHeight && <meta property="og:image:height" content={og.imageHeight} />}
<!-- Twitter -->
{twitter.title && <meta property="twitter:title" content={twitter.title} />}
{
twitter.description && (
<meta property="twitter:description" content={twitter.description} />
)
}
{twitter.site && <meta property="twitter:site" content={twitter.site} />}
{
twitter.creator && (
<meta property="twitter:creator" content={twitter.creator} />
)
}
<meta property="twitter:card" content="summary_large_image" />
{twitter.image && <meta property="twitter:image" content={twitter.image} />}
{
twitter.imageAlt && (
<meta property="twitter:image:alt" content={twitter.imageAlt} />
)
}
<!-- {twitter.url && <meta property="twitter:url" content={twitter.url} />} -->

70
web/src/lib/seo.ts
View File

@ -110,73 +110,3 @@ export function getPageMeta({
twitter, twitter,
}; };
} }
export function getBlogPostMeta({
title: pageTitle,
description,
canonicalUrl,
pageUrl,
authorName,
publishDate,
ogImageAbsoluteUrl,
ogImageAltText,
ogImageWidth,
ogImageHeight,
siteOwnerTwitterHandle,
contentAuthorTwitterHandle,
}: {
title: string;
description: string;
canonicalUrl?: string;
pageUrl?: string;
authorName?: string;
publishDate: string;
ogImageAbsoluteUrl?: string; // should always be absolute
ogImageAltText?: string;
ogImageWidth?: number;
ogImageHeight?: number;
siteOwnerTwitterHandle?: string;
contentAuthorTwitterHandle?: string;
}): { meta: PageMeta; og: BlogPostOgMeta; twitter: BlogPostTwitterMeta } {
if (!pageTitle) {
throw Error("title is required for page SEO");
}
if (ogImageAbsoluteUrl && !ogImageAltText) {
ogImageAltText = `Preview image for ${pageTitle}`;
}
const meta: PageMeta = {
title: pageTitle,
description: description,
canonicalUrl,
};
const og: BlogPostOgMeta = {
title: pageTitle,
description: description,
type: "article",
url: pageUrl,
author: authorName,
publishDate: publishDate,
image: ogImageAbsoluteUrl,
imageAlt: ogImageAltText,
imageWidth: ogImageWidth ? String(ogImageWidth) : undefined,
imageHeight: ogImageHeight ? String(ogImageHeight) : undefined,
};
const twitter: BlogPostTwitterMeta = {
title: pageTitle,
description: description,
card: "summary_large_image",
site: siteOwnerTwitterHandle,
creator: contentAuthorTwitterHandle || siteOwnerTwitterHandle,
image: ogImageAbsoluteUrl,
imageAlt: ogImageAltText,
};
return {
meta,
og,
twitter,
};
}