diff --git a/themes/starter/components/Banner.js b/themes/starter/components/Banner.js index 220633ce..ab89d43c 100644 --- a/themes/starter/components/Banner.js +++ b/themes/starter/components/Banner.js @@ -35,7 +35,7 @@ export const Banner = ({ title, description }) => {
  • / diff --git a/themes/starter/components/Blog.js b/themes/starter/components/Blog.js index 7eb1fe9d..be245d17 100644 --- a/themes/starter/components/Blog.js +++ b/themes/starter/components/Blog.js @@ -2,11 +2,12 @@ import { siteConfig } from '@/lib/config' import CONFIG from '../config' -export const Blog = (props) => { - const count = siteConfig('STARTER_BLOG_COUNT', 3, CONFIG) - const posts = props?.allNavPages - ? props.allNavPages.slice(0, count) - : [] +/** + * 博文列表 + * @param {*} param0 + * @returns + */ +export const Blog = ({ posts }) => { return <> {/* */}
    diff --git a/themes/starter/components/Contact.js b/themes/starter/components/Contact.js index 1837d8ce..84fba5d2 100644 --- a/themes/starter/components/Contact.js +++ b/themes/starter/components/Contact.js @@ -73,73 +73,11 @@ export const Contact = () => { className="wow fadeInUp rounded-lg bg-white px-8 py-10 shadow-testimonial dark:bg-dark-2 dark:shadow-none sm:px-10 sm:py-12 md:p-[60px] lg:p-10 lg:px-10 lg:py-12 2xl:p-[60px]" data-wow-delay=".2s" > -

    - {siteConfig('STARTER_CONTACT_MSG_TITLE', null, CONFIG)} -

    -
    -
    - - -
    -
    - - -
    -
    - - -
    -
    - - -
    -
    - -
    -
    + {/* 自定义的留言表单 、 需要对接接口 */} + {/* */} + {/* 嵌入外部表单 */} + + diff --git a/themes/starter/components/Logo.js b/themes/starter/components/Logo.js index 56d8268f..b6afeae1 100644 --- a/themes/starter/components/Logo.js +++ b/themes/starter/components/Logo.js @@ -23,7 +23,9 @@ export const Logo = ({ white }) => { const navBarScrollListener = throttle(() => { const scrollY = window.scrollY; // 何时显示浅色或白底的logo - if (white || isDarkMode || (!isDarkMode && router.route === '/' && scrollY < 1)) { + const homePageNavBar = router.route === '/' && scrollY < 10 // 在首页并且视窗在页面顶部 + console.log('白色', homePageNavBar, router.route, scrollY < 10) + if (white || isDarkMode || homePageNavBar) { setLogo(siteConfig('STARTER_LOGO_WHITE', null, CONFIG)) setLogoTextColor('text-white') } else { @@ -37,7 +39,7 @@ export const Logo = ({ white }) => { return () => { window.removeEventListener('scroll', navBarScrollListener) } - }, []) + }, [isDarkMode, router]) return
    diff --git a/themes/starter/components/MessageForm.js b/themes/starter/components/MessageForm.js new file mode 100644 index 00000000..25bce6eb --- /dev/null +++ b/themes/starter/components/MessageForm.js @@ -0,0 +1,132 @@ +import { siteConfig } from '@/lib/config' +import CONFIG from '../config' +import { useRef, useState } from 'react' + +/** + * 留言表单 + * @returns + */ +export const MessageForm = () => { + const formRef = useRef() + const [success] = useState(false) + const [formData, setFormData] = useState({ + fullName: '', + email: '', + phone: '', + message: '' + }) + + const handleChange = (e) => { + const { name, value } = e.target + setFormData(prevState => ({ + ...prevState, + [name]: value + })) + } + + // useEffect(() => { + // const form = formRef.current + // const handleSubmit = (e) => { + // e.preventDefault() + // submitComments(formData).then(response => { + // console.log('Subscription succeeded:', response) + // // 在此处添加成功订阅后的操作 + // setSuccess(true) + // }) + // .catch(error => { + // console.error('Subscription failed:', error) + // // 在此处添加订阅失败后的操作 + // }) + // } + // form?.addEventListener('submit', handleSubmit) + // return () => { + // form?.removeEventListener('submit', handleSubmit) + // } + // }, [submitComments]) + + return <> +

    + {siteConfig('STARTER_CONTACT_MSG_TITLE', null, CONFIG)} +

    +
    +
    + + +
    +
    + + +
    +
    + + +
    +
    + + +
    +
    + + {/* Success message */} + {success &&

    {siteConfig('STARTER_CONTACT_MSG_THANKS', null, CONFIG)}

    } + +
    +
    + +} diff --git a/themes/starter/components/NavBar.js b/themes/starter/components/NavBar.js index 603313a5..2d4fda41 100644 --- a/themes/starter/components/NavBar.js +++ b/themes/starter/components/NavBar.js @@ -17,17 +17,17 @@ export const NavBar = (props) => { const { isDarkMode } = useGlobal() const [buttonTextColor, setColor] = useState(router.route === '/' ? 'text-white' : '') useEffect(() => { - if (isDarkMode) { + if (isDarkMode || router.route === '/') { setColor('text-white') } else { - setColor(router.route === '/' ? 'text-white' : '') + setColor('') } // ======= Sticky window.addEventListener('scroll', navBarScollListener) return () => { window.removeEventListener('scroll', navBarScollListener) } - }, [isDarkMode]) + }, [[isDarkMode]]) // 滚动监听 const throttleMs = 200 diff --git a/themes/starter/components/SignInForm.js b/themes/starter/components/SignInForm.js index 88781171..1b7024c3 100644 --- a/themes/starter/components/SignInForm.js +++ b/themes/starter/components/SignInForm.js @@ -22,7 +22,7 @@ export const SignInForm = () => { className="wow fadeInUp relative mx-auto max-w-[525px] overflow-hidden rounded-lg bg-white dark:bg-dark-2 py-14 px-8 text-center sm:px-12 md:px-[60px]" data-wow-delay=".15s">
    -
    +
    @@ -51,25 +51,25 @@ export const SignInForm = () => { {/* 社交平台 */}     - + Forget Password?

    diff --git a/themes/starter/components/SignUpForm.js b/themes/starter/components/SignUpForm.js index eb26e6aa..f6f36553 100644 --- a/themes/starter/components/SignUpForm.js +++ b/themes/starter/components/SignUpForm.js @@ -15,7 +15,7 @@ export const SignUpForm = () => { className="wow fadeInUp relative mx-auto max-w-[525px] overflow-hidden rounded-xl shadow-form bg-white dark:bg-dark-2 py-14 px-8 text-center sm:px-12 md:px-[60px]" data-wow-delay=".15s">

    @@ -43,7 +43,7 @@ export const SignUpForm = () => {
    • - {
    • - {
    • - {

      By creating an account you are agree with our - + Privacy and - + Policy

      diff --git a/themes/starter/config.js b/themes/starter/config.js index 407517c4..e175a401 100644 --- a/themes/starter/config.js +++ b/themes/starter/config.js @@ -10,8 +10,8 @@ const CONFIG = { // MENU ， 菜单部分不在此处配置，请在Notion数据库中添加MENU // 英雄区块导航 - STARTER_HERO_TITLE_1: '开源且免费的基于 Notion 笔记的网站构建工具。', // 英雄区文字 - STARTER_HERO_TITLE_2: '使用您喜爱的技术（Tailwind 和 React NextJS）构建各种网站主题模板。 ', // 英雄区文字 + STARTER_HERO_TITLE_1: '开源且免费的基于 Notion 笔记的网站构建工具', // 英雄区文字 + STARTER_HERO_TITLE_2: '通过笔记无感知地建站、成倍放大您的价值', // 英雄区文字 STARTER_HERO_TITLE_3: '使用最新技术构建', // 英雄区文字 STARTER_HERO_BUTTON_1_TEXT: 'Start Now', // 英雄区按钮 STARTER_HERO_BUTTON_1_URL: 'https://docs.tangly1024.com/article/vercel-deploy-notion-next', // 英雄区按钮 @@ -29,7 +29,7 @@ const CONFIG = { // 特性区块 STARTER_FEATURE_TITLE: '特性', // 特性 STARTER_FEATURE_TEXT_1: 'NotionNext的主要特性', // 特性 - STARTER_FEATURE_TEXT_2: 'NotionNext的愿景是帮助非技术人员的小白，最低成本、最快速地搭建自己的网站。 ', // 特性 + STARTER_FEATURE_TEXT_2: 'NotionNext的愿景是帮助您简单、无感知地稳定地搭建自己的网站，放大品牌的价值。 ', // 特性 STARTER_FEATURE_1_TITLE_1: '免费且开源', // 特性1 STARTER_FEATURE_1_TEXT_1: '项目源码在Github上完全开放共享，遵循MIT协议', // 特性1 @@ -65,7 +65,7 @@ const CONFIG = { // 首页价格区块 STARTER_PRICING_TITLE: '价格表', STARTER_PRICING_TEXT_1: '很棒的定价计划', - STARTER_PRICING_TEXT_2: '我们制定了灵活的付费模式，您可以按需选择。（NotionNext完全免费，这里仅做主题功能演示。请勿下单！请勿购买！）', + STARTER_PRICING_TEXT_2: '我们制定了灵活的付费模式，您可以按需选择。（NotionNext免费开源，这里仅演示产品订阅付费功能，请勿下单购买！）', STARTER_PRICING_1_TITLE: '入门版', STARTER_PRICING_1_PRICE: '19.9', @@ -96,8 +96,8 @@ const CONFIG = { STARTER_PRICING_3_BUTTON_URL: 'https://tangly1024.lemonsqueezy.com/checkout/buy/df924d66-09dc-42a4-a632-a6b0c5cc4f28', STARTER_TESTIMONIALS_TITLE: '用户反馈', - STARTER_TESTIMONIALS_TEXT_1: '我们的站长怎么说', - STARTER_TESTIMONIALS_TEXT_2: '有数千位站长使用NotionNext搭建他们的网站,通过帮助手册、交流社群以及技术咨询，站友们成功上线了自己的网站并且持续运行', + STARTER_TESTIMONIALS_TEXT_1: '我们的用户怎么说', + STARTER_TESTIMONIALS_TEXT_2: '数千位站长选择用NotionNext搭建他们的网站,通过帮助手册、交流社群以及技术咨询，大家成功上线了自己的网站', STARTER_TESTIMONIALS_STAR_ICON: '/images/starter/testimonials/icon-star.svg', // 评分图标 // 这里不支持CONFIG和环境变量，需要一一修改此处代码。 @@ -205,12 +205,16 @@ const CONFIG = { STARTER_CONTACT_EMAIL_TITLE: '我们如何帮助您？', STARTER_CONTACT_EMAIL_TEXT: 'mail@tangly1024.com', - STARTER_CONTACT_MSG_TITLE: '向我们留言', - STARTER_CONTACT_MSG_NAME: '姓名', - STARTER_CONTACT_MSG_EMAIL: '邮箱地址', - STARTER_CONTACT_MSG_PHONE: '联系电话', - STARTER_CONTACT_MSG_TEXT: '消息内容', - STARTER_CONTACT_MSG_SEND: '发送消息', + // 嵌入外部表单 + STARTER_CONTACT_MSG_EXTERNAL_URL: 'https://noteforms.com/forms/yfctc7', // 基于NoteForm创建，将留言数据存在Notion中 + // 自定义留言表单 + // STARTER_CONTACT_MSG_TITLE: '向我们留言', + // STARTER_CONTACT_MSG_NAME: '姓名', + // STARTER_CONTACT_MSG_EMAIL: '邮箱地址', + // STARTER_CONTACT_MSG_PHONE: '联系电话', + // STARTER_CONTACT_MSG_TEXT: '消息内容', + // STARTER_CONTACT_MSG_SEND: '发送消息', + // STARTER_CONTACT_MSG_THANKS: '感谢您的留言', // 合作伙伴的图标 STARTER_BRANDS: [ @@ -288,6 +292,11 @@ const CONFIG = { STARTER_FOOTER_PRIVACY_TERMS_OF_SERVICE_TEXT: '服务协议', STARTER_FOOTER_PRIVACY_TERMS_OF_SERVICE_URL: '/terms-of-use', + // 404页面的提示语 + STARTER_404_TITLE: '我们似乎找不到您要找的页面。', + STARTER_404_TEXT: '抱歉！您要查找的页面不存在。可能已经移动或删除。', + STARTER_404_BACK: '回到主页', + STARTER_NEWSLETTER: process.env.NEXT_PUBLIC_THEME_STARTER_NEWSLETTER || false // 是否开启邮件订阅 请先配置mailchimp功能 https://docs.tangly1024.com/article/notion-next-mailchimp } export default CONFIG diff --git a/themes/starter/index.js b/themes/starter/index.js index aa95a5c9..bb8e7f6a 100644 --- a/themes/starter/index.js +++ b/themes/starter/index.js @@ -35,6 +35,7 @@ import { SVG404 } from './components/svg/SVG404' import { Banner } from './components/Banner' import { SignInForm } from './components/SignInForm' import { SignUpForm } from './components/SignUpForm' +import Link from 'next/link' /** * 一些外部js @@ -84,6 +85,10 @@ const LayoutBase = (props) => { * @returns */ const LayoutIndex = (props) => { + const count = siteConfig('STARTER_BLOG_COUNT', 3, CONFIG) + const posts = props?.allNavPages + ? props.allNavPages.slice(0, count) + : [] return ( <> {/* 英雄区 */} @@ -101,7 +106,7 @@ const LayoutIndex = (props) => { {/* 团队介绍 */} {/* 博文列表 */} - + {/* 联系方式 */} {/* 合作伙伴 */} @@ -140,7 +145,22 @@ const LayoutSlug = (props) => { } const LayoutSearch = (props) => <> -const LayoutArchive = (props) => <> + +/** + * 文章归档 + * @param {*} props + * @returns + */ +const LayoutArchive = (props) => <> + {/* 博文列表 */} + + + +/** + * 404页面 + * @param {*} props + * @returns + */ const Layout404 = (props) => { return <> {/* */} @@ -162,17 +182,17 @@ const Layout404 = (props) => {

    - We Can't Seem to Find The Page You're Looking For. + {siteConfig('STARTER_404_TITLE', null, CONFIG)}

    - Oops! The page you are looking for does not exist. It might have - been moved or deleted. + {siteConfig('STARTER_404_TEXT', null, CONFIG)} +

    - - Go To Home - + {siteConfig('STARTER_404_BACK', null, CONFIG)} +
    @@ -195,6 +215,7 @@ const LayoutTagIndex = (props) => <> const LayoutSignIn = (props) => { return <>
    +
    @@ -207,6 +228,7 @@ const LayoutSignIn = (props) => { */ const LayoutSignUp = (props) => <>
    +