博客园首页页面设计

本人是博客园刚开通的小白,想在这讲一下,前几天博客园首页设计的心得(作为作为一个前端怎么可以不搞点花样来装饰下自己的博客园首页)

一、页面样式的修改

  

   在首页任意一处的样式都可以在这个“页面定制css”中进行覆盖修改。

   此外还可以对页首与页脚部分添加div等标签来修改样式,位置不符合预期的话,可以用自己学过的position定位等来修改部分位置的布局方式

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

  可以在页首html中引入需要的bootstrap等css文件,要使用jquery的话,那么就在页脚html代码中引入,当然引用的文件是以链接方式引入才行,如下图

  

  

  在我的首页你可以看到,我的轮播图使用的就是bootstrap的轮播图

 三、如何在主体内容的中加入样式

  博客园提供对页首与页脚代码的添加,但是没有提供对主体内容加入html代码的入口,这时候就要想一些小窍门门了,我想在主题内容中添加bootstrap的轮播图,我选择在在页首中通过jquery动态给主体内容div中添加html代码,这样就可以解决了,当然首先你要开通js权限(很快,提交请求后几个小时就一般能审核通过了),我的jquery如下

  

  效果如下:

扫描二维码关注公众号,回复: 5887616 查看本文章

  

四、侧边栏引入外部插件

  1、开通js权限

  2、百度搜索“博客园侧边栏插件”

  3、然后在侧边栏中贴入插件代码

  4、一般贴入代码,你在控制台中看不到侧边栏插件,但是会占一片空白的位置,你按F12查看控制台会看到报http的错误,你可以,将你复制的代码中的http改成https试一试,如果还是不行的话,那你还是再去找找其他插件吧,反正我是找了很多,然后就这个老鼠插件能用(插件代码中的http改https)

  5、如果你自己能用代码写出来那也是你的本事,可以忽略上面4条

  

猜你喜欢

转载自www.cnblogs.com/liuke123/p/10706087.html