Skip to content

Commit 1c62b9c

Browse files
fezcodefezcode
committed
fix: seo
1 parent 279901b commit 1c62b9c

File tree

6 files changed

+139
-66
lines changed

6 files changed

+139
-66
lines changed

‎src/pages/DokumentBlogPostPage.js‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ import { calculateReadingTime } from '../utils/readingTime';
2020
import MarkdownLink from '../components/MarkdownLink';
2121
import ImageModal from '../components/ImageModal';
2222
import CodeModal from '../components/CodeModal';
23+
import useSeo from '../hooks/useSeo';
2324
import { useToast } from '../hooks/useToast';
2425
import { fetchAllBlogPosts } from '../utils/dataUtils';
2526

@@ -98,6 +99,27 @@ const DokumentBlogPostPage = () => {
9899
const [modalLanguage, setModalLanguage] = useState('jsx');
99100
const { addToast } = useToast();
100101

102+
useSeo({
103+
title: post ? `${post.attributes.title} | Fezcodex` : 'Loading... | Fezcodex',
104+
description: post ? post.body.substring(0, 150) : '',
105+
keywords: post && post.attributes.tags ? post.attributes.tags.join(', ') : '',
106+
ogTitle: post ? `${post.attributes.title} | Fezcodex` : 'Fezcodex',
107+
ogDescription: post ? post.body.substring(0, 150) : '',
108+
ogImage: post
109+
? post.attributes.ogImage ||
110+
post.attributes.image ||
111+
'/images/asset/ogtitle.png'
112+
: '/images/asset/ogtitle.png',
113+
twitterCard: 'summary_large_image',
114+
twitterTitle: post ? `${post.attributes.title} | Fezcodex` : 'Fezcodex',
115+
twitterDescription: post ? post.body.substring(0, 150) : '',
116+
twitterImage: post
117+
? post.attributes.ogImage ||
118+
post.attributes.image ||
119+
'/images/asset/ogtitle.png'
120+
: '/images/asset/ogtitle.png',
121+
});
122+
101123
useEffect(() => {
102124
const fetchPost = async () => {
103125
setLoading(true);

‎src/pages/DossierBlogPostPage.js‎

Lines changed: 26 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import {
1313
import GrainOverlay from '../components/GrainOverlay';
1414
import CoffeeStain from '../components/CoffeeStain';
1515
import CensoredPolaroid from '../components/CensoredPolaroid';
16-
import Seo from '../components/Seo';
16+
import useSeo from '../hooks/useSeo';
1717
import { calculateReadingTime } from '../utils/readingTime';
1818
import { useAchievements } from '../context/AchievementContext';
1919
import MarkdownLink from '../components/MarkdownLink';
@@ -103,6 +103,27 @@ const DossierBlogPostPage = () => {
103103
const [modalLanguage, setModalLanguage] = useState('jsx');
104104
const [modalImageSrc, setModalImageSrc] = useState(null);
105105

106+
useSeo({
107+
title: post ? `${post.attributes.title} | Fezcodex Archive` : 'Loading... | Fezcodex Archive',
108+
description: post ? post.body.substring(0, 150) : '',
109+
keywords: post && post.attributes.tags ? post.attributes.tags.join(', ') : '',
110+
ogTitle: post ? `${post.attributes.title} | Fezcodex` : 'Fezcodex',
111+
ogDescription: post ? post.body.substring(0, 150) : '',
112+
ogImage: post
113+
? post.attributes.ogImage ||
114+
post.attributes.image ||
115+
'/images/asset/ogtitle.png'
116+
: '/images/asset/ogtitle.png',
117+
twitterCard: 'summary_large_image',
118+
twitterTitle: post ? `${post.attributes.title} | Fezcodex` : 'Fezcodex',
119+
twitterDescription: post ? post.body.substring(0, 150) : '',
120+
twitterImage: post
121+
? post.attributes.ogImage ||
122+
post.attributes.image ||
123+
'/images/asset/ogtitle.png'
124+
: '/images/asset/ogtitle.png',
125+
});
126+
106127
useEffect(() => {
107128
setHasTrackedRead(false);
108129
}, [currentSlug]);
@@ -334,18 +355,11 @@ const DossierBlogPostPage = () => {
334355
const prevPost = post.seriesPosts?.[currentPostIndex + 1];
335356
const nextPost = post.seriesPosts?.[currentPostIndex - 1];
336357

337-
return (
338-
<div className="min-h-screen bg-[#f3f3f3] text-[#111] overflow-y-auto selection:bg-black selection:text-white custom-scrollbar font-sans relative">
339-
<Seo
340-
title={`${post.attributes.title} | Fezcodex Archive`}
341-
description={post.body.substring(0, 150)}
342-
keywords={post.attributes.tags ? post.attributes.tags.join(', ') : ''}
343-
ogTitle={`${post.attributes.title} | Fezcodex`}
344-
ogDescription={post.body.substring(0, 150)}
345-
ogImage={post.attributes.image || '/images/asset/ogtitle.png'}
346-
/>
358+
return (
359+
360+
<div className="min-h-screen bg-[#f3f3f3] text-[#111] overflow-y-auto selection:bg-black selection:text-white custom-scrollbar font-sans relative">
347361

348-
<GrainOverlay />
362+
<GrainOverlay />
349363
<CoffeeStain />
350364

351365
{/* Top Secret Stamp / Decor */}

‎src/pages/OldBlogPostPage.js‎

Lines changed: 25 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import PostMetadata from '../components/metadata-cards/PostMetadata';
1212
import CodeModal from '../components/CodeModal';
1313
import { useToast } from '../hooks/useToast';
1414
import ImageModal from '../components/ImageModal';
15-
import Seo from '../components/Seo';
15+
import useSeo from '../hooks/useSeo';
1616
import ShareButtons from '../components/ShareButtons';
1717
import remarkGfm from 'remark-gfm';
1818
import rehypeRaw from 'rehype-raw';
@@ -41,6 +41,27 @@ const OldBlogPostPage = () => {
4141
const [hasTrackedRead, setHasTrackedRead] = useState(false);
4242
const { addToast } = useToast();
4343

44+
useSeo({
45+
title: post ? `${post.attributes.title.toUpperCase()} | TERMINAL LOG` : 'LOADING... | TERMINAL LOG',
46+
description: post ? post.body.substring(0, 150) : '',
47+
keywords: post && post.attributes.tags ? post.attributes.tags.join(', ') : '',
48+
ogTitle: post ? `${post.attributes.title.toUpperCase()} | TERMINAL LOG` : 'TERMINAL LOG',
49+
ogDescription: post ? post.body.substring(0, 150) : '',
50+
ogImage: post
51+
? post.attributes.ogImage ||
52+
post.attributes.image ||
53+
'/images/asset/ogtitle.png'
54+
: '/images/asset/ogtitle.png',
55+
twitterCard: 'summary_large_image',
56+
twitterTitle: post ? `${post.attributes.title.toUpperCase()} | TERMINAL LOG` : 'TERMINAL LOG',
57+
twitterDescription: post ? post.body.substring(0, 150) : '',
58+
twitterImage: post
59+
? post.attributes.ogImage ||
60+
post.attributes.image ||
61+
'/images/asset/ogtitle.png'
62+
: '/images/asset/ogtitle.png',
63+
});
64+
4465
// --- Effects ---
4566

4667
useEffect(() => {
@@ -296,18 +317,9 @@ const OldBlogPostPage = () => {
296317

297318
return (
298319
<div className="min-h-screen bg-[#020617] pb-24 relative">
299-
<Seo
300-
title={`${post.attributes.title} | Fezcodex`}
301-
description={post.body.substring(0, 150)}
302-
keywords={post.attributes.tags ? post.attributes.tags.join(', ') : ''}
303-
ogTitle={`${post.attributes.title} | Fezcodex`}
304-
ogDescription={post.body.substring(0, 150)}
305-
ogImage={post.attributes.image || '/images/asset/ogtitle.png'}
306-
twitterCard="summary_large_image"
307-
twitterTitle={`${post.attributes.title} | Fezcodex`}
308-
twitterDescription={post.body.substring(0, 150)}
309-
twitterImage={post.attributes.image || '/images/asset/ogtitle.png'}
310-
/>
320+
<style>{`
321+
body { background-color: black; }
322+
`}</style>
311323

312324
<div className="absolute inset-0 overflow-hidden pointer-events-none">
313325
<div className="absolute top-0 left-0 w-full h-[400px] bg-gradient-to-b from-gray-900 to-[#020617] -z-10 border-b border-gray-800/50">

‎src/pages/StandardBlogPostPage.js‎

Lines changed: 22 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter';
1414
import { customTheme } from '../utils/customTheme';
1515
import ImageModal from '../components/ImageModal';
1616
import CodeModal from '../components/CodeModal';
17-
import Seo from '../components/Seo';
17+
import useSeo from '../hooks/useSeo';
1818
import GenerativeArt from '../components/GenerativeArt';
1919
import remarkGfm from 'remark-gfm';
2020
import rehypeRaw from 'rehype-raw';
@@ -40,6 +40,27 @@ const StandardBlogPostPage = () => {
4040
const [modalLanguage, setModalLanguage] = useState('jsx');
4141
const { addToast } = useToast();
4242

43+
useSeo({
44+
title: post ? `${post.attributes.title} | Fezcodex` : 'Loading... | Fezcodex',
45+
description: post ? post.body.substring(0, 150) : '',
46+
keywords: post && post.attributes.tags ? post.attributes.tags.join(', ') : '',
47+
ogTitle: post ? `${post.attributes.title} | Fezcodex` : 'Fezcodex',
48+
ogDescription: post ? post.body.substring(0, 150) : '',
49+
ogImage: post
50+
? post.attributes.ogImage ||
51+
post.attributes.image ||
52+
'/images/asset/ogtitle.png'
53+
: '/images/asset/ogtitle.png',
54+
twitterCard: 'summary_large_image',
55+
twitterTitle: post ? `${post.attributes.title} | Fezcodex` : 'Fezcodex',
56+
twitterDescription: post ? post.body.substring(0, 150) : '',
57+
twitterImage: post
58+
? post.attributes.ogImage ||
59+
post.attributes.image ||
60+
'/images/asset/ogtitle.png'
61+
: '/images/asset/ogtitle.png',
62+
});
63+
4364
useEffect(() => {
4465
const fetchPost = async () => {
4566
setLoading(true);
@@ -196,12 +217,6 @@ const StandardBlogPostPage = () => {
196217

197218
return (
198219
<div className="min-h-screen bg-[#050505] text-white selection:bg-emerald-500/30 pb-32 relative">
199-
<Seo
200-
title={`${post.attributes.title} | Fezcodex`}
201-
description={post.body.substring(0, 150)}
202-
ogImage={post.attributes.image || '/images/asset/ogtitle.png'}
203-
/>
204-
205220
{/* Reading Progress */}
206221
<div className="fixed top-0 left-0 w-full h-1 z-50 bg-white/5">
207222
<motion.div

‎src/pages/TerminalBlogPostPage.js‎

Lines changed: 22 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import {
99
ArrowsOutSimple,
1010
ClipboardTextIcon,
1111
} from '@phosphor-icons/react';
12-
import Seo from '../components/Seo';
12+
import useSeo from '../hooks/useSeo';
1313
import { useAchievements } from '../context/AchievementContext';
1414
import MarkdownLink from '../components/MarkdownLink';
1515
import CodeModal from '../components/CodeModal';
@@ -99,6 +99,27 @@ const TerminalBlogPostPage = () => {
9999
const [modalLanguage, setModalLanguage] = useState('jsx');
100100
const [modalImageSrc, setModalImageSrc] = useState(null);
101101

102+
useSeo({
103+
title: post ? `${post.attributes.title.toUpperCase()} | TERMINAL LOG` : 'LOADING... | TERMINAL LOG',
104+
description: post ? post.body.substring(0, 150) : '',
105+
keywords: post && post.attributes.tags ? post.attributes.tags.join(', ') : '',
106+
ogTitle: post ? `${post.attributes.title.toUpperCase()} | TERMINAL LOG` : 'TERMINAL LOG',
107+
ogDescription: post ? post.body.substring(0, 150) : '',
108+
ogImage: post
109+
? post.attributes.ogImage ||
110+
post.attributes.image ||
111+
'/images/asset/ogtitle.png'
112+
: '/images/asset/ogtitle.png',
113+
twitterCard: 'summary_large_image',
114+
twitterTitle: post ? `${post.attributes.title.toUpperCase()} | TERMINAL LOG` : 'TERMINAL LOG',
115+
twitterDescription: post ? post.body.substring(0, 150) : '',
116+
twitterImage: post
117+
? post.attributes.ogImage ||
118+
post.attributes.image ||
119+
'/images/asset/ogtitle.png'
120+
: '/images/asset/ogtitle.png',
121+
});
122+
102123
useEffect(() => {
103124
setHasTrackedRead(false);
104125
}, [currentSlug]);
@@ -321,33 +342,7 @@ const TerminalBlogPostPage = () => {
321342
<div className="min-h-screen bg-black text-orange-500 font-mono overflow-y-auto custom-scrollbar-terminal relative">
322343
<style>{`
323344
body { background-color: black; }
324-
.shadow-orange-glow { box-shadow: 0 0 10px rgba(251, 146, 60, 0.7); }
325-
.text-orange-500 { color: #fb923c; } /* Tailwind orange-500 */
326-
.border-orange-500 { border-color: #fb923c; }
327-
.custom-scrollbar-terminal::-webkit-scrollbar {
328-
width: 8px;
329-
}
330-
.custom-scrollbar-terminal::-webkit-scrollbar-track {
331-
background: #1a1a1a;
332-
}
333-
.custom-scrollbar-terminal::-webkit-scrollbar-thumb {
334-
background-color: #fb923c;
335-
border-radius: 4px;
336-
border: 1px solid #9a3412;
337-
}
338345
`}</style>
339-
<Seo
340-
title={`${post.attributes.title.toUpperCase()} | TERMINAL LOG`}
341-
description={post.body.substring(0, 150)}
342-
keywords={post.attributes.tags ? post.attributes.tags.join(', ') : ''}
343-
ogTitle={`${post.attributes.title.toUpperCase()} | TERMINAL LOG`}
344-
ogDescription={post.body.substring(0, 150)}
345-
ogImage={post.attributes.image || '/images/asset/ogtitle.png'}
346-
twitterCard="summary_large_image"
347-
twitterTitle={`${post.attributes.title.toUpperCase()} | TERMINAL LOG`}
348-
twitterDescription={post.body.substring(0, 150)}
349-
twitterImage={post.attributes.image || '/images/asset/ogtitle.png'}
350-
/>
351346

352347
{/* Optional Scanline Effect Overlay */}
353348
<div

‎src/pages/TerminalGreenBlogPostPage.js‎

Lines changed: 22 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import remarkGfm from 'remark-gfm';
55
import rehypeRaw from 'rehype-raw';
66
import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter';
77
import { ArrowLeft, ArrowsOutSimple } from '@phosphor-icons/react';
8-
import Seo from '../components/Seo';
8+
import useSeo from '../hooks/useSeo';
99
import GenerativeArt from '../components/GenerativeArt';
1010
import MarkdownLink from '../components/MarkdownLink';
1111
import CodeModal from '../components/CodeModal';
@@ -44,6 +44,27 @@ const TerminalGreenBlogPostPage = () => {
4444
const [modalContent, setModalContent] = useState('');
4545
const [modalLanguage, setModalLanguage] = useState('jsx');
4646

47+
useSeo({
48+
title: post ? `${post.attributes.title.toUpperCase()} | TERM` : 'LOADING... | TERM',
49+
description: post ? post.body.substring(0, 150) : '',
50+
keywords: post && post.attributes.tags ? post.attributes.tags.join(', ') : '',
51+
ogTitle: post ? `${post.attributes.title.toUpperCase()} | TERM` : 'TERM',
52+
ogDescription: post ? post.body.substring(0, 150) : '',
53+
ogImage: post
54+
? post.attributes.ogImage ||
55+
post.attributes.image ||
56+
'/images/asset/ogtitle.png'
57+
: '/images/asset/ogtitle.png',
58+
twitterCard: 'summary_large_image',
59+
twitterTitle: post ? `${post.attributes.title.toUpperCase()} | TERM` : 'TERM',
60+
twitterDescription: post ? post.body.substring(0, 150) : '',
61+
twitterImage: post
62+
? post.attributes.ogImage ||
63+
post.attributes.image ||
64+
'/images/asset/ogtitle.png'
65+
: '/images/asset/ogtitle.png',
66+
});
67+
4768
useEffect(() => {
4869
const fetchPost = async () => {
4970
setLoading(true);
@@ -170,12 +191,6 @@ const TerminalGreenBlogPostPage = () => {
170191
.custom-scrollbar-terminal::-webkit-scrollbar-thumb { background: #10b981; }
171192
`}</style>
172193

173-
<Seo
174-
title={`${post.attributes.title.toUpperCase()} | TERM`}
175-
description={post.body.substring(0, 150)}
176-
ogImage={post.attributes.image || '/images/asset/ogtitle.png'}
177-
/>
178-
179194
<div
180195
className="fixed inset-0 pointer-events-none z-50 opacity-[0.03]"
181196
style={{

0 commit comments

Comments
 (0)