wordpress建站插件和常见问题解决
一、自己在wordpress建站过程中使用的操作性强、友好的插件分享
1、页面编辑插件:Elementor
这个插件可编辑性强,除顶部和底部可以修改外,其他所有内容时自己可以修改的,还可以创建自己的模板,在需要的位置添加,还可以自己编写html来编辑网页。
2、登录注册以及权限管理插件: Pie Register
该插件可以设置未注册用户不具访问某些网页的权限,还可以在注册、登陆、忘记密码页码添加验证码,以及注册时用户邮箱验证
3、底部可编辑模板:Blue construction(底部可编辑版权)
4、登录注册邮件发送:SMTP Blank
二、多站点建设
教程:https://www.boke8.net/wordpress-allow-multisite.html
Not Found 问题解决:(见最后一个方案,将None改为ALL)
https://www.crifan.com/test_local_wordpress_homepage_can_open_but_any_post_error_not_found_the_requested_url/
三、在建站过程中的一些常见问题
1、登陆注册页面的美化
(1)将网页中的英文改为中文
使用Pie Register 插件时,所给的登陆注册忘记密码页面有些文字为英文,需要修改为英文
在后台找到Pie register所在目录中的template页面下的三个文件,将对应的英文改为中
在修改过程中如果遇到编码问题,可以将每个加入的中文先进行编码转换,具体操作如下:
$str = incov("utf-8","gb2312","登陆") /*将中文转换为gb2312编码
并在需要修改为中文的地方添加:$str
(2)页面的编辑
有时由于模板的不兼容等原因,需要对页面进行编辑,此时需要修改css文件
找到Pie register插件目录下的css文件夹中的front.css文件,进行修改,有时可能还需要编辑主题模板下的style.css文件
2、菜单栏字体修改
第一步:找到菜单栏文字所在class或id
第二步:在额外css中对其进行编辑
3、固定链接修改
修改为固定链接如下:
访问子页面时,页面显示“404 Not Found”,解决方案(仅适合nginx):
在 /etc/nginx/config.d/mysit.conf文件的 loction \ {} 中添加
if (-f $request_filename/index.html){
rewrite (.*) $1/index.html break;
}
if (-f $request_filename/index.php){
rewrite (.*) $1/index.php;
}
if (!-f $request_filename){
rewrite (.*) /index.php;
}
一定记住,需要重启nginx
重启nginx:
不能用service nginx restart 来重启nginx
第一步:ps -ef | grep nginx 查看nginx的目录
第二步:cd进入该目录
第三步:nginx -s reload 重启nginx
4、底部版权栏添加
管理员用户登录,打开首页,点击左上角的自定义
该部分代码添加在constructioin zone options > Footer info >copyright
<div class="footer-copyright-container">
<div class="footer-wrapper footer-copyright-wrapper">
<ul class="footer-law">
<li><a class="footer-link" href="http://www.ruone.cn/?page_id=133" target="_blank">法律声明</a></li>
<li><a class="footer-link" href="http://www.ruone.cn/?page_id=137" target="_blank">隐私政策声明</a></li>
<li><a class="footer-link" href="http://www.ruone.cn/?page_id=143" target="_blank">可接受的使用政策</a></li>
<li><a class="footer-link" href="http://www.ruone.cn/?page_id=140" target="_blank">若讷云用户协议</a></li>
</ul>
<div class="footer-copyright">
<span>版权所有 @若讷信息技术有限公司 2018</span> <span>保留一切权利</span> <a class="footer-link" href="http://www.miitbeian.gov.cn" target="_blank">沪ICP备18026044号-1</a>
<span>苏B2-20130048号</span>
</div>
</div>
</div>
管理该部分的css文件添加在自定义的"额外css"中
.top-user
{
float: right;
margin-right: 10px;
height: 0px;
display: none;
}
.main-header-area .main-menu-area nav ul li a {
display: block;
transition: all .2s;
text-transform: uppercase;
text-decoration: none;
font-weight: 600;
font-size: 18px;
color: #000000;
}
.footer-law {
float: right;
overflow: hidden;
overflow-x: hidden;
overflow-y: hidden;
font-size: 0;
}
li{
list-style:none;
display: inline-block;
font-size: 12px;
line-height: 24px;
}
a {
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
color: inherit;
font-size: inherit;
font-weight: inherit;
}
.footer-law > li + li:before {
content: "|";
margin-left: 5px;
margin-right: 5px;
}
.footer-copyright {
float: left;
font-size: 0;
}
.footer-copyright span, .footer-copyright a {
display: inline-block;
margin-right: 10px;
font-size: 12px;
line-height: 24px;
}
5、轮播图添加
使用elementor插件,添加一个模块,并将HTML拖入模块
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
.img_txt2[data-v-449a6d82] {
position: absolute;
background-color: black;
height: 226px;
width: 550px;
z-index: 101;
padding-left: 10px;
padding-top: 30px;
opacity: .2;
top: 200px;
left: 170px;
}
.img_txt2_1[data-v-449a6d82]{
position: absolute;
top: 250px;
left: 222px;
width: 500px;
z-index:101;
padding-left: 30px;
}
.img_txt1 p{
text-align: left;
color: #4b4b4b;
margin: 20px 0;
font-size: 16px;
line-height: 26px;
}
.img_txt1 a{
text-align: center;
color: #101010;
position: absolute;
left: 0;
width: 140px;
height: 45px;
border: 1px #4b4b4b solid;
border-top-color: rgb(75, 75, 75);
border-top-style: solid;
border-top-width: 1px;
border-right-color: rgb(75, 75, 75);
border-right-style: solid;
border-right-width: 1px;
border-bottom-color: rgb(75, 75, 75);
border-bottom-style: solid;
border-bottom-width: 1px;
border-left-color: rgb(75, 75, 75);
border-left-style: solid;
border-left-width: 1px;
border-image-source: initial;
border-image-slice: initial;
border-image-width: initial;
border-image-outset: initial;
border-image-repeat: initial;
border-radius: 30px;
border-top-left-radius: 30px;
border-top-right-radius: 30px;
border-bottom-right-radius: 30px;
border-bottom-left-radius: 30px;
text-decoration: none;
line-height: 45px;
}
.img_txt1[data-v-449a6d82]{
position: absolute;
top: 223px;
left: 222px;
width: 550px;
z-index: 101;
}
.csslider {
width: 100%;
-moz-perspective: 1300px;
-ms-perspective: 1300px;
-webkit-perspective: 1300px;
perspective: 1300px;
display: inline-block;
text-align: left;
position: relative;
margin-bottom: 22px;
height: 620px;
}
.csslider > input {
display: none;
}
.csslider > input:nth-of-type(10):checked ~ ul li:first-of-type {
margin-left: -900%;
}
.csslider > input:nth-of-type(9):checked ~ ul li:first-of-type {
margin-left: -800%;
}
.csslider > input:nth-of-type(8):checked ~ ul li:first-of-type {
margin-left: -700%;
}
.csslider > input:nth-of-type(7):checked ~ ul li:first-of-type {
margin-left: -600%;
}
.csslider > input:nth-of-type(6):checked ~ ul li:first-of-type {
margin-left: -500%;
}
.csslider > input:nth-of-type(5):checked ~ ul li:first-of-type {
margin-left: -400%;
}
.csslider > input:nth-of-type(4):checked ~ ul li:first-of-type {
margin-left: -300%;
}
.csslider > input:nth-of-type(3):checked ~ ul li:first-of-type {
margin-left: -200%;
}
.csslider > input:nth-of-type(2):checked ~ ul li:first-of-type {
margin-left: -100%;
}
.csslider > input:nth-of-type(1):checked ~ ul li:first-of-type {
margin-left: 0%;
}
.csslider > ul {
position: relative;
width: 100%;
height: 100%;
z-index: 1;
font-size: 0;
line-height: 0;
background-color: #000000;
padding: 0;
overflow: hidden;
white-space: nowrap;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.csslider > ul > li {
position: relative;
display: inline-block;
width: 100%;
height: 100%;//620
overflow: hidden;
font-size: 15px;
font-size: initial;
line-height: normal;
-moz-transition: all s cubic-bezier(0.4, 1.3, 0.65, 1);
-o-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s cubic-bezier(0.4, 1.3, 0.65, 1);
transition: all 0.5s cubic-bezier(0.4, 1.3, 0.65, 1);
-moz-background-size: cover;
-o-background-size: cover;
-webkit-background-size: cover;
background-size: cover;
vertical-align: top;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
white-space: normal;
}
.csslider > ul > li.scrollable {
overflow-y: scroll;
}
.csslider > .navigation {
position: absolute;
bottom: -8px;
left: 50%;
z-index: 10;
margin-bottom: -10px;
font-size: 0;
line-height: 0;
text-align: center;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.csslider > .navigation > div {
margin-left: -100%;
}
.csslider > .navigation label {
position: relative;
display: inline-block;
cursor: pointer;
border-radius: 50%;
margin: 0 4px;
padding: 4px;
background: #222;
}
.csslider > .navigation label:hover:after {
opacity: 1;
}
.csslider > .navigation label:after {
content: '';
position: absolute;
left: 50%;
top: 50%;
margin-left: -6px;
margin-top: -6px;
background: #71ad37;
border-radius: 50%;
padding: 6px;
opacity: 0;
}
.csslider > .arrows {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.csslider.inside .navigation {
bottom: 10px;
margin-bottom: 10px;
}
.csslider.inside .navigation label {
}
.csslider > input:nth-of-type(1):checked ~ .navigation label:nth-of-type(1):after,
.csslider > input:nth-of-type(2):checked ~ .navigation label:nth-of-type(2):after,
.csslider > input:nth-of-type(3):checked ~ .navigation label:nth-of-type(3):after,
.csslider > input:nth-of-type(4):checked ~ .navigation label:nth-of-type(4):after,
.csslider > input:nth-of-type(5):checked ~ .navigation label:nth-of-type(5):after,
.csslider > input:nth-of-type(6):checked ~ .navigation label:nth-of-type(6):after,
.csslider > input:nth-of-type(7):checked ~ .navigation label:nth-of-type(7):after,
.csslider > input:nth-of-type(8):checked ~ .navigation label:nth-of-type(8):after,
.csslider > input:nth-of-type(9):checked ~ .navigation label:nth-of-type(9):after,
.csslider > input:nth-of-type(10):checked ~ .navigation label:nth-of-type(10):after,
.csslider > input:nth-of-type(11):checked ~ .navigation label:nth-of-type(11):after {
opacity: 1;
}
.csslider > .arrows {
position: absolute;
left: -31px;
top: 50%;
width: 100px;
height: 0%;
padding: 0 31px;
z-index: 0;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
}
.csslider > .arrows label {
display: none;
position: absolute;
top: -50%;
padding: 13px;
box-shadow: inset 2px -2px 0 1px #3a3a3a;
cursor: pointer;
-moz-transition: .15s;
-o-transition: .15s;
-webkit-transition: .15s;
transition: .15s;
}
.csslider > .arrows label:hover {
box-shadow: inset 3px -3px 0 2px #71ad37;
margin: 0 0px;
}
.csslider > .arrows label:before {
content: '';
position: absolute;
top: -100%;
left: -100%;
height: 300%;
width: 300%;
}
.csslider.infinity > input:first-of-type:checked ~ .arrows label:last-of-type,
.csslider > input:nth-of-type(1):checked ~ .arrows label:nth-of-type(0),
.csslider > input:nth-of-type(2):checked ~ .arrows label:nth-of-type(1),
.csslider > input:nth-of-type(3):checked ~ .arrows label:nth-of-type(2),
.csslider > input:nth-of-type(4):checked ~ .arrows label:nth-of-type(3),
.csslider > input:nth-of-type(5):checked ~ .arrows label:nth-of-type(4),
.csslider > input:nth-of-type(6):checked ~ .arrows label:nth-of-type(5),
.csslider > input:nth-of-type(7):checked ~ .arrows label:nth-of-type(6),
.csslider > input:nth-of-type(8):checked ~ .arrows label:nth-of-type(7),
.csslider > input:nth-of-type(9):checked ~ .arrows label:nth-of-type(8),
.csslider > input:nth-of-type(10):checked ~ .arrows label:nth-of-type(9),
.csslider > input:nth-of-type(11):checked ~ .arrows label:nth-of-type(10) {
display: block;
left: 0;
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.csslider.infinity > input:last-of-type:checked ~ .arrows label:first-of-type,
.csslider > input:nth-of-type(1):checked ~ .arrows label:nth-of-type(2),
.csslider > input:nth-of-type(2):checked ~ .arrows label:nth-of-type(3),
.csslider > input:nth-of-type(3):checked ~ .arrows label:nth-of-type(4),
.csslider > input:nth-of-type(4):checked ~ .arrows label:nth-of-type(5),
.csslider > input:nth-of-type(5):checked ~ .arrows label:nth-of-type(6),
.csslider > input:nth-of-type(6):checked ~ .arrows label:nth-of-type(7),
.csslider > input:nth-of-type(7):checked ~ .arrows label:nth-of-type(8),
.csslider > input:nth-of-type(8):checked ~ .arrows label:nth-of-type(9),
.csslider > input:nth-of-type(9):checked ~ .arrows label:nth-of-type(10),
.csslider > input:nth-of-type(10):checked ~ .arrows label:nth-of-type(11),
.csslider > input:nth-of-type(11):checked ~ .arrows label:nth-of-type(12) {
display: block;
right: 0;
-moz-transform: rotate(225deg);
-ms-transform: rotate(225deg);
-o-transform: rotate(225deg);
-webkit-transform: rotate(225deg);
transform: rotate(225deg);
}
</style>
<head>
<body>
<div class="csslider">
<input type="radio" name="slides" id="slides_1" checked />
<input type="radio" name="slides" id="slides_2" />
<input type="radio" name="slides" id="slides_3" />
<input type="radio" name="slides" id="slides_4" />
<input type="radio" name="slides" id="slides_N" />
<ul>
<li><img
src = "http://www.ruone.cn/wp-content/uploads/2018/08/112.jpg" width="100%">
<div data-v-449a6d82="" class="img_txt1">
<h3 data-v-449a6d82="">业内第一家<br data-v-449a6d82="">OpenStack桌面云厂商</h3>
<p data-v-449a6d82="">机敏云(Astute-Cloud)产品基于OpenStack进行深度定制,同时支撑企业内部的服务器虚拟化以及桌面的虚拟化需求,给客户提供一体化的云解决方案。</p>
<a data-v-449a6d82="" href="http://www.ruone.cn/contact/">联系我们</a>
</div>
<p>hi </p></li>
<li><img
src = "http://www.ruone.cn/wp-content/uploads/2018/08/113.jpg"width="100%">
<div data-v-449a6d82="" class="img_txt img_txt2"></div>
<div data-v-449a6d82="" class="img_txt img_txt2_1"><h3 data-v-449a6d82="">机敏智能桌面云</h3> <p data-v-449a6d82="">一台显示器或云终端;一部手机或平板;一台电脑或笔记本<br data-v-449a6d82="">企业上云,其实可以更简单</p></div>
</li>
<li><img
src = "http://www.ruone.cn/wp-content/uploads/2018/08/114.png" width="100%"></li>
<li><img
src = "http://www.ruone.cn/wp-content/uploads/2018/08/112.jpg" width="100%"></li>
</ul>
<div class="arrows">
<label for="slides_1"></label>
<label for="slides_2"></label>
<label for="slides_3"></label>
<label for="slides_4"></label>
</div>
<div class="navigation">
<div>
<label for="slides_1"></label>
<label for="slides_2"></label>
<label for="slides_3"></label>
<label for="slides_4"></label>
</div>
</div>
</div>
</body>
</html>