fix: add opengraph seo

This commit is contained in:
Derrick Hammer 2023-08-15 05:38:45 -04:00
parent 9152c08f80
commit 45a4a8d712
Signed by: pcfreak30
GPG Key ID: C997C339BE476FF2
2 changed files with 53 additions and 35 deletions

BIN
src/assets/opengraph.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 31 KiB

View File

@ -1,60 +1,78 @@
--- ---
import "../styles/global.scss"; import "../styles/global.scss";
import opengraph from "/src/assets/opengraph.png";
import Navbar from "../components/Layout/Navbar/Navbar.astro"; import Navbar from "../components/Layout/Navbar/Navbar.astro";
import Footer from "../components/Layout/Footer/Footer.astro"; import Footer from "../components/Layout/Footer/Footer.astro";
import JoinCommunity from "../components/Layout/JoinCommunity/JoinCommunity.astro"; import JoinCommunity from "../components/Layout/JoinCommunity/JoinCommunity.astro";
export interface Props { export interface Props {
view: string; view: string;
title: string; title: string;
} }
const { view, title } = Astro.props; const {view, title} = Astro.props;
const description = "A platform, network and experience that allows you to control and own your online web, and access all of the possibilities Web3 has to offer. Join the open web.";
const url = "https://lumeweb.com";
--- ---
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<title>{title}</title> <title>{title}</title>
<meta charset="utf-8" /> <meta charset="utf-8"/>
<meta <meta
name="viewport" name="viewport"
content="width=device-width, initial-scale=1.0, minimum-scale=1.0" content="width=device-width, initial-scale=1.0, minimum-scale=1.0"
/> />
<meta <meta
name="description" name="description"
content="A platform, network and experience that allows you to control and own your online web, and access all of the possibilities Web3 has to offer. Join the open web." content=""
/> />
<meta <meta
name="keywords" name="keywords"
content="Web3 Extension, web3 browser, Lume Web, Web3, dWeb, p2p, handshake, eth, ethereum, ipfs, open web, privacy, decentralization, blockchain" content="Web3 Extension, web3 browser, Lume Web, Web3, dWeb, p2p, handshake, eth, ethereum, ipfs, open web, privacy, decentralization, blockchain"
/> />
<!-- Open Graph / Facebook -->
<meta property="og:type" content="website"/>
<meta property="og:url" content={url}/>
<meta property="og:title" content={title}/>
<meta property="og:description" content={description}/>
<meta property="og:image" content={opengraph.src}/>
<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image"/>
<meta property="twitter:url" content={url}/>
<meta property="twitter:title" content={title}/>
<meta property="twitter:description" content={description}/>
<meta property="twitter:image" content={opengraph.src}/>
<!-- Matomo --> <!-- Matomo -->
<script is:inline> <script is:inline>
var _paq = (window._paq = window._paq || []); var _paq = (window._paq = window._paq || []);
/* tracker methods like "setCustomDimension" should be called before "trackPageView" */ /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
_paq.push(["trackPageView"]); _paq.push(["trackPageView"]);
_paq.push(["enableLinkTracking"]); _paq.push(["enableLinkTracking"]);
(function () { (function () {
var u = "//piwiki.lumeweb.com/"; var u = "//piwiki.lumeweb.com/";
_paq.push(["setTrackerUrl", u + "matomo.php"]); _paq.push(["setTrackerUrl", u + "matomo.php"]);
_paq.push(["setSiteId", "1"]); _paq.push(["setSiteId", "1"]);
var d = document, var d = document,
g = d.createElement("script"), g = d.createElement("script"),
s = d.getElementsByTagName("script")[0]; s = d.getElementsByTagName("script")[0];
g.async = true; g.async = true;
g.src = u + "matomo.js"; g.src = u + "matomo.js";
s.parentNode.insertBefore(g, s); s.parentNode.insertBefore(g, s);
})(); })();
</script> </script>
<!-- End Matomo Code --> <!-- End Matomo Code -->
</head> </head>
<body class="max-w-[1600px] mx-auto"> <body class="max-w-[1600px] mx-auto">
<Navbar view={view} /> <Navbar view={view}/>
<main class={view + " space-y-40 overflow-x-hidden relative "}> <main class={view + " space-y-40 overflow-x-hidden relative "}>
<slot /> <slot/>
</main> </main>
{view !== "home" && <JoinCommunity />} {view !== "home" &&
<Footer /> <JoinCommunity/>}
</body> <Footer/>
</body>
</html> </html>