企业公司网站用AI快速低成本搭建教程（2025）
你好，我是有风，在这个视频里，我会一步一步教你如何用Hostinger的网站建设工具来做自己的网站。我会把每个步骤都详细讲解，保证不漏掉任何细节，到最后，你就能做出一个既漂亮又专业的网站。
►Hostinger 搭建网站 购买域名主机
➜https://bit.ly/3BysRqP
►向有风咨询，加入我的知识星球圈子：
➜https://t.zsxq.com/16QP9JP8b
►本期视频所有文字信息
➜https://aiyoufeng.com/business-website-design
►Shopify 搭建跨境电商网站
➜https://bit.ly/3Xq89AJ
►申请Stripe收款账号教程
https://www.youtube.com/watch?v=B_kCNiQ3Icw&t=3s
一些用好的工具：
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
►阿里云.中国网站服务器租用
➜https://bit.ly/3V1GiGY
►Semrush 网站数据分析
➜https://bit.ly/4azZtNQ
第一步：注册Hostinger账户
进入注册页面后，点击“开始使用”，然后选择适合你的套餐。
- 推荐套餐：
- 商务计划：功能强大，支持电商功能。
- 高级计划：适合预算有限、只需简单网站的用户。
完成套餐选择后，填写账单信息，选择付款方式并提交付款。Hostinger提供30天无条件退款保障，让你可以放心尝试。
第二步：创建网站
付款完成后，选择“创建一个网站”，进入建站流程。
1. 选择建站工具
Hostinger会推荐他们的建站工具，我们选择这个工具并点击“下一步”。
2. 设置域名
可以先使用临时域名，待网站完成后再绑定自定义域名。具体绑定步骤将在教程末尾讲解。
3. 描述网站类型
输入网站类型后，Hostinger会根据需求生成定制模板。选择模板后，你可以根据自己的需求对模板进行调整。
第三步：个性化设置
1. 设置调色板和字体
- 调色板：选择适合品牌风格的颜色。
- 字体：默认字体为Roboto和Lato，可以根据需要更改。
2. 预览和调整
点击右上角的手机图标查看网站在移动设备上的显示效果，确保布局适配。
3. 编辑页面内容
- 主页：修改背景视频、文字和按钮。
- 其他页面：如服务页、推荐页和联系页，根据实际需求进行调整。
- 添加新页面：点击页面和导航，选择模板或创建空白页面。
第四步：添加博客和在线商店
1. 博客功能
- 点击“博客”并添加新文章。
- 使用Hostinger AI快速生成博文或手动编辑内容。
- 发布博文时，确保填写标题、描述、分类和特色图片。
2. 在线商店
- 添加商店页面并上传产品信息。
- 设置支付方式（推荐PayPal和Stripe）。
- 配置物流和运费规则。
第五步：优化SEO
1. 基本设置
- 上传Favicon，设置链接预览图片。
2. 页面优化
- 使用Hostinger AI生成SEO标题和元描述。
- 确保URL简洁明了。
第六步：连接自定义域名
- 点击“连接域名”并输入你的域名。
- 按提示完成域名注册与绑定。
第七步：设置商务电子邮件
- 在网站管理器中选择“设置免费电子邮件服务”。
- 输入你的域名并设置邮箱地址。
- 使用Webmail或推荐的邮箱客户端（如Gmail）访问邮箱。
最后一步：发布网站
点击右上角的“上线”按钮，正式发布你的网站。你可以随时预览并修改内容，确保网站持续优化。
恭喜你！你的新网站已经上线！
进入这个页面后，点击“开始使用”，然后我们就可以选择套餐了。我建议选择商务计划，因为它性能最强，还可以使用电商功能。不过，如果你预算有限，也可以选择高级计划，适合做简单的网站。
好的，接下来我们继续操作，输入一下账单地址后点击“继续”。然后选择付款方式，填好付款信息，点击“提交付款”。需要注意的是，Hostinger 提供 30 天无条件退款保障，也就是说如果你在 30 天内取消服务，可以全额退款，不用问原因。
接下来，我会选择“创建一个网站”，这样可以从零开始创建一个全新的站点。然后，我们选择 Hostinger 的建站工具，点击“下一步”。到这里，我们可以为网站选择一个域名，域名其实就是网站的网址。
不过，我建议先建好网站，再准备好发布时再绑定自己的域名。现在我们先点击下方的“使用临时域名”，最后在教程的结尾，我会教你如何绑定自定义域名。现在，我们终于可以开始搭建网站了。
我们只需要描述一下想要创建的网站类型，Hostinger 会根据我们的需求生成一个定制的模板。然后，我们就可以用这个模板，按自己的需求进行修改和调整了。
GPT提示2：
我们是一家AI驱动金融软件公司，最近推出了一款AI工具叫做Youfeng，这个工具可以帮助企业进行Ai财务管理，帮我写一个网站描述。
如果你有喜欢的字体，记得把它们填到描述里面。如果你不知道该怎么写好的描述，直接用ChatGPT就行，我刚才就是这么做的。然后在“个性化设置”这里，我们还可以选择一个颜色调色板，或者如果你已经有品牌颜色的话，也可以直接使用。
我现在就设置成“惊喜一下”，看看网站会长什么样。接下来点击“创建网站”，我们就能看到网站的初步预览了。这里面所有的文字、图片，甚至网站的结构，都是根据我们之前提供的内容自动生成的。
重新生成几次试下。
你还可以点击右上角的手机图标，查看你的网站目前在手机上的样子，然后滚动页面查看当前的样子。如果你对当前的设计不满意，可以点击这里返回 AI 表单，然后进行调整。你可以修改网站描述，也可以进入个性化设置，选择特定的调色板。
这就是我要做的。我要去选择调色板，使用这里的颜色，然后点击 “再次创建网站”。有时，创建几个不同的网站模板，找到最适合自己的才是最好的。
现在，我们有了一个不同的模板，主页顶部有背景视频，配色也不同。对初稿满意后，点击右上角的 “编辑网站”。在这里，我们可以开始手动定制网站。
目前，我们的网站有四个页面。我们有主页，也就是我们现在看到的这个。然后是服务页面、推荐页面和联系页面。
对于你的网站来说，这些页面可能会有所不同，因为这确实取决于你正在建设什么样的网站。例如，如果你在为一家餐馆建网站，那么添加一个预订页面或菜单页面可能是有意义的。不过，网站上的每个页面都有一个或多个部分。
因此，在我的主页上，我们可以看到第一部分就在顶部，有视频背景，然后我们可以看到下面的第二部分。将鼠标悬停在这些部分上时，它们都会有一个蓝色的轮廓。再向下滚动，就能看到下一个部分。
在这些部分中，我们有不同的元素，基本上构成了网站的内容。因此，我们有文字元素、图片，还有像这里这样的按钮。现在，要更改网站上的任何文本，只需点击文本元素，然后点击编辑文本，然后像这样编辑文本即可。
按钮的操作方法也完全相同。只需点击它，然后点击编辑按钮，就可以在这里更改文字。你还可以为按钮添加链接。
让我们把按钮链接到联系页面。现在，要移动网站上的任何元素，只需单击要移动的元素，按住不放，然后拖动到你想移动的地方即可。要替换网站上的任何图片，只需点击图片，点击编辑图片，然后在这里替换图片。
然后你就可以上传任何你想添加的图片。点击选择。现在图片已被替换。
现在，要在网站上添加新元素，只需点击左侧的加号图标。这将显示你可以添加到网站上的所有元素。例如，我们来添加一个按钮。
只需单击 “按住”，然后将按钮元素拖到页面上。然后关闭这里的元素窗口。为了给按钮腾出一些空间，我们需要把这里的部分放大一些。
因此，让我们像这样向下拖动。现在我们有空间放置按钮了。按住不放，拖到我们想要的位置。
然后点击 “编辑 ”按钮，修改文字并将其链接到页面。现在，要在页面中添加一个全新的部分，只需将鼠标悬停在要放置新部分的部分下方，然后点击此处的添加部分。现在，我们可以从一个空白的部分开始，或者从这里的模板中选择一个。
例如，让我们选择这个，然后我们就可以像之前一样编辑这个部分了。现在，只要我们想删除页面上的某个特定元素，就可以点击它，然后点击垃圾桶图标。这与删除版块的方法相同。
因此，我们只需点击该部分，然后点击这里的垃圾桶图标即可。如果你弄错了，比如不小心把某个元素移动到了一个奇怪的位置，你可以点击顶部的撤销按钮来撤销最近的更改。现在，每当你对页面进行修改或添加新内容时，例如添加一个按钮，一定要确保同时转到移动视图，就在这里，并确保它在移动设备上看起来也不错。
因此，有时当你添加新内容时，你会发现按钮或添加的任何东西都会出现错位。比如说，我想把这个部分做得更大一些，就像这样。然后，我可能会把这个按钮移到左边。
现在，无论你在这里做什么改动，都不会影响桌面视图。因此，当我们回到桌面视图时，我们可以看到按钮仍然在正确的位置上，而部分的大小也和以前一样。这就是为什么你总是应该先在桌面视图上进行更改，然后再切换到移动视图并进行必要的调整。
现在，如果你有一个特定的部分在移动版上不起作用，你可以做的就是在移动视图上选择它，点击隐藏显示眼睛图标，然后在移动版上禁用它。现在，当人们在手机上访问你的网站时，这个部分将不会显示，在桌面上也是一样。因此，当我们想隐藏桌面视图中的某个特定部分时，可以再次点击眼睛图标，禁用桌面版。
到目前为止，我们只对主页进行了更改，但我们还可以对网站上的所有其他页面进行更改。只需点击导航菜单中的该页面即可。然后，我们就可以以完全相同的方式进行更改。
现在，如果你想在网站上添加一个新页面，你可以来到这里，点击页面和导航，然后点击底部的添加页面，我们既可以从一个新的空页面开始，也可以从这些模板中选择一个。我打算选择这个作为新的 “关于 ”页面。一旦我们选择了新页面，它就会自动添加到主导航菜单中。
我们还可以在这里看到它。我们还可以通过单击、按住并拖动它到新位置来重新排列顺序。现在，如果我们还在制作这个页面，而且网站已经上线，但还不想显示这个页面，我们可以点击这里的齿轮图标，然后将其从导航中隐藏。
现在，这个页面在导航菜单中将不可见。现在，让我们来看看如何自定义网站的页眉和页脚。页眉总是显示在网站顶部。
要编辑页眉，只需点击它，然后点击编辑页眉。在布局下，我们可以选择不同类型的布局。例如，如果你想把徽标放在中间，就选择这里的布局。
实际上，我要用的是原来的布局，也就是这个。我们还可以转到元素，然后显示或隐藏特定元素。如果你想在标题中显示社交媒体图标，可以在这里激活它们。
或者，你也可以添加一个按钮，比如行动号召按钮。然后在徽标下，我们可以将徽标添加到页眉中。点击 “替换图片 ”即可。
然后，我要为这个网站上传我的徽标。让我们选择它。现在，我的徽标就会出现在这里。
我还可以通过向右或向左拖动滑块来改变宽度。然后在样式选项卡中，我们可以更改页眉的设计。例如，我们可以改变背景颜色，或者让页眉透明，或者改变文字字体或页眉文字颜色。
如果这里有一个按钮，我们还可以从标题切换到按钮，更改按钮样式。或者，我们也可以回到社交图标。如果我们激活了社交图标，首先可以在这里输入社交媒体链接。
然后，我们可以在底部更改图标大小。但对于这个网站，我要禁用页眉的社交媒体图标。然后，我们在网站每个页面的底部都有网站页脚。
页脚的工作方式与页面上的任何部分都是一样的。因此，你只需点击任何元素，即可更改文本。你也可以像以前一样移动不同的元素。
你还可以在页脚添加任何元素。现在，如果你在页脚中保留了社交媒体图标，只需确保点击编辑社交图标并在此处链接你的社交媒体配置文件。现在，如果你想自定义网站上的任何特定颜色。
你只需转到网站样式，在颜色下就能看到网站上当前使用的所有颜色。因此，如果出于某种原因，你想更改其中的一种颜色，比如这里的这种，我们只需点击 “更改”，然后选择，就可以在这里进行调整。点击选择后，颜色就会改变。
我们还可以转到字体，在这里可以看到当前使用的字体。现在标题使用的是 Roboto 字体，段落使用的是 Lato 字体。如果我们想更改，只需点击编辑文本样式。
然后我们可以在这里选择另一种字体。但在选择字体时要小心，因为有时更改字体后，一些文本元素会出现错位。因此，如果你在这里更改了字体，请务必检查所有网站页面，确保所有文本元素都对齐了。
现在，让我们回到网站样式，然后点击按钮。在这里，我们可以更改整个网站使用的按钮样式。在动画下，我们可以更改新网站加载到网站后的内容显示方式。
现在，让我们关闭菜单并向上滚动。然后点击联系页面。现在，让我们来看看如何在这里自定义联系表单。
到目前为止，我们只对主页进行了更改，但我们还可以对网站上的所有其他页面进行更改。只需点击导航菜单中的该页面即可。然后，我们就可以以完全相同的方式进行更改。
现在，如果你想在网站上添加一个新页面，你可以来到这里，点击页面和导航，然后点击底部的添加页面，我们既可以从一个新的空页面开始，也可以从这些模板中选择一个。我打算选择这个作为新的 “关于 ”页面。一旦我们选择了新页面，它就会自动添加到主导航菜单中。
我们还可以在这里看到它。我们还可以通过单击、按住并拖动它到新位置来重新排列顺序。现在，如果我们还在制作这个页面，而且网站已经上线，但还不想显示这个页面，我们可以点击这里的齿轮图标，然后将其从导航中隐藏。
现在，这个页面在导航菜单中将不可见。现在，让我们来看看如何自定义网站的页眉和页脚。页眉总是显示在网站顶部。
要编辑页眉，只需点击它，然后点击编辑页眉。在布局下，我们可以选择不同类型的布局。例如，如果你想把徽标放在中间，就选择这里的布局。
实际上，我要用的是原来的布局，也就是这个。我们还可以转到元素，然后显示或隐藏特定元素。如果你想在标题中显示社交媒体图标，可以在这里激活它们。
或者，你也可以添加一个按钮，比如行动号召按钮。然后在徽标下，我们可以将徽标添加到页眉中。点击 “替换图片 ”即可。
然后，我要为这个网站上传我的徽标。让我们选择它。现在，我的徽标就会出现在这里。
我还可以通过向右或向左拖动滑块来改变宽度。然后在样式选项卡中，我们可以更改页眉的设计。例如，我们可以改变背景颜色，或者让页眉透明，或者改变文字字体或页眉文字颜色。
如果这里有一个按钮，我们还可以从标题切换到按钮，更改按钮样式。或者，我们也可以回到社交图标。如果我们激活了社交图标，首先可以在这里输入社交媒体链接。
然后，我们可以在底部更改图标大小。但对于这个网站，我要禁用页眉的社交媒体图标。然后，我们在网站每个页面的底部都有网站页脚。
页脚的工作方式与页面上的任何部分都是一样的。因此，你只需点击任何元素，即可更改文本。你也可以像以前一样移动不同的元素。
你还可以在页脚添加任何元素。现在，如果你在页脚中保留了社交媒体图标，只需确保点击编辑社交图标并在此处链接你的社交媒体配置文件。现在，如果你想自定义网站上的任何特定颜色。
你只需转到网站样式，在颜色下就能看到网站上当前使用的所有颜色。因此，如果出于某种原因，你想更改其中的一种颜色，比如这里的这种，我们只需点击 “更改”，然后选择，就可以在这里进行调整。点击选择后，颜色就会改变。
我们还可以转到字体，在这里可以看到当前使用的字体。现在标题使用的是 Roboto 字体，段落使用的是 Lato 字体。如果我们想更改，只需点击编辑文本样式。
然后我们可以在这里选择另一种字体。但在选择字体时要小心，因为有时更改字体后，一些文本元素会出现错位。因此，如果你在这里更改了字体，请务必检查所有网站页面，确保所有文本元素都对齐了。
现在，让我们回到网站样式，然后点击按钮。在这里，我们可以更改整个网站使用的按钮样式。在动画下，我们可以更改新网站加载到网站后的内容显示方式。
现在，让我们关闭菜单并向上滚动。然后点击联系页面。现在，让我们来看看如何在这里自定义联系表单。
增加博客
GPT提示2：
AI与财务管理的文章
现在，如果你想在网站上添加博客，只需点击三个点，点击博客，然后点击开始博客。现在，这将为你的网站添加一个名为 “博客 ”的新页面，里面已经有了一些范例文章。
要创建新文章，只需点击添加新文章。然后，你可以点击 “跳过”，如果你想自己创建博文，我就自己写，或者使用Hostinger AI为你创建博文。我将使用人工智能快速创建博文。
博文创建完成后，你可以点击标题，然后点击钢笔图标，更改博文标题、描述、URL、作者和发布日期。你还可以安排发布时间。还可以更改特色图片和博文类别。
然后，对于内容，你可以在这里更改图片，和我们之前做的一样。至于内容，你只需点击文本，然后像这样进行修改即可。一旦你的博文准备好发布，你只需点击这里的状态，将其从草稿改为公开即可。
完成后，你就可以回到博客页面了。现在，你的新博文就会显示在你的博客页面上。现在，你还可以添加一个在线商店，在网站上销售产品。
为此，我们要转到购物车图标，然后点击添加商店。这将在网站上添加一个商店页面，并在顶部添加购物车图标。好的。
正如你所看到的，我们已经有了一些样品产品。现在，要添加自己的产品，你需要回到商店图标，然后点击管理商店。要建立自己的商店，首先要选择国家和使用的货币。
然后点击继续。这将带我们进入商店仪表板，在这里我们可以添加第一个产品，开始设置。让我们点击添加产品。
现在，我们可以销售不同类型的产品。例如，实物产品、多种实物产品、数字产品或服务。我要添加的是实物产品。
首先，上传产品图片，然后输入更多产品信息。或者，我们也可以使用人工智能为我们创建一些文本。好了，现在我们有了产品标题、副标题和描述。
下面我们还可以设置价格。目前，价格设置为 30 美元。但假设我们想卖 50 美元。
或者说，我们目前的折扣价是 40 美元。然后，我们可以向下滚动，看看这里的其他选项。但我们还是保持这种方式，点击保存。
现在在 “产品 ”下，我们可以看到我们的新产品。让我们回到仪表板。现在，我们要设置一种付款方式，这样人们就可以在我们的网站上付款了。
因此，让我们点击添加付款。在这里，我们可以看到用于在网站上付款的不同选项。我建议连接贝宝和 Stripe。
Stripe 允许访客使用信用卡或其他选项（如 Google Pay 或 Apple Pay）结账。如果您没有这些选项，也可以选择手动支付，这样游客就可以直接向您的银行账户转账。设置好支付后，让我们再次回到仪表板。
然后点击这里的更新信息。输入公司信息，然后点击保存。最后一步是设置发货。
点击 “测评发货”。在这里，我们可以设置产品的发货区域。例如，我们可以将产品运送到美国。
我将直接输入美国作为发货地区。然后在这里添加美国作为国家。然后点击保存。
现在，我们要查看发货选项。默认情况下，我们有一个普通运费选项，费率设置为免费。如果你想提供免费送货服务，那就没问题。
但如果你想收取运费，就需要更改运费率。因此，在这里点击三个点，我们就可以点击编辑。然后我们就可以收取运费了。
比方说，我们收取 8 美元。然后，我们还可以添加更多运费选项。
如果你想收取快递运费，可以点击添加选项，然后在这里添加运费。现在，让我们回到运费。在这里，我们可以看到刚刚为美国创建的运输区域。
现在，如果你也将产品运送到其他国家，只需点击 “创建区域 ”即可创建一个新的运送区域。然后再进行一次完全相同的操作。只需选择您向哪个国家发货，然后选择向该国家发货的收费标准即可。
很好。现在，让我们点击右上角的 “编辑网站”，回到 Hostinger 网站生成器。现在，在发布新网站之前，我们必须针对谷歌等搜索引擎进行优化，这样才能在搜索结果中找到我们的网站。
要做到这一点，我们首先点击左侧三个点下面的 “常规设置”。点击 Favicon 下的更新，上传我们的 Favicon 图片。这基本上就是你的徽标的正方形版本，将显示在浏览器顶部，你可以在这里看到它的样子。
然后点击保存更改，并添加链接预览图片。点击更新添加图片，然后上传图片。现在，这张图片的最佳尺寸应该是 1200 乘以 630 像素。
点击选择并保存更改。接下来，再次点击三点，然后点击搜索引擎优化设置。在这里，我们要确保浏览所有页面，然后确保有一个搜索引擎优化标题和一个基于此特定页面内容的元描述。
最简单的方法就是点击 “生成新的搜索引擎优化信息”，然后简要说明页面的内容。然后点击 “下一步”，选择与该页面相关的三个主要关键词，点击 “下一步”。现在，hostinger AI 已经为你创建了搜索引擎优化标题和元描述。
这将决定该页面在谷歌搜索结果中的表现。让我们点击 “完成”，然后向下滚动并查看页面URL。你要确保这个 URL 简洁明了。
目前它显示的是 “博客列表”。我要把它改成博客。现在，我们只需浏览网站的所有其他页面，然后做完全相同的事情。
现在，我们已经基本准备好发布网站了。但在此之前，我们要连接我们的自定义品牌域名。为此，让我们点击顶部的 “连接域名”，然后输入要使用的域名。
现在，在我的情况下，.com 域名已经被占用了，所以我要从其他域名中选择一个。我打算用 dot net，但如果可以的话，还是尽量用 dot com 域名。
有了域名后，点击 “下一步”，然后在这里输入您的联系信息，注册新域名。一旦完成，你的域名就会自动连接到你的新网站。让我们回到 Hostinger 网站生成器。
在这里我们可以看到，我们的域名已经连接到了这个网站，这意味着我们终于可以发布这个网站了。为此，我们只需点击右上角的 “上线 ”按钮。恭喜您，您的新网站已经上线。
你的新网站已经上线。我们可以点击 “查看网站”，进入新网站。最后，我要向大家展示的是如何使用新域名设置专业商务电子邮件地址。
让我们回到 Hostinger 网站生成器，然后点击网站生成器和网站管理器。然后点击主菜单，在这里点击电子邮件。然后在 “设置免费电子邮件服务 ”的地方点击 “设置”。
然后选择你的域名，点击 “确认”。我们将从免费计划开始。点击选择，然后选择你的专业电子邮件地址并设置密码。
我将设置为，然后点击创建。然后，我们既可以使用浏览器设置电子邮件，也可以使用推荐的应用程序之一。
我个人建议使用 Gmail。一旦你选择了你的应用，点击移动或桌面，你就会看到使用该应用设置新电子邮件账户所需的说明。不过，我会快速向你演示如何通过浏览器访问。
让我们切换回浏览器，然后点击 Webmail。现在，我们必须输入之前设置的密码，然后点击登录。现在，我们将进入电子邮件收件箱。
相关文章
