Skip to content

Commit 909bc09

Browse files
ivictborivictbor
committed
feat: update homepage title and description, add meta tags and structured data for SEO
1 parent 5548f69 commit 909bc09

3 files changed

Lines changed: 109 additions & 5 deletions

File tree

‎adminforth/documentation/docs/adminforth_screenshot.png‎

507 KB
Loading

‎adminforth/documentation/docusaurus.config.ts‎

Lines changed: 40 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,8 @@ import type * as Preset from '@docusaurus/preset-classic';
44

55

66
const config: Config = {
7-
title: 'Vue & Node admin panel framework',
8-
tagline: 'Launch robust back-office apps faster with AdminForth’s easy setup and customization',
7+
title: 'Agent-first open-source admin panel framework',
8+
tagline: 'Build robust and powerful agentic back-office panels for your projects while maintaining full control over the code.',
99
favicon: 'img/favicon.png',
1010

1111
// Set the production url of your site here
@@ -41,6 +41,44 @@ const config: Config = {
4141
},
4242
],
4343

44+
headTags: [
45+
{
46+
tagName: 'meta',
47+
attributes: {
48+
name: 'application-name',
49+
content: 'AdminForth',
50+
},
51+
},
52+
{
53+
tagName: 'meta',
54+
attributes: {
55+
name: 'robots',
56+
content: 'index,follow,max-image-preview:large,max-snippet:-1,max-video-preview:-1',
57+
},
58+
},
59+
{
60+
tagName: 'meta',
61+
attributes: {
62+
name: 'googlebot',
63+
content: 'index,follow,max-image-preview:large,max-snippet:-1,max-video-preview:-1',
64+
},
65+
},
66+
{
67+
tagName: 'meta',
68+
attributes: {
69+
name: 'keywords',
70+
content: 'agent-first admin panel framework, open-source admin panel, agentic back office, tailwind admin framework, vue typescript admin panel, internal admin agent',
71+
},
72+
},
73+
{
74+
tagName: 'link',
75+
attributes: {
76+
rel: 'image_src',
77+
href: 'https://adminforth.dev/img/adminforth_screenshot.png',
78+
},
79+
},
80+
],
81+
4482
// Even if you don't use internationalization, you can use this field to set
4583
// useful metadata like html lang. For example, if your site is Chinese, you
4684
// may want to replace "en" with "zh-Hans".

‎adminforth/documentation/src/pages/index.tsx‎

Lines changed: 69 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import clsx from 'clsx';
2+
import Head from '@docusaurus/Head';
23
import Link from '@docusaurus/Link';
34
import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
45
import Layout from '@theme/Layout';
@@ -8,6 +9,19 @@ import styles from './index.module.css';
89

910
const LIVE_DEMO_IFRAME_URL = `https://demo.adminforth.dev/overview?autologin=${encodeURIComponent('demo@adminfoth.dev:demo')}&embedZoom=0.7`;
1011
const YOUTUBE_VIDEO_EMBED_URL = 'https://www.youtube-nocookie.com/embed/4tB8uzY__uk';
12+
const HOME_TITLE = 'Agent-first open-source admin panel framework';
13+
const HOME_DESCRIPTION = 'Build robust and powerful agentic back-office panels for your projects while maintaining full control over the code. AdminForth is a flexible, modern foundation for developer-owned back-end management systems.';
14+
const HOME_SUMMARY = 'You can use AdminForth to build robust and powerful agentic back-office panels for your projects while maintaining full control over the code. It is designed for developers who need a flexible, modern foundation for back-end management systems.';
15+
const SCREENSHOT_PATH = '/img/adminforth_screenshot.png';
16+
const OG_IMAGE_PATH = '/img/og.jpg';
17+
const FEATURE_LIST = [
18+
'Connect to existing Postgres, MySQL, SQLite, or MongoDB data, provide an OpenAI or Anthropic API key, and start using the internal agent in natural language with npx adminforth create-app.',
19+
'Ships assets for coding agents like Claude, Codex, Copilot, and Antigravity, including AGENTS.md, CLAUDE.md, llms.txt, and skills.',
20+
'Always open-source and free.',
21+
'Built with Tailwind CSS and fully extendable with Vue and TypeScript.',
22+
'Premade RFC and OWASP-compatible plugins for TOTP, passkeys, third-party auth providers, and audit logs.',
23+
'Rich component library for custom admin controls and pages.',
24+
];
1125

1226

1327
const images = [
@@ -137,7 +151,7 @@ function HomepageHeader() {
137151
<header className={clsx('hero', styles.heroBanner)}>
138152
<div className="container" >
139153
<Heading as="h1" className={clsx('hero__title', styles.heroBannerTitle)} >
140-
Open-Source Admin Framework with a native Agent
154+
{HOME_TITLE}
141155
</Heading>
142156
<p className="hero__subtitle">{siteConfig.tagline}</p>
143157

@@ -196,11 +210,63 @@ function HomepageHeader() {
196210

197211
export default function Home(): JSX.Element {
198212
const {siteConfig} = useDocusaurusContext();
213+
const siteUrl = siteConfig.url.replace(/\/$/, '');
214+
const screenshotUrl = `${siteUrl}${SCREENSHOT_PATH}`;
215+
const ogImageUrl = `${siteUrl}${OG_IMAGE_PATH}`;
216+
const structuredData = {
217+
'@context': 'https://schema.org',
218+
'@graph': [
219+
{
220+
'@type': 'WebSite',
221+
name: 'AdminForth',
222+
alternateName: HOME_TITLE,
223+
url: `${siteUrl}/`,
224+
description: HOME_SUMMARY,
225+
image: ogImageUrl,
226+
},
227+
{
228+
'@type': 'SoftwareApplication',
229+
name: 'AdminForth',
230+
alternateName: HOME_TITLE,
231+
applicationCategory: 'BusinessApplication',
232+
applicationSubCategory: 'Admin panel framework',
233+
operatingSystem: 'Web browser',
234+
url: `${siteUrl}/`,
235+
image: ogImageUrl,
236+
screenshot: screenshotUrl,
237+
description: HOME_SUMMARY,
238+
isAccessibleForFree: true,
239+
offers: {
240+
'@type': 'Offer',
241+
price: '0',
242+
priceCurrency: 'USD',
243+
},
244+
featureList: FEATURE_LIST,
245+
sameAs: [
246+
'https://github.com/devforth/adminforth',
247+
'https://demo.adminforth.dev/',
248+
],
249+
},
250+
],
251+
};
199252

200253
return (
201254
<Layout
202-
title={`${siteConfig.title}`}
203-
description="OpenSource Tailwind Admin Panel extendable with Vue3 and typescript!">
255+
title={HOME_TITLE}
256+
description={HOME_DESCRIPTION}>
257+
<Head>
258+
<meta property="og:type" content="website" />
259+
<meta property="og:site_name" content="AdminForth" />
260+
<meta property="og:image:alt" content="AdminForth social card" />
261+
<meta name="twitter:title" content={HOME_TITLE} />
262+
<meta name="twitter:description" content={HOME_DESCRIPTION} />
263+
<meta name="twitter:image:alt" content="AdminForth social card" />
264+
<meta name="twitter:label1" content="License" />
265+
<meta name="twitter:data1" content="Open source and free" />
266+
<meta name="twitter:label2" content="Stack" />
267+
<meta name="twitter:data2" content="Tailwind, Vue, TypeScript" />
268+
<script type="application/ld+json">{JSON.stringify(structuredData)}</script>
269+
</Head>
204270
<HomepageHeader />
205271
<main>
206272

0 commit comments

Comments
 (0)