使用开源WordPress和WebStack搭建导航网站
目录
一、前言
二、WordPress和WebStack简介
三、安装与部署
1. 服务器环境搭建LNMP
1.1 购买Linux服务器
1.2 安装Nginx
1.3 安装MariaDB
1.4 安装PHP
2. 安装WordPress
2.1 配置数据库
2.2 下载WordPress源文件
2.3 安装WordPress
3. 安装WebStack主题
四、WebStack的使用方法
1. 配置网站logo
2. 配置左侧导航
3. 配置内容
五、总结
一、前言
近期在学习开源方面的知识，收集了一些资料，打算通过开源的方式回馈给行业。因此搭建了一个导航网站，记录开源行业的相关信息。
网站截图如下：
本文记录了网站搭建的过程，手把手带你搭建起一个导航网站，内容供学习参考。
二、WordPress和WebStack简介
网上有很多开源免费的软件，例如WordPress、MeLog、Hexo、OneBlog等等，这些开源系统都能满足博客的需求。除了满足博客需求以外，还需要提供导航的功能。
因此最终选择了WordPress和WebStack，原因如下：
- WordPress功能强大，安装部署容易，插件生态很庞大；
- 使用PHP脚本语言，修改内容会比较方便；
- WebStack是现成的主题，可以直接安装使用；
WordPress中文官网：适用于博客到大型网站的 CMS (内容管理系统) | WordPress.org China 简体中文
WebStack GitHub：GitHub - WebStackPage/WebStackPage.github.io: ❤️静态响应式网址导航网站 - webstack.cc
三、安装与部署
1. 服务器环境搭建LNMP
1.1 购买Linux服务器
可以选择腾讯云、阿里云、华为云等国内的云厂商，当然如果家里有服务器的话也可以直接使用家里的服务器来搭建。
考虑到网站的功能非常的单一，购买一台最轻量的服务器就可以了。例如2核2G，40元/年；2核4G，74元/年。
最终我在腾讯云上可以购买一台入门级的服务器。
腾讯云网址：腾讯云 - 产业智变 云启未来
购买地址：腾讯云新春大促_腾讯云新春优惠活动-腾讯云
接下来就是安装所需要的软件Nginx、MariaDB、PHP。
MariaDB数据库管理系统是MySQL的一个分支。
1.2 安装Nginx
网络上安装Nginx的文章很多，建议使用腾讯提供的安装方法最简单。
（1）创建nginx.repo文件
vi /etc/yum.repos.d/nginx.repo（2）按 i切换至编辑模式，写入以下内容。
[nginx]
name = nginx repo
baseurl = https://nginx.org/packages/mainline/centos/7/$basearch/
gpgcheck = 0
enabled = 1（3）使用yum安装nginx
yum install -y nginx（4）打开default.conf配置文件
vim /etc/nginx/conf.d/default.conf（5）在server大括号中配置相关的信息。root为网站代码存放的目录，可以根据自己的情况进行修改。
server {listen 80;root /home/www;server_name localhost;#charset koi8-r;#access_log /var/log/nginx/log/host.access.log main;#location / {index index.php index.html index.htm;}#error_page 404 /404.html;#redirect server error pages to the static page /50x.html#error_page 500 502 503 504 /50x.html;location = /50x.html {root /usr/share/nginx/html;}#pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000#location ~ .php$ {fastcgi_pass 127.0.0.1:9000;fastcgi_index index.php;fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;include fastcgi_params;}
}（6）启动Nginx
systemctl start nginx（7）访问服务器地址 ：http://公网的IP地址。如果出现以下界面，说明安装成功。
1.3 安装MariaDB
（1）检查是否已安装MariaDB。正常情况返回是空，说明没有预先安装。
rpm -qa | grep -i mariadb有些服务器是自带安装了MariaDB的，则需要进行移除，否则可能造成版本冲突。如返回以下记录，则需要进行移除。
移除安装包明令：
yum -y remove 包名（2）创建 MariaDB.repo 文件
vi /etc/yum.repos.d/MariaDB.repo（3）写入文件内容
# MariaDB 10.4 CentOS repository list - created 2019-11-05 11:56 UTC
# http://downloads.mariadb.org/mariadb/repositories
[mariadb]
name = MariaDB
baseurl = https://mirrors.cloud.tencent.com/mariadb/yum/10.4/centos7-amd64
gpgkey=https://mirrors.cloud.tencent.com/mariadb/yum/RPM-GPG-KEY-MariaDB
gpgcheck=1（4）安装MariaDB。安装会耗时比较长，需要等待安装完毕后再操作。
yum -y install MariaDB-client MariaDB-server（5）启动MariaDB服务。
systemctl start mariadb（6）输入命令行：mysql，验证mysql是否安装成功
1.4 安装PHP
（1）更新PHP软件源
rpm -Uvh https://mirrors.cloud.tencent.com/epel/epel-release-latest-7.noarch.rpm
rpm -Uvh https://mirror.webtatic.com/yum/el7/webtatic-release.rpm（2）安装PHP的包
yum -y install mod_php72w.x86_64 php72w-cli.x86_64 php72w-common.x86_64 php72w-mysqlnd php72w-fpm.x86_64（3）启动PHP-FPM服务
systemctl start php-fpm（4）验证PHP环境是否成功
在网站根目录（我的根目录路径：/home/www1/）新建hello.php文件，内容输出“Hello World”
[root@VM-24-9-centos www1]# cat /home/www1/hello.php
<?php
echo "Hello World";
?>
[root@VM-24-9-centos www1]#（5）运行PHP程序。如果运行成功则输出Hello World。
[root@VM-24-9-centos www1]# php /home/www1/hello.php
Hello World（6）重启Nginx后，通过网页访问：http://公网IP地址/hello.php，可以验证运行PHP成功
systemctl restart nginx
到此为止，已经完成了LNMP（Linux、Nginx、MariaDB、PHP）的配置
2. 安装WordPress
WordPress安装的方法有很多样，我个人倾向于直接下载源码进行安装。可以直接下载中文版本，也可以下载英文版本后再更新语言安装包，这样界面也能成为中文的。
2.1 配置数据库
（1）创建数据库，例如名字为”wordpress”
CREATE DATABASE wordpress;（2）创建新用户，例如账号为”user_wordpress”，密码为”111111”
CREATE USER 'user_wordpress'@'localhost' IDENTIFIED BY '111111';（3）授权用户操作数据库的全部权限
GRANT ALL PRIVILEGES ON wordpress.* TO 'user_wordpress'@'localhost' IDENTIFIED BY '111111';备注说明：
（1）如果遇到无法访问数据库的问题，大多数都是权限问题，检查账户权限；
（2）如果要重新安装WordPress，可以把原来的数据库删除。删除后重新按照上面的步骤配置数据库，否则会出现连接数据库出错。
2.2 下载WordPress源文件
（1）中文WordPress 5.9.2下载地址：下载 | WordPress.org China 简体中文
下载完毕后，通过FTP软件把代码上传到根目录
（2）解压文件”wordpress-5.9.2-zh_CN.zip”，并且把文件夹”wordpress”改名”a”。主要是不想文件夹名字太长，导致URL不好看。
unzip wordpress-5.9.2-zh_CN.zip
mv wordpress a2.3 安装WordPress
（1）进入WordPress安装目录，复制一份wp-config.php文件
cd /home/www1/a/
cp wp-config-sample.php wp-config.php（2）修改wp-config.php文件，填入数据库信息，主要包括：数据库名字、用户、密码；
// ** MySQL settings - You can get this info from your web host ** //
/** The name of the database for WordPress */
define('DB_NAME', 'wordpress');
/** MySQL database username */
define('DB_USER', 'user_wordpress');
/** MySQL database password */
define('DB_PASSWORD', '111111');
/** MySQL hostname */
define('DB_HOST', 'localhost');（3）网站访问：http://公网IP地址/wordpress代码文件夹/wp-admin/install.php，填写相关信息后进行安装。
3. 安装WebStack主题
（1）访问WebStack GitHub网址，下载源文件。GitHub - WebStackPage/WebStackPage.github.io: ❤️静态响应式网址导航网站 - webstack.cc❤️静态响应式网址导航网站 - webstack.cc. Contribute to WebStackPage/WebStackPage.github.io development by creating an account on GitHub.
https://github.com/WebStackPage/WebStackPage.github.io
（2）解压到wordpress的“/wp-content/themes/”目录中
（3）访问管理台“外观”-“主题”，启用WebStack主题
（4）启用完毕之后，可以看到页面已经变成了WebStack主题，但里面内容是空的。接下来就开始学习如何录入数据，把空网站变成以下的样子。
备注：
（1）WebStack的代码中有很多我不需要的，例如：右上角的GitHub广告位、中间很多搜索栏目，这些都非常的冗余，因此做了不少的删减。
（2）删减的方法：页面上查看div元素和关键词，在“themes/webstack”文件夹中进行搜索，把关键的div结构内容直接删除就可以了。
四、WebStack的使用方法
1. 配置网站logo
进入管理台“主题设置”。
- 上传logo：网站左上角的导航图片
- 方形logo：网上左上角的图标，点击收起按钮才能看到；展开状态看到长方形的logo；
2. 配置左侧导航
在WebStack中左侧导航是用到了系统中的“网址分类”。路径：网址-网址分类，通过配置网站分类可以控制左侧导航栏目。
3. 配置内容
每一个导航的内容，对应着是网址；通过添加网址，即可填充内容。例如填充CSDN，操作如下。
- 网址：点击后跳转到网站
- 描述：底部描述
- 排序：展示的位置，越大越靠前
- 图标：本地上传logo图片，也可以使用api服务。如果api拉取的图片效果不好，则本地上传图片。
五、总结
感谢开源软件，让我们都能自由免费的搭建起来喜欢的系统，感谢WordPress+WebStack的贡献者。
使用开源WordPress和WebStack搭建导航网站相关推荐
- 搭建导航网站赚钱，小白也能躺赚！
个人站长应该是网络赚钱的先河,零几年的时候就有人通过导航网站赚钱,从hao123开始被导航网站赚钱被广大个人站长所熟知,那时候打开浏览器,显示的基本都是hao123,最终被百度以5000万高价收购,可 ...
- 以腾讯云为例，使用宝塔搭建一个骚气的导航网站
大家好,我是鸟哥.一个半路出家的程序员. 前几天有读者留言想用宝塔搭建一个导航网站.趁着五一有空,就亲自实战了一下,今天把搭建步骤分享给大家. 本篇文章依旧以腾讯云服务器为例,如果你没有搭建服务器和使 ...
- 用Typecho 平台，轻松搭建币圈导航网站（保姆级教程，0基础也能上手）
如果你是币圈人士,或者互联网从业者,想必你的收藏夹内会有很多链接,久而久之你的收藏夹会混乱不堪,导致你每次找资料的时候都要花时间去翻收藏夹,如果你有自己可定制化的导航网站,工作效率会不会提高一个阶梯? ...
- 【树莓派搭建个人网站】环境配置
一.搭建LAMP服务器 即Linux+Apache+MySQL+PHP 1. 安装apache 打开控制台,输入命令,确保软件安装是最新的. sudo apt update sudo apt upgr ...
- 史上最牛逼的导航网站（开源免费）
➡️ www.webstack.cc - 网址导航 项目开源地址: https://github.com/WebStackPage/WebStackPage.github.io 内容均由viggo收集 ...
- webstack响应式网站导航html源码kyuan 本地静态化版
介绍: webstack响应式网站导航html源码 安装方法:直接上传 一言.和风天气的api建议大家自己注册换成自己的,每个注册的人有每日免费使用次数, 自带的一起用可能最后都显示不出来了. 以上提 ...
- 使用wordpress搭建个人网站保姆级教程
文章目录 一.前言 二.介绍 三.准备工作 四.购买服务器 五.安装docker服务 六.创建docker网络 七.安装mysql容器 八.安装wordpress容器 九.进入wordPress管理平 ...
- WordPress响应式网址导航大全主题风格网站模板
介绍: 爱导航是一款原创品牌开发设计的WordPress网址导航大全主题风格,适用建立好看.强劲的导航栏类网址. 这款导航栏主题风格的主页选用模块化,能够加上不一样连接归类下的连接,每一个控制模块都能 ...
- 零基础也会建网站，20分钟快速利用宝塔和WordPress搭建个人网站
利用宝塔面板和WordPress搭建个人网站 购买服务器 安装宝塔面板 安装WordPress 配置WordPress 一. 购买轻量应用服务器 轻量应用服务器(Light server)是一种内置应 ...
最新文章
- python codecs.open()及文件操作-文本处理 with open
- 解决Maven依赖冲突的好帮手，这款IDEA插件了解一下？
- 用Scrum看板工具Leangoo做Sprint迭代管理-看板分享
- 微信小程序绑定数据以及自定义指令
- 零日漏洞迟迟未补上：扫描发现超85万思科设备受影响
- 应用化学：类卤代甲烷CH3X结构的神经网络
- LNMP服务跨省迁移的解决方案
- found.000文件夹的问题
- 一个很好的自学网站~推荐一下
- SQLi LABS Less-8 布尔盲注
- 【干货分享】通用工具类
- 零压力入门算法的顶流畅销书《漫画算法》施展了哪些“魔法”？
- java实现打印菱形（任意输入数字打印任意阶菱形）
- 超快全球任播OCSP：白嫖谷歌云免费SSL证书！
- OSChina 周日乱弹 —— 十大人艰不拆的网络真相！
- Python 学习笔记03 - 程序结构
- iOS小技巧21-MacOS 苹果系统下Outlook打不开，显示“您需要最新版本的Outlook才能使用此数据库”
- 希迪智驾发布“V2X+智慧高速”方案，打造智慧高速
- spring java 发送邮箱验证
- 虚拟机服务器分配内存,服务器虚拟机分配内存大小