improve SEO

This commit is contained in:
Cloudburst 2022-12-01 10:04:26 +01:00 committed by GitHub
parent 979285a785
commit 552b209161
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
9 changed files with 300 additions and 63 deletions

View file

@ -3,7 +3,7 @@ import React from "react"
const Button = ({url, children, name}) => (
<span className="tooltip tooltip-bottom before:text-xs before:content-[attr(data-tip)]" data-tip={name}>
<div className="flex-none items-center">
<a className="btn btn-ghost drawer-button btn-square text-xl" href={url || "#!"} target="_blank">
<a className="btn btn-ghost drawer-button btn-square text-xl" href={url || "#!"} target="_blank" aria-label={name}>
{children}
</a>
</div>

278
src/components/seo.jsx Normal file
View file

@ -0,0 +1,278 @@
import bgImage from "../media/phones.webp"
import logo from "../media/icon.svg"
const desc = "Cloudstream is an Android app for streaming and downloading Movies, TV-Series and Anime. On this official cloudstream/recloudstream site you can find downloads links and a list of repositories of extensions."
const SEO = ({children, title, description}) => {
return <>
<title>{title || "Cloudstream"}</title>
<meta property="og:title" content={title || "Cloudstream"} />
<meta property="og:description" content={description || desc} />
<meta property="og:image" content={bgImage} />
<meta property="og:image:type" content="image/png" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="google-site-verification" content="c7TphrPJk4AXlG4P_J3ZRpJ7V3yFzG_cjd-A37ih1fE" />
<script type="application/ld+json">{```
[
{
"@id": "https://cloudstream.cf/#person",
"@type": [
"http://schema.org/Person",
"http://schema.org/Organization"
],
"http://schema.org/image": [
{
"@id": "https://cloudstream.cf/#logo",
"@type": [
"http://schema.org/ImageObject"
],
"http://schema.org/caption": [
{
"@value": "Cloudstream"
}
],
"http://schema.org/contentUrl": [
{
"@id": "${logo}"
}
],
"http://schema.org/inLanguage": [
{
"@value": "en-US"
}
],
"http://schema.org/url": [
{
"@id": "${logo}"
}
]
}
],
"http://schema.org/logo": [
{
"@id": "https://cloudstream.cf/#logo",
"@type": [
"http://schema.org/ImageObject"
],
"http://schema.org/caption": [
{
"@value": "cloudstream"
}
],
"http://schema.org/contentUrl": [
{
"@id": "${logo}"
}
],
"http://schema.org/inLanguage": [
{
"@value": "en-US"
}
],
"http://schema.org/url": [
{
"@id": "${logo}"
}
]
}
],
"http://schema.org/name": [
{
"@value": "cloudstream"
}
]
},
{
"@id": "https://cloudstream.cf/#website",
"@type": [
"http://schema.org/WebSite"
],
"http://schema.org/inLanguage": [
{
"@value": "en-US"
}
],
"http://schema.org/name": [
{
"@value": "Cloudstream"
}
],
"http://schema.org/potentialAction": [
{
"@type": [
"http://schema.org/SearchAction"
],
"http://schema.org/query-input": [
{
"@value": "required name=search_term_string"
}
],
"http://schema.org/target": [
{
"@id": "https://cloudstream.cf/?s={search_term_string}"
}
]
}
],
"http://schema.org/publisher": [
{
"@id": "https://cloudstream.cf/#person"
}
],
"http://schema.org/url": [
{
"@id": "https://cloudstream.cf"
}
]
},
{
"@id": "https://cloudstream.cf/#webpage",
"@type": [
"http://schema.org/WebPage"
],
"http://schema.org/about": [
{
"@id": "https://cloudstream.cf/#person"
}
],
"http://schema.org/dateModified": [
{
"@type": "http://schema.org/Date",
"@value": "2022-11-22T13:32:21+00:00"
}
],
"http://schema.org/datePublished": [
{
"@type": "http://schema.org/Date",
"@value": "2020-02-24T13:08:57+00:00"
}
],
"http://schema.org/inLanguage": [
{
"@value": "en-US"
}
],
"http://schema.org/isPartOf": [
{
"@id": "https://cloudstream.cf/#website"
}
],
"http://schema.org/name": [
{
"@value": "CloudStream"
}
],
"http://schema.org/url": [
{
"@id": "https://cloudstream.cf/"
}
]
},
{
"@id": "https://cloudstream.cf/author/cloudstream/",
"@type": [
"http://schema.org/Person"
],
"http://schema.org/image": [
{
"@id": "https://github.com/recloudstream.png",
"@type": [
"http://schema.org/ImageObject"
],
"http://schema.org/caption": [
{
"@value": "cloudstream"
}
],
"http://schema.org/inLanguage": [
{
"@value": "en-US"
}
],
"http://schema.org/url": [
{
"@id": "https://github.com/recloudstream.png"
}
]
}
],
"http://schema.org/name": [
{
"@value": "cloudstream"
}
],
"http://schema.org/sameAs": [
{
"@id": "http://cloudstream.cf"
}
],
"http://schema.org/url": [
{
"@id": "https://cloudstream.cf/author/cloudstream/"
}
]
},
{
"@id": "https://cloudstream.cf/#richSnippet",
"@type": [
"http://schema.org/Article"
],
"http://schema.org/author": [
{
"@id": "https://cloudstream.cf/author/cloudstream/"
}
],
"http://schema.org/dateModified": [
{
"@type": "http://schema.org/Date",
"@value": "2022-11-22T13:32:21+00:00"
}
],
"http://schema.org/datePublished": [
{
"@type": "http://schema.org/Date",
"@value": "2020-02-24T13:08:57+00:00"
}
],
"http://schema.org/description": [
{
"@value": "${description || desc}"
}
],
"http://schema.org/headline": [
{
"@value": "${description || desc}"
}
],
"http://schema.org/inLanguage": [
{
"@value": "en-US"
}
],
"http://schema.org/isPartOf": [
{
"@id": "https://cloudstream.cf/#webpage"
}
],
"http://schema.org/mainEntityOfPage": [
{
"@id": "https://cloudstream.cf/#webpage"
}
],
"http://schema.org/name": [
{
"@value": "${title}"
}
],
"http://schema.org/publisher": [
{
"@id": "https://cloudstream.cf/#person"
}
]
}
]
```.replace(/\n/g, "")}</script>
</>
}
export default SEO

BIN
src/media/phones.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 31 KiB

View file

@ -2,7 +2,7 @@ import React from "react"
import Layout from "../components/layout"
import Hero from "../components/hero"
import bgImage from "../media/phones.png"
import bgImage from "../media/phones.webp"
import CompatBtn from "../components/compatbtn"
const NotFoundPage = () => {

View file

@ -2,7 +2,7 @@ import { graphql, StaticQuery } from "gatsby"
import React from "react"
import Layout from "../../components/layout"
import DocsCard from "../../components/cards/docs"
import bgImage from "../../media/phones.png"
import SEO from "../../components/seo"
const DocsPage = () => {
@ -50,14 +50,5 @@ export default DocsPage
export function Head() {
return (
<>
<title>Cloudstream Docs</title>
<meta property="og:title" content="Cloudstream Docs" />
<meta property="og:description" content="Cloudstream is an Android app for streaming and downloading Movies, TV-Series and Anime." />
<meta property="og:image" content={bgImage} />
<meta property="og:image:type" content="image/png" />
<meta name="twitter:card" content="summary_large_image" />
</>
)
return <SEO title="Cloudstream Docs" />
}

View file

@ -3,14 +3,19 @@ import React from "react"
import Layout from "../components/layout"
import Hero from "../components/hero"
import CompatBtn from "../components/compatbtn"
import SEO from "../components/seo"
import bgImage from "../media/phones.png"
import bgImage from "../media/phones.webp"
const IndexPage = () => {
return <Layout>
<Hero bg={bgImage}>
<h1 className="mb-5 text-5xl font-bold">Hello there</h1>
<p className="mb-5 text-lg">Cloudstream is an Android app for streaming and downloading Movies, TV-Series and Anime.</p>
<p className="mb-5 text-lg">
Cloudstream is an Android app for streaming and downloading Movies, TV-Series and Anime.
<div className="divider divider-horizontal" />
On this official cloudstream/recloudstream site you can find downloads links and a list of repositories of extensions.
</p>
<div className="flex justify-center w-full mb-5">
<CompatBtn autoFocus={true} className="btn-primary" href="/install">Install</CompatBtn>
<div className="divider divider-horizontal" />
@ -26,15 +31,5 @@ export default IndexPage
export function Head() {
return (
<>
<title>Cloudstream</title>
<meta property="og:title" content="Cloudstream" />
<meta property="og:description" content="Cloudstream is an Android app for streaming and downloading Movies, TV-Series and Anime." />
<meta property="og:image" content={bgImage} />
<meta property="og:image:type" content="image/png" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="google-site-verification" content="c7TphrPJk4AXlG4P_J3ZRpJ7V3yFzG_cjd-A37ih1fE" />
</>
)
return <SEO />
}

View file

@ -3,8 +3,9 @@ import React, { useEffect, useState } from "react"
import Layout from "../components/layout"
import Hero from "../components/hero"
import CompatBtn from "../components/compatbtn"
import SEO from "../components/seo"
import bgImage from "../media/phones.png"
import bgImage from "../media/phones.webp"
const InstallPage = () => {
const [data, setData] = useState(null)
@ -78,16 +79,7 @@ const InstallPage = () => {
}
export function Head() {
return (
<>
<title>Cloudstream installation</title>
<meta property="og:title" content="Cloudstream" />
<meta property="og:description" content="Cloudstream is an Android app for streaming and downloading Movies, TV-Series and Anime." />
<meta property="og:image" content={bgImage} />
<meta property="og:image:type" content="image/png" />
<meta name="twitter:card" content="summary_large_image" />
</>
)
return <SEO title="Cloudstream installation" />
}
export default InstallPage

View file

@ -3,7 +3,7 @@ import React, {useEffect, useState} from "react"
import Layout from "../components/layout"
import RepoCard from "../components/cards/repo"
import AdbConnect from "../components/adbconnect"
import bgImage from "../media/phones.png"
import SEO from "../components/seo"
import { TiWarning } from "react-icons/ti";
import { BiErrorAlt } from "react-icons/bi";
@ -12,7 +12,7 @@ import { IconContext } from "react-icons";
import "./repos.css";
const IndexPage = () => {
const ReposPage = () => {
const [repos, setRepos] = useState(null);
const [hadError, setHadError] = useState(false);
@ -84,16 +84,7 @@ const IndexPage = () => {
}
export function Head() {
return (
<>
<title>Cloudstream Repositories</title>
<meta property="og:title" content="Cloudstream Repositories" />
<meta property="og:description" content="Cloudstream is an Android app for streaming and downloading Movies, TV-Series and Anime." />
<meta property="og:image" content={bgImage} />
<meta property="og:image:type" content="image/png" />
<meta name="twitter:card" content="summary_large_image" />
</>
)
return <SEO title="Cloudstream Repositories" />
}
export default IndexPage
export default ReposPage

View file

@ -1,7 +1,7 @@
import React from "react"
import { Link, graphql } from "gatsby"
import Layout from "../components/layout"
import bgImage from "../media/phones.png"
import SEO from "../components/seo"
import DocsCard from "../components/cards/docs"
import { node2slug } from "../utils";
@ -94,17 +94,7 @@ export default function PageTemplate({ data: { markdownRemark, allMarkdownRemark
}
export function Head({ data }) {
return (
<>
<title>{data.markdownRemark.frontmatter.title}</title>
<meta property="og:title" content={data.markdownRemark.frontmatter.title} />
<meta property="og:description" content={data.markdownRemark.excerpt} />
<meta property="og:image" content={bgImage} />
<meta property="og:image:type" content="image/png" />
<meta name="twitter:card" content="summary_large_image" />
</>
)
return <SEO title={data.markdownRemark.frontmatter.title} description={data.markdownRemark.excerpt} />
}
export const pageQuery = graphql`