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>