使用docker+WordPress开发企业官网


title: 使用docker+WordPress开发企业官网 编辑中
category: Web
tag: WordPress
date: 2019-07-17


主标题:使用docker+wordpress开发企业官网

因为已经对docker熟悉了,直接进入正题,讲解的节奏会快一些,如果你不熟悉docker和docker-compose,可以参考第四部分 Docker 微服务教程--阮一峰

开发流程

配置docker-compose

如果你安装了docker,应该就默认安装了docker-compose ,试一下:

docker-compose -v
# ==> docker-compose version 1.23.2, build 1110ad01

因为众所周知的原因,需要确保docker的仓库使用的国内仓库。

mac 上 进入设置 daemon设置修改 registry,阿里云和腾讯云都提供了仓库镜像站,你也可以尝试 DaoCloud 推出的docker镜像站

下载所需文件

趁着有空先下载这俩 images

docker pull mysql:5.7 wordpress:latest

在开发阶段,我们尽可能少地使用外部资源,mysql数据库+WordPress本地。

安装WordPress

新建项目目录,这里不要顺手敲 npm init!这次和node没关系。

新建 docker-compose.yml 作为配置文件,最小化文件大概这样:

version: "2"
services:
    mysql:
        image: mysql:5.7
        environment:
            - MYSQL_ROOT_PASSWORD=123456
            - MYSQL_DATABASE=wordpress
        volumes:
            - ./mysql/data:/var/lib/mysql
        ports:
            - "3306:3306"

    web:
        image: wordpress:latest
        links:
            - mysql
        environment:
            - WORDPRESS_DB_PASSWORD=123456
        ports:
            - "127.0.0.1:9998:80"
        working_dir: /var/www/html
        volumes:
            - "./html:/var/www/html/"

几个需要嘱咐的点:

  • volumes是共享文件夹的意思,这意味着我们把wp和sql文件都放到本地了,不会因为停止服务丢失信息
  • ports 先对外接口,映射对内接口

万事俱备,起!

docker-compose up

补充,对于docker-compose 命令很简单:

docker-compose up #创建并开启容器
docker-compose up -d # 后台起
docker-compose down #停止并移除 容器 网络 镜像和volumes数据卷

docker-compose start #启动服务
docker-compose stop # 停止服务
# 其他略

等到console信息跑完了,就可以打开浏览器访问了,我这里是127.0.0.1:9999

看截图:

20190717143027

注意:

如果你没有看到选择语言的页面,那可能是遇到了奇怪的问题,需要修改 wp文件里的wp-config.php查找或者新增:define('WPLANG', 'zh_CN'); ,然后重启服务。有的时候没有出现这条命令,很奇怪。

接下来按照提示设置即可。

占位,我这里需要修改配置,我想访问SQL数据库。

调整网站设置

接下来,发布几篇文章,设置几个栏目,先把内容撑起来。企业网站,大部分都是静态展示页,核心还是专题页。这里为了展示,说一下我的设置,这部分信息已经脱敏,大家都一样。

点击 文章 -- 分类目录,这个地方就是设置分类的地方了。我们添加新分类目录,设置中文名,路径名,父级关系:

栏目设置

有了大概的目录结构,剩下的就是完善了,一般都是提前规划好栏目结构。

接下来就是填入一些文章占位。wp的编辑器已经更新了,现在的编辑器应该是更符合结构化存储和展示了

复制粘贴新闻,发布。

发现网址不是我们期望的格式,进入设置--固定链接,修改设置 /%category%/%post_id%.html/ 这样就是按照栏目路径设置了,更清晰明确。

(yekyi shi %postname%.html)

一些零碎工作完成之后,就是开发WordPress模板了。

wp模板结构

你可以看这里:官方文档主题开发

主题,除了图片和js,还有三部分文件:

  • 样式 sytle.css
  • 函数文件 functions.php
  • 模板文件,从数据库里调取数据

样式

style.css 必须有注释,注释也是格式的,提取出来用来描述主题信息。

我贴一段官方出的最新专题的代码 主题29:

/*
Theme Name: Twenty Nineteen
Theme URI: https://wordpress.org/themes/twentynineteen/
Author: the WordPress team
Author URI: https://wordpress.org/
Description: Our 2019 default theme is designed to show off the power of the block editor. It features custom styles for all the default blocks, and is built so that what you see in the editor looks like what you'll see on your website. Twenty Nineteen is designed to be adaptable to a wide range of websites, whether you’re running a photo blog, launching a new business, or supporting a non-profit. Featuring ample whitespace and modern sans-serif headlines paired with classic serif body text, it's built to be beautiful on all screen sizes.
Requires at least: WordPress 4.9.6
Version: 1.4
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: twentynineteen
Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, rtl-language-support, sticky-post, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Twenty Nineteen is based on Underscores https://underscores.me/, (C) 2012-2018 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

这些是必须的,用来展示主题时候有用。无外乎

Theme Name, Theme URI, Author, Author URI, Description等等

函数文件

functions.php

放很多常用的函数。默认加载

composer php的包安装工具。使用了 mustcache

一些配置,要启用的主题功能,定义模板文件的函数

模板文件

其他的都一般,如果存在 single-{post-type}.php 文件,就可以自定义页面模板了

基本模板

style.css + index.php

其他的模块文件,可以通过 get_header() 等方法引入

<?php get_footer(); ?>

post page attament

wp-includes wp-admin 不需要直接修改

直接中在 wp-content

插件和主题

wp-cache 生成静态页,也可以加 cdn

category thumalis 等

theme

twentynineteen 模板

仓库 wp-dev-env 快速起一个开发环境

php文件

文章页,列表页

先切图。仓库可以 tonglu 搜到

category

homepage 首页

<?php
  /*Template Name: Homepage*/
  
 ?>

get_conetnt()

list 两种

使用的pug

body.class = {{body_class}}

poedit 国际化

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,793评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 87,567评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,342评论 0 338
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,825评论 1 277
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,814评论 5 368
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,680评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,033评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,687评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 42,175评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,668评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,775评论 1 332
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,419评论 4 321
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,020评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,978评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,206评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,092评论 2 351
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,510评论 2 343