WordPress Server Installation and responsive site configuration

First, quickly install WordPress on Linux by using Dokcer

1. Installing Docker and Docker-compose

Install using the official installation script

Curl-ssl https://get.docker.com/| Sh

Version Query

Docker–v

Start the Docker engine

Systemctl Enable Docker

Systemctl Start Docker

2. Installing Docker-compose

1) First install the Epel extension Source:

sudo yum-y install Epel-release

2) then install PYTHON-PIP

sudo yum-y install Python-pip

Pip Install Docker-compose

3) version Query

Docker-compose–v

3. Create a stack.yml file and save

Vim Stack.yml

Write the following and save:

Version: ' 3.1 ' services:wordpress:image:wordpress ports:-8080:80 Environment:wordpress_db_passwor D:example mysql:image:mysql:5.7 Environment:MYSQL_ROOT_PASSWORD:example

which

-8080:80 #wordpress容器的端口80映射给物理服务器的8080端口, can change 8080 to 80
Wordpress_db_password:example #mysql中wordpress数据库的访问密码, the production environment needs to be modified to
Mysql_root_password:example #mysql数据库的root访问密码, need to modify in production environment

4. Run docker-compose to download the image and run the container.

Docker-compose-f stack.yml up

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" http:// S3.51cto.com/wyfs02/m02/99/0a/wkiol1ldt0hd63q_aah8woejowe671.png "width=" 929 "height=" 772 "/>

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" http:// S3.51cto.com/wyfs02/m00/99/0a/wkiom1ldt0px_kpvaahuxz6bgsc046.png "width=" 991 "height=" 772 "/>

OK, the site has been established, you can login to manage: http://192.168.2.18/wp-admin/(install CentOS server ip:192.168.2.18)

Website official visit page: http://192.168.2.18/

Second, the website initialization

1. Login Access

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" http:// S3.51cto.com/wyfs02/m01/99/0a/wkiom1ldt0srampsaag6kjunsgq074.png "width=" 880 "height=" 772 "/>

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" http:// S3.51cto.com/wyfs02/m01/99/0a/wkiol1ldt0fherkzaalz11sqlee270.png "width=" 869 "height=" 772 "/>

2. Some general settings

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;margin:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M02/99/0A/wKiom1lDT0mjnv0GAAFFcFmnOA4772.png "width=" 945 "height=" 993 "/>

Here are the dates, time formats, and language settings, and don't forget to "save changes" at the end.

Other settings under the settings class can be set according to your site needs.

3. Add and apply a theme

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;margin:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M02/99/0A/wKiom1lDT1XjxHmlAAt5z4YyIrY060.png "width=" 1039 "height=" 851 "/>

Find the topic you need and enable

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;margin:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M00/99/0A/wKiom1lDT12zmkPNAAijGa4ODqQ572.png "width=" 1054 "height=" 931 "/>

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;margin:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M00/99/0A/wKioL1lDT2iB7_LGAAtQiAiNSHo069.png "width=" 1057 "height=" 865 "/>

If the theme is enabled, but the home page of the demo site does not come out, you need to set the home page display in the theme "Static homepage": a static pages, and select a page to the homepage

650) this.width=650; "title=" image "style=" border-top:0px;border-right:0px;background-image:none;border-bottom:0 px;padding-top:0px;padding-left:0px;border-left:0px;margin:0px;padding-right:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M01/99/0A/wKioL1lDT2mDXHZ1AABj1tB57pA875.png "height=" 733 "/>

4, set up the top and bottom menu

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;margin:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M01/99/0A/wKioL1lDT2uhgx27AADGt6lPQJg372.png "width=" 1169 "height=" 782 "/>

First add a few pages to do the navigation menu, and so on later content rich and then change.

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;margin:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M00/99/0A/wKiom1lDT2zDvOL9AADVNQJvepo981.png "width=" 1154 "height=" 689 "/>

4.1 Create a custom menu, customize a URL Jump menu or home page Location menu

650) this.width=650; "title=" image "style=" border-top:0px;border-right:0px;background-image:none;border-bottom:0 px;padding-top:0px;padding-left:0px;border-left:0px;margin:0px;padding-right:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M00/99/0A/wKioL1lDT22CwONdAADbU-dksCk827.png "height=" 675 "/>

Need to mark the core in page editing

650) this.width=650; "title=" image "style=" border-top:0px;border-right:0px;background-image:none;border-bottom:0 px;padding-top:0px;padding-left:0px;border-left:0px;margin:0px;padding-right:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M02/99/0A/wKioL1lDT27Bd0T0AAEiJDqWSWM126.png "height=" 689 "/>

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" http:// S3.51cto.com/wyfs02/m01/99/0a/wkiol1ldt2-bnavpaabtzg25b-k113.png "width=" 1162 "height=" 410 "/>

Put the defined menu in the corresponding location of the page, and some themes may only primary menu.

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;margin:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M01/99/0A/wKiom1lDT3DABFABAABnOtOti78932.png "width=" 928 "height=" 428 "/>

5, install the necessary plug-ins (contact form, cache, visual page editing, Carousel Map production plug-in, if the upload plugin when the prompt file can not be uploaded, refer to the Final Solution)

WP Acceleration for China This plugin can be found in the system and installed, can speed up the entire site editing and access speed.

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;margin:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M02/99/0A/wKioL1lDT3PxuIh0AAFNWTwsRD8395.png "width=" 1172 "height=" 802 "/>

6. New page for building site content

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" http:// S3.51cto.com/wyfs02/m01/99/0a/wkiol1ldt3wxisdjaahwhpiinru781.png "width=" "height=" 860 "/>

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;margin:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M02/99/0A/wKioL1lDT3aA02dtAADGtzrm97s697.png "width=" 1169 "height=" 691 "/>

6.1 Using Visual Composer to edit pages

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" http:// S3.51cto.com/wyfs02/m01/99/0a/wkiom1ldt3jgpc3saaf1wiosy3g804.png "width=" "height=" 878 "/>

Various elements that can be added

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;margin:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M01/99/0A/wKiom1lDT33RpzYYAAL9VXkaYJw671.png "width=" 1109 "height=" 816 "/>

You can customize the number of columns as needed

650) this.width=650; "title=" image "style=" border-top:0px;border-right:0px;background-image:none;border-bottom:0 px;padding-top:0px;padding-left:0px;border-left:0px;margin:0px;padding-right:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M02/99/0A/wKiom1lDT3_A5VftAAGARXXEKtY567.png "height=" 701 "/>

7, according to the entire site style adjustment theme settings (using different themes, its theme settings are not exactly the same, generally in the appearance of special settings, or in the theme of the custom settings)

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;margin:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M01/99/0A/wKioL1lDT4DA1sDfAAEGbJnet6g719.png "width=" 1004 "height=" 896 "/>

You can set various parameters such as the navigation bar, footer, color, background, font, and so on for your site theme, and you can set individual parameters for the theme in your customizations.

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" http:// S3.51cto.com/wyfs02/m00/99/0a/wkiol1ldt4mbzpw2aakpagmndmk914.png "width=" "height=" 858 "/>

8. Using slider Revolution to make Carousel diagram

8.1 New Slider

650) this.width=650; "title=" image "style=" border-top:0px;border-right:0px;background-image:none;border-bottom:0 px;padding-top:0px;padding-left:0px;border-left:0px;margin:0px;padding-right:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M02/99/0A/wKiom1lDT4qwvMErAAE8lvVS9J8506.png "height=" 569 "/>

8.2 Set content source, title, type, layout, etc.

650) this.width=650; "title=" image "style=" border-top:0px;border-right:0px;background-image:none;border-bottom:0 px;padding-top:0px;padding-left:0px;border-left:0px;padding-right:0px; "border=" 0 "alt=" image "src=" http:// S3.51cto.com/wyfs02/m02/99/0a/wkiom1ldt4vz9wgzaadmjab6rfm870.png "height=" 550 "/>

Automatically enter edit slideshow after saving

650) this.width=650; "title=" image "style=" border-top:0px;border-right:0px;background-image:none;border-bottom:0 px;padding-top:0px;padding-left:0px;border-left:0px;margin:0px;padding-right:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M00/99/0A/wKiom1lDT43ytsRAAAGmqlA-u1c626.png "height=" 589 "/>

650) this.width=650; "title=" image "style=" border-top:0px;border-right:0px;background-image:none;border-bottom:0 px;padding-top:0px;padding-left:0px;border-left:0px;margin:0px;padding-right:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M01/99/0A/wKiom1lDT46way4RAACWVjMYlPE990.png "height=" 649 "/>

650) this.width=650; "title=" image "style=" border-top:0px;border-right:0px;background-image:none;border-bottom:0 px;padding-top:0px;padding-left:0px;border-left:0px;margin:0px;padding-right:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M00/99/0A/wKiom1lDT4-DgY7iAAEH9JQW9qM698.png "height=" 744 "/>

Do a page to be saved separately, otherwise it will not, and finally to insert this carousel in the page

650) this.width=650; "title=" image "style=" border-top:0px;border-right:0px;background-image:none;border-bottom:0 px;padding-top:0px;padding-left:0px;border-left:0px;margin:0px;padding-right:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M01/99/0A/wKiom1lDT5GQdm3HAAEURfL3n64780.png "height=" 685 "/>

Almost, after the operation of this sequence, a website is set up, it can be self-management background, more convenient than their own development, and it has a lot of themes and plugins, what corporate website, e-commerce website and so on.

Alternate Features:

First, WordPress website spare parts, migration

The main folders are as follows, and you can back up these three folders directly using third-party tools

Theme File Location: Site root directory \wp-content\themes\ your theme folder

Plugin file location: web site root directory \wp-content\plugins\

Attachment location: Site root directory \wp-content\uploads\

Second, you can also use the WordPress plugin to complete:

1, export all content of the website (does not include website pictures, audio, video multimedia files), for backup or migration server, of course, MySQL database needs to be backed up separately.

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;margin:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M02/99/0A/wKiom1lDT5LCZWHWAADd39LB9ds858.png "width=" 944 "height=" 689 "/>

2. Export multimedia files

Install the plug-in "File Manager" to export wordpress/wp-content/uploads entire folder in its panel

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;margin:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M00/99/0B/wKiom1lDT5WxnbuXAAFpwRyJlac917.png "width=" 1039 "height=" 789 "/>

This method is also used when importing, but if you are migrating to a new environment, you will need to use the add from Server plugin to import these original pictures into the Media Library, so that the pictures belong to WordPress "jurisdiction".

(If the search is not available, you can download it directly to the official website: https://wordpress.org/plugins/add-from-server/, then install the plugin into the plugin, install it manually)

In specify the pictures in the uploads file that you have imported, import them into the Media library.

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;margin:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M02/99/0A/wKioL1lDT5aRkbEWAADsqH-FrwI467.png "width=" 1056 "height=" 888 "/>

Restore import of all files

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;margin:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M00/99/0A/wKioL1lDT5iBD4vLAAEifwAX-XE826.png "width=" 916 "height=" 850 "/>

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" http:// S3.51cto.com/wyfs02/m01/99/0a/wkiol1ldt5zrndn_aalbakwxc5i144.png "width=" 1045 "height=" 868 "/>

Once installed, you can import the backup directly.

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;margin:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M00/99/0A/wKioL1lDT53QhY2AAADM4ZxVbnQ752.png "width=" 1043 "height=" 644 "/>

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;margin:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M01/99/0B/wKiom1lDT5-yZ62AAAHsYumkAHg458.png "width=" "height=" 653 "/>

Third, the resolution of the local upload plug-in can not exceed 2M of the problem (the main reason is that the default php.ini file limit the maximum upload file is 2M, but the default does not have this problem, so the solution is: new info.php file in the browser execution "find php.ini storage location "New php.ini file" write maximum allowable limit setting

1, first in the Docker container site root directory to build a info.php file, the operation is as follows:

Docker-compose exec WordPress Bash (go to Docker container execution command)

Cd/var/www/html

Touch info.php

echo "<?php echo phpinfo (); ?> ">info.php

Open the browser to run this file and find out where the php.ini file is stored

650) this.width=650; "title=" image "style=" border-right-width:0px;background-image:none;border-bottom-width:0px; padding-top:0px;padding-left:0px;margin:0px;padding-right:0px;border-top-width:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M00/99/0A/wKioL1lDT6LQUYWJAACvBPS5fMs407.png "width=" "height=" 484 "/>

2, new php.ini file and write maximum upload file limit to 64M.

cd/usr/local/etc/php

Touch php.ini

echo "upload_max_filesize = 64M" >php.ini (modified max upload file is 64M)

echo "post_max_size = 64M" >>php.ini (modified article maximum size is 64M)

echo "max_execution_time = >>php.ini" (Modified maximum execution time is 300, i.e. page wait time)

Exit (Exit Container)

Docker-compose Restart (Restart container)

Finally, you can upload 2M or less 64M plug-ins.

Four, about the WordPress user site open Extremely slow, or the carousel map for a long time no problem (measured very effective)

1, through the installation of WordPress plugin to search WP acceleration for the China plug-in

2, in the WordPress plugin installation plug-in installation, finally enable plug-ins.

650) this.width=650; "title=" image "style=" border-top:0px;border-right:0px;background-image:none;border-bottom:0 px;padding-top:0px;padding-left:0px;border-left:0px;margin:0px;padding-right:0px; "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M01/99/0B/wKiom1lDT6OA0AtCAAC9SQZDes8481.png "height=" 465 "/>

This article from the "Strong Technical communication blog," Please be sure to keep this source http://newthink.blog.51cto.com/872263/1937391

WordPress Server Installation and responsive site configuration