Skip to content

Commit 7fe8d43

Browse files
D4mianWayneD4mianWayne
committed
Added dynamic OG Generation via vercel
1 parent 01a7525 commit 7fe8d43

File tree

5 files changed

+67
-61
lines changed

5 files changed

+67
-61
lines changed

‎generate-og-image.js‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
// Quick script to generate OG image from HTML template
2+
// Run with: node generate-og-image.js
3+
4+
const fs = require('fs');
5+
const path = require('path');
6+
7+
console.log('To generate your OG image:');
8+
console.log('1. Open og-image-template.html in Chrome');
9+
console.log('2. Press F12 to open DevTools');
10+
console.log('3. Click the device toolbar icon (or press Ctrl+Shift+M)');
11+
console.log('4. Set dimensions to: 1200 x 630');
12+
console.log('5. Right-click the page > "Capture screenshot"');
13+
console.log('6. Save as: public/og-image.png');
14+
console.log('\nDone! Your OG image will be ready.');

‎og-image-template.html‎

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>PwnFuzz Labs OG Image</title>
6+
<style>
7+
body {
8+
margin: 0;
9+
padding: 0;
10+
width: 1200px;
11+
height: 630px;
12+
display: flex;
13+
flex-direction: column;
14+
align-items: center;
15+
justify-content: center;
16+
background: #1a1b26;
17+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
18+
position: relative;
19+
}
20+
21+
.main-title {
22+
font-size: 96px;
23+
font-weight: 800;
24+
color: #c0caf5;
25+
margin: 0;
26+
letter-spacing: -2px;
27+
}
28+
29+
.subtitle {
30+
font-size: 32px;
31+
color: #a9b1d6;
32+
margin-top: 20px;
33+
font-weight: 400;
34+
}
35+
36+
.branding {
37+
position: absolute;
38+
bottom: 50px;
39+
right: 60px;
40+
font-size: 28px;
41+
font-weight: 600;
42+
color: #ff9e64;
43+
}
44+
</style>
45+
</head>
46+
<body>
47+
<h1 class="main-title">PwnFuzz Labs</h1>
48+
<p class="subtitle">Security Research & Vulnerability Analysis</p>
49+
<div class="branding">labs.pwnfuzz.com</div>
50+
</body>
51+
</html>

‎public/og-image.png‎

-487 KB
Loading

‎src/components/BaseHead.astro‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,10 +16,10 @@ const canonicalURL = new URL(Astro.url.pathname, Astro.site);
1616
1717
const { title, description, image } = Astro.props;
1818
19-
// Generate dynamic OG image URL with title as parameter, or use provided image
19+
// Use static OG image from public folder, or provided image
2020
const ogImageUrl = image
2121
? new URL(image.src, Astro.url)
22-
: new URL(`/og/image.png?title=${encodeURIComponent(title)}`, Astro.url);
22+
: new URL('/og-image.png', Astro.url);
2323
---
2424

2525
<!-- Global Metadata -->

‎src/pages/og/[...route].ts‎

Lines changed: 0 additions & 59 deletions
This file was deleted.

0 commit comments

Comments
 (0)