博客園首頁頁面設計


本人是博客園剛開通的小白,想在這講一下,前幾天博客園首頁設計的心得(作為作為一個前端怎么可以不搞點花樣來裝飾下自己的博客園首頁)

一、頁面樣式的修改

  

   在首頁任意一處的樣式都可以在這個“頁面定制css”中進行覆蓋修改。

   此外還可以對頁首與頁腳部分添加div等標簽來修改樣式,位置不符合預期的話,可以用自己學過的position定位等來修改部分位置的布局方式

二、引入bootstrap與jquery等外部文件

  可以在頁首html中引入需要的bootstrap等css文件,要使用jquery的話,那么就在頁腳html代碼中引入,當然引用的文件是以鏈接方式引入才行,如下圖

  

  

  在我的首頁你可以看到,我的輪播圖使用的就是bootstrap的輪播圖

 三、如何在主體內容的中加入樣式

  博客園提供對頁首與頁腳代碼的添加,但是沒有提供對主體內容加入html代碼的入口,這時候就要想一些小竅門門了,我想在主題內容中添加bootstrap的輪播圖,我選擇在在頁首中通過jquery動態給主體內容div中添加html代碼,這樣就可以解決了,當然首先你要開通js權限(很快,提交請求后幾個小時就一般能審核通過了),我的jquery如下

  

  效果如下:

  

四、側邊欄引入外部插件

  1、開通js權限

  2、百度搜索“博客園側邊欄插件”

  3、然后在側邊欄中貼入插件代碼

  4、一般貼入代碼,你在控制台中看不到側邊欄插件,但是會占一片空白的位置,你按F12查看控制台會看到報http的錯誤,你可以,將你復制的代碼中的http改成https試一試,如果還是不行的話,那你還是再去找找其他插件吧,反正我是找了很多,然后就這個老鼠插件能用(插件代碼中的http改https)

  5、如果你自己能用代碼寫出來那也是你的本事,可以忽略上面4條

  

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM