feat: added canonical urls

This commit is contained in:
Sergey Yarkov 2022-08-19 15:52:57 +03:00
parent eaac35a0c3
commit dafd68fcd2
13 changed files with 57 additions and 49 deletions

View File

@ -15,7 +15,7 @@
"start": "astro dev",
"build": "astro build",
"preview": "astro preview --host",
"format": "prettier --write \"**/*.{js,jsx,ts,tsx,json}\"",
"format": "prettier --write \"**/*.{js,jsx,ts,tsx,json,astro}\"",
"lint": "eslint '**/*.{js,mjs,ts,tsx}'"
},
"devDependencies": {

View File

@ -39,7 +39,7 @@ const { title, coverImage, tags, author, published_at } = data;
coverImage && (
<div>
<figure>
{coverImage && <img src={coverImage} width='700' height='400' alt={title} />}
{coverImage && <img src={coverImage} width="700" height="400" alt={title} />}
{/* Render remote or local image */}
{/* utils.isURL(coverImage) ? (
<Image itemprop="image" src={coverImage} width={700} height={400} aspectRatio={"16:9"} format={"webp"} alt={data.title} />

View File

@ -5,10 +5,11 @@ import { useTranslation } from "@i18n/utils";
export interface Props {
title?: string | undefined;
description?: string | undefined;
canonicalUrl?: string | undefined;
}
const t = useTranslation(Astro);
const { title = SITE_METADATA.title, description } = Astro.props as Props;
const { title = SITE_METADATA.title, description, canonicalUrl } = Astro.props as Props;
---
<head>
@ -16,9 +17,11 @@ const { title = SITE_METADATA.title, description } = Astro.props as Props;
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,400;0,500;0,600;0,700;1,400&family=IBM+Plex+Mono&display=swap"
rel="preload" as="style" onload="this.rel='stylesheet'"
rel="preload"
as="style"
onload="this.rel='stylesheet'"
/>
{canonicalUrl && <link rel="canonical" href={canonicalUrl} />}
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>{title}</title>

View File

@ -1,24 +1,24 @@
---
import { SITE_METADATA } from '@root/config';
import { Icon } from 'astro-icon';
import './ContactsList.scss';
import { SITE_METADATA } from "@root/config";
import { Icon } from "astro-icon";
import "./ContactsList.scss";
const {
contacts: { email, githubUrl, telegramUrl },
} = SITE_METADATA;
---
<div class='contacts-list'>
<a href={'mailto:' + email}
<div class="contacts-list">
<a href={"mailto:" + email}
>Email
<Icon name='arrow-up-right' width='15' height='15' data-filter='none' />
<Icon name="arrow-up-right" width="15" height="15" data-filter="none" />
</a>
<a href={githubUrl} target='_blank'
<a href={githubUrl} target="_blank"
>Github
<Icon name='arrow-up-right' width='15' height='15' data-filter='none' />
<Icon name="arrow-up-right" width="15" height="15" data-filter="none" />
</a>
<a href={telegramUrl} target='_blank'
<a href={telegramUrl} target="_blank"
>Telegram
<Icon name='arrow-up-right' width='15' height='15' data-filter='none' />
<Icon name="arrow-up-right" width="15" height="15" data-filter="none" />
</a>
</div>

View File

@ -1,24 +1,24 @@
---
import './Footer.scss';
import { Icon } from 'astro-icon'
import "./Footer.scss";
import { Icon } from "astro-icon";
---
<footer class='footer'>
<div class='container'>
<ul class='footer__links'>
<footer class="footer">
<div class="container">
<ul class="footer__links">
<li>
<a href='https://astro.build/' target='_blank'>Astro</a>
<Icon name='astro' width='20' height='20' />
<a href="https://astro.build/" target="_blank">Astro</a>
<Icon name="astro" width="20" height="20" />
</li>
<li>
<a href='https://www.netlify.com/' target='_blank'>Netlify</a>
<Icon name='netlify' width='20' height='20' />
<a href="https://www.netlify.com/" target="_blank">Netlify</a>
<Icon name="netlify" width="20" height="20" />
</li>
<li>
<a href='/rss.xml' target='_blank'>RSS</a>
<Icon name='rss' width='20' height='20' />
<a href="/rss.xml" target="_blank">RSS</a>
<Icon name="rss" width="20" height="20" />
</li>
</ul>
<p class='footer__copy'>© Sergey Yarkov, 2022</p>
<p class="footer__copy">© Sergey Yarkov, 2022</p>
</div>
</footer>

View File

@ -25,7 +25,7 @@ const { pathname } = Astro.url;
{
nav.map((link) => (
<li>
<TranslatedLink class={pathname.includes(removeSlashes(link.url)) && pathname.split('/').length < 5 && "active"} to={link.url}>
<TranslatedLink class={pathname.includes(removeSlashes(link.url)) && pathname.split("/").length < 5 && "active"} to={link.url}>
<UIString key={link.key} />
</TranslatedLink>
</li>

View File

@ -1,7 +1,7 @@
---
import './ProjectsList.scss';
import "./ProjectsList.scss";
---
<div class='projects-list'>
<slot></slot>
<div class="projects-list">
<slot />
</div>

View File

@ -1,5 +1,5 @@
---
import './SkillsList.scss';
import "./SkillsList.scss";
---
<div class='skills-list'><slot></slot></div>
<div class="skills-list"><slot /></div>

View File

@ -10,13 +10,14 @@ import "@styles/global.scss";
export interface Props extends BaseHeadProps {
lang?: string | undefined;
content: ArticleType;
canonicalUrl?: string | undefined;
}
const { lang = "ru", content } = Astro.props as Props;
const { lang = "ru", content, canonicalUrl } = Astro.props as Props;
---
<html lang={lang}>
<BaseHead title={content.title} description={content.description}>
<BaseHead title={content.title} description={content.description} canonicalUrl={canonicalUrl}>
<script is:inline defer src="/assets/js/load-code-highlight.js"></script>
</BaseHead>
<BaseLayout>

View File

@ -10,14 +10,15 @@ import "@styles/global.scss";
export interface Props extends BaseHeadProps {
lang?: string | undefined;
showPageHeading?: boolean | undefined;
noIndex?: boolean;
noIndex?: boolean | undefined;
canonicalUrl?: string | undefined;
}
const { title, description, lang = "ru", showPageHeading = true, noIndex = false } = Astro.props as Props;
const { title, description, lang = "ru", showPageHeading = true, noIndex = false, canonicalUrl } = Astro.props as Props;
---
<html lang={lang}>
<BaseHead title={title ? `${title} | ${SITE_METADATA.title}` : SITE_METADATA.title} description={description}>
<BaseHead title={title ? `${title} | ${SITE_METADATA.title}` : SITE_METADATA.title} description={description} canonicalUrl={canonicalUrl}>
{noIndex && <meta name="robots" content="noindex" />}
</BaseHead>
<BaseLayout>

View File

@ -6,6 +6,7 @@ import { getLanguageFromURL } from "@root/utils";
import { DEFAULT_LANGUAGE } from "@root/config";
const lang = getLanguageFromURL(Astro.url.pathname);
const canonicalUrl = new URL(Astro.url.pathname, Astro.site);
export async function getStaticPaths() {
const modules = import.meta.glob<MDXInstance<ArticleType>>("../../../content/articles/**/*.mdx", { eager: true });
@ -23,6 +24,6 @@ export async function getStaticPaths() {
const { Content, frontmatter } = Astro.props as MDXInstance<ArticleType>;
---
<ArticleLayout lang={lang} content={frontmatter}>
<ArticleLayout lang={lang} content={frontmatter} canonicalUrl={canonicalUrl.href}>
<Content />
</ArticleLayout>

View File

@ -10,9 +10,10 @@ const data = getTranslatedArticles(Astro);
const tags = new Set(data.map((article) => article.frontmatter.tags).flat());
const lang = getLanguageFromURL(Astro.url.pathname);
const articles = transformArticles(data);
const canonicalUrl = new URL(Astro.url.pathname, Astro.site);
---
<PageLayout lang={lang} title={t("pageTitle.articles")} description={t("pageDescription.articles")}>
<PageLayout lang={lang} title={t("pageTitle.articles")} description={t("pageDescription.articles")} canonicalUrl={canonicalUrl.href}>
<section>
<ArticlesList
client:load

View File

@ -11,9 +11,10 @@ const data = getTranslatedArticles(Astro);
const t = useTranslation(Astro);
const lang = getLanguageFromURL(Astro.url.pathname);
const articles = utils.transformArticles(data);
const canonicalUrl = new URL(Astro.url.pathname, Astro.site);
---
<PageLayout lang={lang} description={t("site.description")} showPageHeading={false}>
<PageLayout lang={lang} description={t("site.description")} showPageHeading={false} canonicalUrl={canonicalUrl.href}>
<Splash>
<SplashHeading>
<hgroup>