Skip to content

Added social sharing buttons #1723

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 3 commits into
base: main
Choose a base branch
from
Open

Added social sharing buttons #1723

Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
fa11e81
Update [slug].page.tsx
cbum-dev Jun 18, 2025
25656b1
Merge branch 'json-schema-org:main' into 1311
cbum-dev Jun 30, 2025
8025304
fixed mobile
cbum-dev Jun 30, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
42 changes: 40 additions & 2 deletions pages/blog/posts/[slug].page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,19 +17,31 @@ import Image from 'next/image';
export async function getStaticPaths() {
return getStaticMarkdownPaths('pages/blog/posts');
}
export async function getStaticProps(args: any) {
return getStaticMarkdownProps(args, 'pages/blog/posts');
export async function getStaticProps({ params }: any) {
const staticProps = await getStaticMarkdownProps(
{ params },
'pages/blog/posts',
);
return {
props: {
...staticProps.props,
slug: params.slug,
},
};
}

export default function StaticMarkdownPage({
frontmatter,
content,
slug,
}: {
frontmatter: any;
content: any;
slug: string;
}) {
const date = new Date(frontmatter.date);
const timeToRead = Math.ceil(readingTime(content).minutes);
const blogUrl = `https://json-schema.org/blog/posts/${slug}`;

return (
<SectionContext.Provider value='blog'>
Expand Down Expand Up @@ -116,6 +128,32 @@ export default function StaticMarkdownPage({
style={{ backgroundImage: `url(${frontmatter.cover})` }}
/>
<StyledMarkdown markdown={content} />
<div className='grid grid-cols-1 md:flex flex-wrap justify-center gap-4 mt-12 p-4 border-t border-slate-200 dark:border-slate-600'>
<span className='text-slate-500 text-center'>
Share this article:
</span>

<a
href={`https://x.com/intent/tweet?text=${encodeURIComponent(
'Check out this blog post : ' + frontmatter.title,
)}&url=${encodeURIComponent(blogUrl)}`}
target='_blank'
rel='noopener noreferrer'
className='text-blue-500 text-center font-medium hover:underline'
>
Share on X
</a>
<a
href={`https://www.linkedin.com/shareArticle?mini=true&url=${encodeURIComponent(
blogUrl,
)}&title=${encodeURIComponent(frontmatter.title)}`}
target='_blank'
rel='noopener noreferrer'
className='text-blue-500 text-center font-medium hover:underline'
>
Share on LinkedIn
</a>
</div>
</div>
</div>
</div>
Expand Down