最近本人迷戀上了沒事寫寫博客,感覺寫博客挺好玩的。不僅可以記錄自己學習的知識,而且在幫助到別人同時自己也會十分開心。
那麼就從CSDN入手吧,因爲之前經常搜資料CSDN的博客文章,幫助我解決了很多實際問題,所以感覺是時候回報一下的時候了。
那麼對於絕大多數CSDN博客來說,你看到的界面,可能是這樣。
或者這樣
又或者這樣
上面三種是CSDN比較簡潔的界面,但是對於一個90後的小夥來說,我希望能別人一打開我的博客,給別人一種夠炫酷的界面。
爲什麼要一個好點的美觀點的界面?如果要我來說1:因爲寫博客是一件長期以往的事情,2:別人看到你的博客覺得眼前一亮,印象也會好點。
那麼最近我就看到一個新的博客界面。那我直接放圖,給大家看下。
大家覺得這個界面如何?
如何覺得好的,可以繼續往下看,不好的尼,可能你不是本文服務對象。那麼請點擊左上角的C博客。
上述界面如何做到的尼?當然不是我寫的。
各位小夥伴打開你的CSDN點擊寫博客,看到如下界面
點擊博客配置,選中這款最新的極客世界的博客皮膚就可以了。
可能有些人覺得我很嘍,這麼屁點東西也寫博客,當然不止這些,我對新皮膚也做了一些修改。
下面給大家展示修改效果。
我在右側欄目中增加了自己個人信息以及關注我的還有圖片。
我的CSDN博客地址:http://blog.csdn.net/qq_36305327。大家可以去感受下。
下面我將教大家如何做出這樣的效果。
那麼我以博主信息製作爲例,選中博客欄目,然後翻到頁面下面添加欄目。
直接填寫以下信息
那麼我把我的填寫信息寫出來:
標題:博主信息
內容:
<p><span style="font-size:13px; font-weight:bold">Name:</span> 邵傑子龍</p>
<br>
<p><span style="font-size:13px; font-weight:bold">Email:</span> [email protected]
</p>
<br>
<p><span style="font-size:13px; font-weight:bold">個人網站:</span> <a title="跳轉到我的個人網站" href="http://www.shaofee.com/" target="_blank" style="color:gray; font-size:13px">
http://www.shaofee.com/</a></p>
直接添加就可以了。但是記得修改成屬於自己的內容。
關注博主內容代碼:
<div class="blog_medal"><a href="http://blog.csdn.net/experts/rule.html"><img src=" https://img-blog.csdn.net/20170502104108516?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvcXFfMzYzMDUzMjc=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center " alt="img" class="medal_img"></a>
<br>
<br>
<div class="medal_c"><a href=""><img src=" https://img-blog.csdn.net/20170502104148439?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvcXFfMzYzMDUzMjc=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center " alt="img"></a>
<a href=""><img src=" https://img-blog.csdn.net/20170502104207971?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvcXFfMzYzMDUzMjc=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center " alt="img"></a></div>
<br>
<div class="attention"><a href="" id="span_add_follow"><i class="fa fa-plus"></i><span>加關注</span></a>
<a href=""><i class="fa fa-envelope-o"></i><span>發私信</span></a> </div>
<div class="contact"></div>
</div>
上述代碼圖片直接粘貼會顯示圖片空間出錯,爲什麼尼?因爲圖片要求是你自己博客裏面的圖片。本身CSDN沒有圖片空間這個功能,那麼我們可以通過創建一個空的博客上傳很多照片,然後保存於自己的草稿箱,最後獲得圖片地址就可以了。
本博客於我的多個博客網站均有轉載:
本人個人網站:http://www.shaofee.com/