You are viewing a plain text version of this content. The canonical link for it is here.
Posted to notifications@apisix.apache.org by ju...@apache.org on 2022/06/04 09:47:34 UTC

[apisix-website] 01/01: feat: adjust some keywords

This is an automated email from the ASF dual-hosted git repository.

juzhiyuan pushed a commit to branch feat/keywords
in repository https://gitbox.apache.org/repos/asf/apisix-website.git

commit af4ff2b867508f54ccafdfc50820144e661bfc06
Author: 琚致远 <ju...@juzhiyuandeMBP.lan>
AuthorDate: Sat Jun 4 17:47:12 2022 +0800

    feat: adjust some keywords
---
 website/docusaurus.config.js                     | 21 +++++++++++++++------
 website/src/components/sections/Architecture.tsx |  8 ++++----
 website/src/components/sections/Benefits.tsx     | 20 ++++++++++----------
 website/src/components/sections/Features.tsx     | 24 ++++++++++++------------
 website/src/components/sections/HeroSection.tsx  | 17 ++++++++---------
 website/src/pages/help.tsx                       |  4 ++--
 website/src/pages/index.tsx                      | 19 +++++++++++++++++++
 website/src/pages/plugins.tsx                    |  2 +-
 8 files changed, 71 insertions(+), 44 deletions(-)

diff --git a/website/docusaurus.config.js b/website/docusaurus.config.js
index f4dc6c750c0..54a394e7f3e 100644
--- a/website/docusaurus.config.js
+++ b/website/docusaurus.config.js
@@ -19,7 +19,7 @@ module.exports = {
   favicon: 'img/favicon.png',
   customFields: {
     tagline2:
-      'Apache APISIX software provides rich traffic management features such as load balancing, dynamic upstream, canary release, circuit breaking, authentication, observability, and more.',
+      'Apache APISIX provides rich traffic management features such as load balancing, dynamic upstream, canary release, circuit breaking, authentication, observability, and more.',
     showcases: require('./static/data/showcases.json'),
     events: require('./static/data/events.json'),
     eventPosterCard: require('./static/data/event-poster-card.json'),
@@ -359,16 +359,19 @@ module.exports = {
           title: 'Community',
           items: [
             {
-              label: 'GitHub Issue Tracker',
+              label: 'GitHub',
               to: 'https://github.com/apache/apisix/issues',
             },
             {
               label: 'Slack',
-              to: 'https://apisix.apache.org/docs/general/join',
+              to: '/docs/general/join',
             },
             {
               label: 'Twitter',
               to: 'https://twitter.com/ApacheAPISIX',
+            }, {
+              label: 'YouTube',
+              to: 'https://www.youtube.com/channel/UCgPD18cMhOg5rmPVnQhAC8g',
             },
           ],
         },
@@ -377,7 +380,13 @@ module.exports = {
           items: [
             {
               label: 'Blog',
-              to: 'https://apisix.apache.org/blog/',
+              to: '/blog/',
+            }, {
+              label: 'Showcase',
+              to: '/showcase',
+            }, {
+              label: 'Plugin Hub',
+              to: '/plugins',
             },
           ],
         },
@@ -396,7 +405,7 @@ module.exports = {
       backgroundColor: '#e8433e',
       textColor: 'white',
       content:
-        '\u{1F914} Have queries regarding apache APISIX, Join slack channel to discuss them <a target="_blank" rel="noopener noreferrer" href="https://apisix.apache.org/docs/general/join">join #apisix channel</a>! ⭐️',
+        '\u{1F914} Have queries regarding API Gateway? Join Slack channel to discuss <a target="_blank" rel="noopener noreferrer" href="/docs/general/join">join #apisix channel</a>! ⭐️',
     },
     prism: {
       theme: require('prism-react-renderer/themes/github'),
@@ -419,7 +428,7 @@ module.exports = {
       {
         name: 'description',
         content:
-          'Apache APISIX is a dynamic, real-time, high-performance Cloud-Native API gateway, based on the Nginx library and etcd.',
+          'Open Source and Cloud-Native API gateway, based on the Nginx library and etcd.',
       },
       {
         name: 'robots',
diff --git a/website/src/components/sections/Architecture.tsx b/website/src/components/sections/Architecture.tsx
index a7d56c16286..42ff25673e6 100644
--- a/website/src/components/sections/Architecture.tsx
+++ b/website/src/components/sections/Architecture.tsx
@@ -84,9 +84,9 @@ const Architecture: FC<ArchitectureProps> = (props) => {
       <div className="arch-subtitle">
         <p>
           <Translate id="architecture.component.title.subtitle">
-            Apache APISIX lets you build Cloud-Native Microservices API gateways,
+            Apache APISIX provides open source API Gateway to help you manage microservices,
             delivering the ultimate performance, security,
-            open source and scalable platform for all your APIs and microservices.
+            and scalable platform for all your APIs and microservices.
           </Translate>
         </p>
       </div>
@@ -98,8 +98,8 @@ const Architecture: FC<ArchitectureProps> = (props) => {
           <p style={{ width: screenWidth >= 768 ? '50%' : '90%' }}>
             <Translate id="architecture.component.card.caption">
               Apache APISIX is based on NGINX and etcd.
-              Compared with traditional API gateways,
-              APISIX has dynamic routing and hot-loading plugins
+              Compared with traditional API Gateways,
+              APISIX has features like dynamic routing and hot-loading plugins, etc.
             </Translate>
           </p>
         </div>
diff --git a/website/src/components/sections/Benefits.tsx b/website/src/components/sections/Benefits.tsx
index a2e3d5a0525..a9ca9a43ea4 100644
--- a/website/src/components/sections/Benefits.tsx
+++ b/website/src/components/sections/Benefits.tsx
@@ -332,9 +332,9 @@ const Benefits: FC<BenefitsProps> = (props) => {
           <h3 className="feat-head-desc">
             <Translate id="benefits.component.performance.title">Performance</Translate>
           </h3>
-          <h1 className="feat-head add-left-margin">
+          <h2 className="feat-head add-left-margin">
             <Translate id="benefits.component.performance.subtitle">Ultimate performance</Translate>
-          </h1>
+          </h2>
           <p className="feat-desc add-left-margin">
             <Translate id="benefits.component.performance.message">
               Apache APISIX uses radixtree-route-matching and etcd under the hood to
@@ -359,11 +359,11 @@ const Benefits: FC<BenefitsProps> = (props) => {
               Security
             </Translate>
           </h3>
-          <h1 className="feat-head add-left-margin">
+          <h2 className="feat-head add-left-margin">
             <Translate id="benefits.component.security.subtitle">
               Shield against the malicious
             </Translate>
-          </h1>
+          </h2>
           <p className="feat-desc add-left-margin">
             <Translate id="benefits.component.security.message">
               Apache APISIX provides multiple security plugins
@@ -388,11 +388,11 @@ const Benefits: FC<BenefitsProps> = (props) => {
               Scalability and availability
             </Translate>
           </h3>
-          <h1 className="feat-head add-left-margin">
+          <h2 className="feat-head add-left-margin">
             <Translate id="benefits.component.scalability.subtitle">
               Scales with your users
             </Translate>
-          </h1>
+          </h2>
           <p className="feat-desc add-left-margin">
             <Translate id="benefits.component.scalability.message">
               Apache APISIX provides the ability to write your own custom plugins,
@@ -416,11 +416,11 @@ const Benefits: FC<BenefitsProps> = (props) => {
               Fully dynamic
             </Translate>
           </h3>
-          <h1 className="feat-head add-left-margin">
+          <h2 className="feat-head add-left-margin">
             <Translate id="benefits.component.fullyDynamic.subtitle">
               Save dev-time, design what matters
             </Translate>
-          </h1>
+          </h2>
           <p className="feat-desc add-left-margin">
             <Translate id="benefits.component.fullyDynamic.message">
               Apache APISIX provides Hot updates and Hot plugins,
@@ -439,11 +439,11 @@ const Benefits: FC<BenefitsProps> = (props) => {
               Multi-platform and protocol
             </Translate>
           </h3>
-          <h1 className="feat-head add-left-margin">
+          <h2 className="feat-head add-left-margin">
             <Translate id="benefits.component.multiPlatform.subtitle">
               Create once, run anywhere
             </Translate>
-          </h1>
+          </h2>
           <p className="feat-desc add-left-margin">
             <Translate id="benefits.component.multiPlatform.message">
               Platform agnostic, no vendor lock-in,
diff --git a/website/src/components/sections/Features.tsx b/website/src/components/sections/Features.tsx
index 1f8409eba8d..e66bb24a48c 100644
--- a/website/src/components/sections/Features.tsx
+++ b/website/src/components/sections/Features.tsx
@@ -155,17 +155,17 @@ const Features: FC = () => {
   return (
     <>
       <div ref={featPin} className="feat-top" style={{ padding: '50px 0' }}>
-        <h3 className="feat-head-desc"><Translate id="features.component.why.title">Why APISIX ?</Translate></h3>
-        <h1 className="feat-head add-left-margin">
+        <h3 className="feat-head-desc"><Translate id="features.component.why.title">Why APISIX?</Translate></h3>
+        <h2 className="feat-head add-left-margin">
           <Translate id="features.component.why.subtitle">
-            Reduce time fighting bugs, focus on designing world-class systems
+            Reduce time fighting bugs, focus on designing world-class systems with API Gateway
           </Translate>
-        </h1>
+        </h2>
         <p className="feat-desc add-left-margin">
           <Translate id="features.component.why.message">
-            Apache APISIX is the first Open source API gateway, with a built-in
-            low-code Dashboard offering a powerful and flexible interface for
-            developers to use
+            Apache APISIX is the first open-source API Gateway
+            that includes a built-in low-code Dashboard,
+            which offers a powerful and flexible UI for developers to use.
           </Translate>
         </p>
       </div>
@@ -176,7 +176,7 @@ const Features: FC = () => {
             <div className="text-div" style={{ height: '100vh' }}>
               <h2 className="i-text add-left-margin-feat">
                 <Translate id="features.component.easyDashboard.title">
-                  Easy-to-use dashboard
+                  Easy-to-use Dashboard
                 </Translate>
               </h2>
               <p className="i-text-desc add-left-margin-feat">
@@ -200,7 +200,7 @@ const Features: FC = () => {
           <div ref={userfDiv} style={{ position: 'relative' }}>
             <div className="text-div" style={{ height: '100vh' }}>
               <h2 className="i-text add-left-margin-feat">
-                <Translate id="features.component.userFlexible.title">User flexible</Translate>
+                <Translate id="features.component.userFlexible.title">User Flexible</Translate>
               </h2>
               <p className="i-text-desc add-left-margin-feat">
                 <Translate id="features.component.userFlexible.message">
@@ -215,7 +215,7 @@ const Features: FC = () => {
           <div ref={pluginDiv} style={{ position: 'relative' }}>
             <div className="text-div" style={{ height: '100vh' }}>
               <h2 className="i-text add-left-margin-feat">
-                <Translate id="features.component.pluginised.title">Pluginised workflow</Translate>
+                <Translate id="features.component.pluginised.title">Pluginised Workflow</Translate>
               </h2>
               <p className="i-text-desc add-left-margin-feat">
                 <Translate id="features.component.pluginised.message">
@@ -309,7 +309,7 @@ const Features: FC = () => {
           style={{ height: 'fit-content', padding: '20px 0' }}
         >
           <h2 className="add-left-margin" style={{ width: 'fit-content' }}>
-            <Translate id="features.component.userFlexible.title">User flexible</Translate>
+            <Translate id="features.component.userFlexible.title">User Flexible</Translate>
           </h2>
           <img className="i-image-col" src={Snippet} alt="" />
           <p className="i-text-desc-col add-left-margin">
@@ -327,7 +327,7 @@ const Features: FC = () => {
           style={{ height: 'fit-content', padding: '20px 0' }}
         >
           <h2 className="add-left-margin" style={{ width: 'fit-content' }}>
-            <Translate id="features.component.pluginised.title">Pluginised workflow</Translate>
+            <Translate id="features.component.pluginised.title">Pluginised Workflow</Translate>
           </h2>
           <img className="i-image-col" src={Plugin} alt="" />
           <p className="i-text-desc-col add-left-margin">
diff --git a/website/src/components/sections/HeroSection.tsx b/website/src/components/sections/HeroSection.tsx
index fe70da75a15..46e1387efab 100644
--- a/website/src/components/sections/HeroSection.tsx
+++ b/website/src/components/sections/HeroSection.tsx
@@ -41,18 +41,17 @@ const HeroSection: FC = () => {
   return (
     <div className="hero-sec-wrap" style={{ width: '100%' }}>
       <div className="hero-text">
-        <h2 ref={titleRef} className="hero-title hide-title">
-          <span><Translate id="hero.component.title.fragment1">Effortless and smooth</Translate></span>
+        <h1 ref={titleRef} className="hero-title hide-title">
+          <span><Translate id="hero.component.title.fragment1">Full Lifecycle API Management</Translate></span>
           {' '}
-          <span style={{ color: '#E8433E' }}>
-            <Translate id="hero.component.title.fragment2">API Traffic</Translate>
+          <br />
+          <span style={{ color: '#E8433E', fontSize: 32 }}>
+            <Translate id="hero.component.title.fragment2">API Gateway, Ingress Controller, etc.</Translate>
           </span>
-          {' '}
-          <Translate id="hero.component.title.fragment3">management.</Translate>
+        </h1>
+        <h2 ref={subtitleRef} className="hero-subtitle hide-subtitle">
+          <Translate id="hero.component.subtitle.content">Apache APISIX provides rich traffic management features like Load Balancing, Dynamic Upstream, Canary Release, Circuit Breaking, Authentication, Observability, etc.</Translate>
         </h2>
-        <h3 ref={subtitleRef} className="hero-subtitle hide-subtitle">
-          <Translate id="hero.component.subtitle.content">Apache APISIX provides rich traffic management features like Load Balancing, Dynamic Upstream, Canary Release, Circuit Breaking, Authentication, Observability, and more...</Translate>
-        </h3>
         <div ref={ctaRef} className="hero-ctas hide-ctas">
           <Link
             to={useBaseUrl('downloads')}
diff --git a/website/src/pages/help.tsx b/website/src/pages/help.tsx
index a02a77a8c18..746460db96d 100644
--- a/website/src/pages/help.tsx
+++ b/website/src/pages/help.tsx
@@ -48,7 +48,7 @@ const Help: FC = () => (
           <p><Translate id="help.website.docs.tips">Learn more using the documentation on this site.</Translate></p>
           <div className="buttons">
             <a
-              href="https://apisix.apache.org/docs/"
+              href="/docs/"
               target="_blank"
               rel="noreferrer"
             >
@@ -71,7 +71,7 @@ const Help: FC = () => (
               <ChevronRight />
             </a>
             <a
-              href="https://apisix.apache.org/docs/general/join"
+              href="/docs/general/join"
               target="_blank"
               rel="noreferrer"
             >
diff --git a/website/src/pages/index.tsx b/website/src/pages/index.tsx
index e4054a948ec..9299b1ce2d0 100644
--- a/website/src/pages/index.tsx
+++ b/website/src/pages/index.tsx
@@ -2,6 +2,7 @@ import type { FC } from 'react';
 import React, { useState, useEffect, useLayoutEffect } from 'react';
 import useThemeContext from '@theme/hooks/useThemeContext';
 import Layout from '@theme/Layout';
+import Head from '@docusaurus/Head';
 import useWindowType from '@theme/hooks/useWindowSize';
 
 import HeroSection from '../components/sections/HeroSection';
@@ -61,6 +62,24 @@ const Index: FC = () => {
 
   return (
     <Layout>
+      <Head>
+        <meta
+          name="twitter:title"
+          content="Apache APISIX® - Cloud-Native API Gateway"
+        />
+        <meta
+          name="twitter:description"
+          content="Apache APISIX is a dynamic, real-time, high-performance Cloud-Native API gateway, based on the Nginx library and etcd."
+        />
+        <meta
+          name="twitter:site"
+          content="@apacheapisix"
+        />
+        <meta
+          name="og:description"
+          content="Apache APISIX is a dynamic, real-time, high-performance Cloud-Native API gateway, based on the Nginx library and etcd."
+        />
+      </Head>
       <HeroSection />
       <Architecture screenWidth={screenWidth} />
       <Features />
diff --git a/website/src/pages/plugins.tsx b/website/src/pages/plugins.tsx
index 1d86ad8e3a1..04f735e4437 100644
--- a/website/src/pages/plugins.tsx
+++ b/website/src/pages/plugins.tsx
@@ -214,7 +214,7 @@ const Plugins: FC = () => {
       }
       return (
         <div key={plugin.name}>
-          <PluginCard href={plugin.beta ? `https://apisix.apache.org/docs/apisix/next/plugins/${pluginUrl}` : `https://apisix.apache.org/docs/apisix/plugins/${pluginUrl}`} target="_blank">
+          <PluginCard href={plugin.beta ? `/docs/apisix/next/plugins/${pluginUrl}` : `/docs/apisix/plugins/${pluginUrl}`} target="_blank">
             <PluginIcon>
               {plugin.useDefaultIcon
                 ? <img className="plugin-logo shadow default" src="/img/plugin/default-icon.png" alt={plugin.name} />