bubble/devthread.ru
1
0
Fork 0
mirror of https://github.com/sergeyyarkov/devthread.ru.git synced 2026-10-11 10:19:13 +03:00
Code Issues Packages Projects Releases Wiki Activity

amp fixes

Browse Source
This commit is contained in:
Sergey Yarkov 2020-08-17 12:22:28 +03:00
parent 56c3b7d72f
commit 616945a627
7 changed files with 15 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
gatsby-browser.js
View File

@ -31,7 +31,7 @@ export const shouldUpdateScroll = ({ routerProps: { location } }) => {
export const wrapPageElement = ({ element, props }) => { export const wrapPageElement = ({ element, props }) => {
const { location: { pathname } } = props const { location: { pathname } } = props
pathname.includes('/article/amp') ? props.amp = true : props.amp = false pathname.includes('/amp/') ? props.amp = true : props.amp = false
return <Layout {...props}>{element}</Layout> return <Layout {...props}>{element}</Layout>
} }

5
gatsby-config.js
View File

@ -145,11 +145,12 @@ module.exports = {
resolve: `gatsby-plugin-amp`, resolve: `gatsby-plugin-amp`,
options: { options: {
canonicalBaseUrl: 'https://devthread.ru/', canonicalBaseUrl: 'https://devthread.ru/',
components: ['amp-sidebar', 'amp-accordion'], components: ['amp-sidebar', 'amp-accordion', 'amp-form'],
excludedPaths: ['/404*', '/'], excludedPaths: ['/404*', '/'],
pathIdentifier: '/amp/', pathIdentifier: '/amp/',
relAmpHtmlPattern: '{{canonicalBaseUrl}}{{pathname}}{{pathIdentifier}}', relAmpHtmlPattern: '{{canonicalBaseUrl}}{{pathname}}{{pathIdentifier}}',
useAmpClientIdApi: true, relCanonicalPattern: '{{canonicalBaseUrl}}{{pathname}}/',
useAmpClientIdApi: false,
}, },
}, },
{ {

2
gatsby-node.esm.js
View File

@ -55,7 +55,7 @@ exports.createPages = async ({ actions, graphql }) => {
}) })
createPage({ createPage({
path: `article/amp/${node.frontmatter.slug}/`, path: `article/${node.frontmatter.slug}/amp/`,
component: articleTemplateAMP, component: articleTemplateAMP,
context: { context: {
slug: node.frontmatter.slug, slug: node.frontmatter.slug,

2
gatsby-ssr.js
View File

@ -45,7 +45,7 @@ export const onRenderBody = ({ setPreBodyComponents }) => {
export const wrapPageElement = ({ element, props }) => { export const wrapPageElement = ({ element, props }) => {
const { location: { pathname } } = props const { location: { pathname } } = props
pathname.includes('/article/amp') ? props.amp = true : props.amp = false pathname.includes('/amp/') ? props.amp = true : props.amp = false
return <Layout {...props}>{element}</Layout> return <Layout {...props}>{element}</Layout>
} }

9
src/components/SEO/SEO.js
View File

@ -12,7 +12,8 @@ const SEO = ({
image, image,
type, type,
canonical, canonical,
url url,
amp
}) => { }) => {
const { pathname } = useLocation() const { pathname } = useLocation()
const { siteMetadata } = useSiteMetadataQuery() const { siteMetadata } = useSiteMetadataQuery()
@ -49,7 +50,7 @@ const SEO = ({
{seo.description && ( {seo.description && (
<meta property="og:description" content={seo.description} /> <meta property="og:description" content={seo.description} />
)} )}
<link rel="canonical" href={seo.canonical} /> {!amp ? <link rel="canonical" href={seo.canonical} /> : null}
<link <link
rel="apple-touch-icon" rel="apple-touch-icon"
sizes="180x180" sizes="180x180"
@ -70,7 +71,7 @@ const SEO = ({
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#191919" /> <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#191919" />
<meta name="msapplication-TileColor" content="#ffffff" /> <meta name="msapplication-TileColor" content="#ffffff" />
<meta name="theme-color" content="#ffffff" /> <meta name="theme-color" content="#ffffff" />
<script type="application/ld+json"> {!amp ? <script type="application/ld+json">
{JSON.stringify({ {JSON.stringify({
"@context": "http://schema.org", "@context": "http://schema.org",
"@type": "Organization", "@type": "Organization",
@ -78,7 +79,7 @@ const SEO = ({
url: siteMetadata.siteUrl, url: siteMetadata.siteUrl,
sameAs: [siteMetadata.social.twitter], sameAs: [siteMetadata.social.twitter],
})} })}
</script> </script> : null}
</Helmet> </Helmet>
) )
} }

5
src/lib/amp.js
View File

@ -54,6 +54,7 @@ const HeaderAMP = () => {
} }
amp-sidebar .amp-sidebar__social { amp-sidebar .amp-sidebar__social {
display: flex; display: flex;
margin-top: 30px;
} }
amp-sidebar .amp-sidebar__social a { amp-sidebar .amp-sidebar__social a {
font-size: 0; font-size: 0;
@ -80,7 +81,7 @@ const HeaderAMP = () => {
<LogoIcon /> <LogoIcon />
<a href='/'>devthread.ru</a> <a href='/'>devthread.ru</a>
</div> </div>
<button on='tap:sidebar-header' aria-label="menu" className="header-content__button mobile"> <button tabindex="0" on='tap:sidebar-header' aria-label="menu" className="header-content__button mobile">
<span /> <span />
<span /> <span />
<span /> <span />
@ -89,7 +90,7 @@ const HeaderAMP = () => {
</header> </header>
<amp-sidebar id="sidebar-header" layout="nodisplay" side="left"> <amp-sidebar id="sidebar-header" layout="nodisplay" side="left">
<nav> <nav>
<div role='button' on='tap:sidebar-header.toggle' aria-label="menu" className='amp-sidebar__toggleBtn'> <div role='button' tabindex="0" on='tap:sidebar-header.toggle' aria-label="menu" className='amp-sidebar__toggleBtn'>
✕ ✕
</div> </div>
<span>{title}</span> <span>{title}</span>

1
src/templates/article.amp.js
View File

@ -26,6 +26,7 @@ const articleTemplateAmp = ({
type="article" type="article"
url={`${siteUrl}/article/${frontmatter.slug}/`} url={`${siteUrl}/article/${frontmatter.slug}/`}
canonical={`${siteUrl}/article/${frontmatter.slug}/`} canonical={`${siteUrl}/article/${frontmatter.slug}/`}
amp={true}
/> />
<Main> <Main>
<Grid fluid style={{ maxWidth: 800 }}> <Grid fluid style={{ maxWidth: 800 }}>