本站點爲個人博客網站,主要記錄Web、Android方面的學習內容,以及日常生活中的想法,既方便日後的回顧學習,也希望爲讀者提供一些幫助。
一、站點的策劃和構思
站點主題色選用天藍色,背景圖選用海天交接圖,整個網站佈局簡約、清新,爲讀者提供寧靜、自由的環境去細細品讀文章。
主要劃分爲三個板塊:頁眉、內容、頁腳
頁眉
- 上部顯示個人特色信息
- 下部顯示菜單導航欄
- 右邊浮動顯示百度分享
內容
- 左邊分頁顯示文章內容或者自定義網頁
- 右邊顯示一些小工具,按順序自上而下分別爲:個人信息、搜索、近期文章、近期評論、分類目錄、文章歸檔、友情鏈接。
頁腳
- 顯示作者和備案號,同時加入百度統計、回到頂部的功能。
二、雲服務器的構建
1、服務器購買與配置
(1)地域選擇最近的一個,機型根據需要自行選擇
(2)鏡像選擇CentOS6.8 64位,安全性強,後面的教程,使用命令行操作簡單、快速
(3)設置系統密碼,安全組稍後手動建立,然後點擊購買,學生可以使用現金抵用券減掉64元
(4)購買成功後,進入控制檯的雲主機界面,選擇安全組進行配置,如圖所示,我打開了21、22、80、3389端口,對來源也進行了控制,最後爲主機設置剛配置好的安全組
注:一般遠程登錄失敗,或者訪問不到IP,都是端口沒打開的原因
2、Web運行環境的安裝與配置
(1)先安裝遠程登錄軟件,我選擇了putty,去官網下載安裝即可
網址:https://www.chiark.greenend.org.uk/~sgtatham/putty/latest.html
(2)安裝成功後,打開界面,輸入服務器公網IP,點擊Open
(3)輸入之前設置的用戶名、密碼,進行登錄
(4)輸入以下命令,升級所有軟件
- # yum update -y
(5)安裝OneinStack
- OneinStack 是一個一鍵安裝程序,可以方便的安裝 Nginx、MySQL、PHP 這些程序,有這些才能讓wordpress正常運行。
在終端逐步輸入執行以下命令
- # yum -y install wget screen curl python
- # wget http://mirrors.linuxeye.com/oneinstack-full.tar.gz
- # tar xzf oneinstack-full.tar.gz
- # cd oneinstack
- # screen -S oneinstack
- # ./install.sh
然後按下圖選擇好相關軟件
(6)安裝成功後,用瀏覽器打開你的公網IP,可以看到成功頁面
至此,雲服務器配置完成。
三、域名的申請、備案和解析
1、域名申請
進入騰訊雲註冊域名界面,搜索域名,進行購買
注:服務器何和域名最好在一個雲平臺下,方便操作,否則需要進行域名遷移,非常耗時間
2、域名備案
查看騰訊雲域名備案流程,按步驟提交資料,10-20天即可完成備案
地址:https://www.qcloud.com/document/product/243/655
3、域名解析
進入域名管理界面,我先解析了兩條記錄,後面可以根據需要解析成其他域名
- 第一條 www.xxx.cn:記錄類型選A,主機記錄選www,線路類型選默認,記錄值填公網IP,TTL默認選10分鐘即可
- 第二條 xxx.cn:記錄類型選A,主機記錄選@,線路類型選默認,記錄值填公網IP,TTL默認選10分鐘即可|
具體如下圖:
四、構建軟件的比較和選用
以下爲國內外常見開源軟件:
1、WordPress
WordPress免費開源程序,WordPress可以搭建功能強大的網絡信息發佈平臺,但更多的是應用於個性化的博客。WordPress除了做個人博客外,可以做企業站、門戶站、商場、批發網站等,擴展性特別強大。
2、Drupal
Drupal是一個開源的內容管理系統(CMS)平臺,擁有強大並可自由配置的功能,能支持從個人博客到大型社區驅動的網站等各種不同應用的網站項目。若干年前我認爲joomla是開源CMS中當之無愧的老大,但是現在我認爲drupal做的更好,因爲CMS不僅僅在於需要大量的擴展和模板主題, 還得能讓用戶迅速上手。
3、Discuz
Discuz論壇免費開源,佔有市場比例相當高,同時也是騰訊旗下的公司,通過QQ等多平臺分享流量也是非常強大。
4、ECSHOP
ECShop是Comsenz公司推出的一款B2C獨立網店系統,適合企業及個人快速構建個性化網上商店。系統是基於PHP語言及MYSQL數據庫構架開發的跨平臺開源程序。
5、DeDecms文章管理系統
織夢CMS是免費開源內容管理系統,DedeCMS適合應用的領域非常廣泛,如企業網站、政府機關、教育機構、媒體機構、行業網站等,像大家比較熟悉的站長之家,A5站長網都有是有織夢DeDecms。
6、Z-blog博客程序
Z-Blog是一款小巧而強大的基於Asp平臺的Blog程序,適用於內容相對比較少的個人博客,各方面還是相當不錯的。
7、EasyTalk微博客
EasyTalk是國內首款多用戶PHP+Mysql開源微博系統、微博軟件,類似新浪微博、騰訊微博的微博程序。目前微博火熱的背後興起的另外一種程序,簡單易用。
8、Gregarius
Gregarius是一個RSS聚合程序,免費開源,具備不錯的用戶體驗,易於操作和管理。可以把其當成RSS閱讀器使用。同樣不是很熟悉RSS聚合程序,Gregarius是一款RSS/RDF/ATOM的Feed的聚合程序,如果你很閒,那就使用Gregarius代替Google Reader去閱讀朋友們的博客。
9、UChome SNS程序
UCenter Home是一套採用PHP+MYSQL構建的社會化網絡軟件(Social Network Software,簡稱SNS),同時可以和UC數據互通等,比較早期的一款SNS程序,也是比較經典的一款程序。
綜合以上信息,我選擇了 wordpress 進行網站的構建,原因如下:
- 構建步驟簡單,後臺管理輕鬆,新手容易理解
- 主題種類多,可以構建不同風格的網站,插件支持穩定,可拓展性強
- 安全性高,程序的不斷升級,WordPress已經到了非常完美的階段
五、網站的構建
1、綁定域名到網站根目錄
(1)登錄雲服務器,進到OneinStack安裝目錄下,運行命令
- ./vhost.sh
按照下圖進行配置:
2、安裝wordpress
(1)進入域名目錄
- # cd /data/wwwroot/www.youdomain.com/
或者OneinStack默認目錄
- # cd /data/wwwroot/default/
(2)下載Wordpress
(3)解壓
- # tar xzf wordpress-4.7-zh_CN.tar.gz
(4)建立數據庫,用瀏覽器打開你的公網IP,點擊phpMyAdmin,用之前記錄的root賬號密碼登錄數據庫
點擊 New 新建數據庫
- 數據庫名 wordpress
- 字符集選 utf8mb4_unicode_ci
(5)用瀏覽器打開你的公網IP,在地址後添加 /wordprss 訪問,比如:http://19.99.67.78/wordpress/
訪問後會顯示以下界面,點擊 現在就開始!
會提示無法創建 wp-config.php 文件,這時 全選 - 複製
在終端進入wordpress目錄,這裏以默認目錄爲例
- # cd /data/wwwroot/default/wordpress/
然後用 vi 創建 wp-config.php
- # vi wp-config.php
在 vi 中,按字母 i 進入編輯模式,複製進之前粘貼板中的內容
然後按 ESC,然後輸入 :wq 保存退出
(6)再回到瀏覽器中,進入下一步,設置wordpress 用戶名 和 密碼
(7)安裝成功,進行登錄,進入wordpress後臺
3、安裝插件
(1)安裝WP Editor.md,開啓,即可使用markdown語法編輯文章
(2)安裝WP-PostViews,開啓,即可統計每篇文章的瀏覽數量
(3)安裝Download Monitor,開啓,即可用來在我的站點管理下載文件,監控下載以及輸出下載鏈接和文件信息
4、網站詳細構建
(1)去掉域名中的 /wordpress
使用putty登錄服務器,進入網站根目錄下的wordpress文件下,運行命令
- # cp index.php ..
- # cd ..
- # vi index.php
將
require(dirname( __FILE__ ).'/wp-blog-header.php');
改爲
require('./wordpress/wp-blog-header.php')
按ESC鍵,運行命令
- # :wq
進入工具欄->設置->常規,去掉站點地址的 /wordpress,即可完成去掉訪問域名中的 /wordpress
(2)選擇喜歡的主題,進行安裝,我選擇了 Blogghiamo 主題
(3)在工具欄->外觀->自定義中,修改站點標題、副標題、圖標
(4)在工具欄->外觀->菜單中,創建頁眉顯示的菜單,並對每一項進行編輯
(5)在工具欄->外觀->背景中,設置背景圖像
(6)鏈接功能默認關閉,在工具欄->外觀->編輯->functions.php的最下面添加代碼開啓,就可以添加友情鏈接了
add_filter('pre_option_link_manager_enabled','__return_true');
(7)在工具欄->外觀->小工具中,拖拽選擇會用到的小工具
(8)在工具欄->外觀->編輯->footer.php中,添加作者、備案號
(9)設置首頁只顯示文章概要,在工具欄->外觀->編輯->content.php中,加入代碼
<?php if ( !is_single() ) : ?>
<?php the_excerpt(); ?>
<?php else: ?>
<?php the_content(_('(more...)')); ?>
<?php endif; ?>
如下圖所示:
六、百度站長工具的使用
1、網站驗證
(1)地址:http://zhanzhang.baidu.com/site/siteadd
登錄後,選擇我的網站->站點管理,然後輸入網站,選擇站點屬性,最後進行驗證
(2)爲了方便,我選擇了第三種驗證方式
具體解析如下圖:
(3)解析完成後,回到站點管理界面,點擊完成驗證
(4)開始網站的收錄,一般需要10天左右,百度收錄網站後,可以通過在瀏覽器輸入 site:域名,查看是否成功收錄
2、添加百度分享
(1)點擊百度分享->免費獲取代碼,自定義分享的樣式,然後獲取代碼
(2)在工具欄->外觀->編輯->header.php的最下面,添加獲取到的腳本代碼
<script>
window._bd_share_config={"common":{"bdSnsKey":{},"bdText":"","bdMini":"2","bdMiniList":false,"bdPic":"","bdStyle":"0","bdSize":"16"},"slide":{"type":"slide","bdImg":"0","bdPos":"right","bdTop":"130"},"image":{"viewList":["weixin","sqq","qzone","tqq","tsina","renren","fbook","tieba"],"viewText":"分享到:","viewSize":"24"},"selectShare":{"bdContainerClass":null,"bdSelectMiniList":["weixin","sqq","qzone","tqq","tsina","renren","fbook","tieba"]}};with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)];
</script>
3、添加百度統計
(1)點擊百度統計,登錄第一個百度統計-網站統計
(2)然後點擊管理->新增網站
(3)完成後,點擊獲取代碼,然後複製代碼
(4)在工具欄->外觀->編輯->footer.php的最下面,添加獲取到的腳本代碼
<script>
var _hmt = _hmt || [];
(function() {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?eea9bc0fc306bb45322edda631d1285d";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script>
(5)點擊代碼安裝檢查,如果提示代碼安裝正確,就證明成功了
(6)最後就可以在報告界面中,看到網站的統計信息,比如訪問流量、來源等