玩转CSDN之自定义博客栏目
不得不说，CSDN在IT界仍是很是不错的， 不论是文章数量仍是质量，都很是不错，不少程序猿也在CSDN建了窝，那么如何把CSDN的主页设置的更加符合本身的口味，就是咱们今天要作的事。javascript
CSDN博客的栏目指的是这块内容：php
这里面，有的是CSDN博客自带的内容，好比我的资料、博客专栏等，还有些内容，咱们能够自定义，首先，咱们须要进入我的的博客首页，点击管理博客，并切换到博客栏目选项卡，这里，就是咱们修改自定义栏目的主战场了。html
自定义连接
咱们首先来看最简单的，增长一个栏目，并增长一些自定义的连接选项。java
首先，咱们点击添加栏目，如图： git
标题就是咱们自定义栏目的名字，随便取一个看的顺眼的名字便可。
下面的内容，才是咱们的重点，白话文咱们就不说了，你能够在内容中输入相似“公告”、“声明”、“通缉”、“悬赏”等等，不用任何修饰的白话文，这些东西， 相信小学毕业证书拿到的朋友应该都会。
那么如何输入带连接的内容呢？几个大字看见没！支持HTML格式！！！有了这几个字，还怕咱们有什么作不出吗?
OK。上连接：程序员
<a title="友情连接" href="http://www.hztalk.com/" target="_blank"><br>
聊科技 游戏 电影 美食 请访问 HZtalk
</a>
<br>
相信这些最基本的HTML语言，大部分开发者都应该看得懂，看不懂就不用继续往下看了。github
自定义带框框的连接
一样是一个连接，以下图的这个标题样式，是否是显得略高级点呢？微信
若是不写标题，那么默认就是一行文字，因此咱们给它增长一个系统的栏目才有的标题框markdown
注意，是红色框框里面的内容，不是红色的框框。。。app
<a title="友情连接" href="http://www.hztalk.com/" target="_blank"><br>
聊科技 游戏 电影 美食 请访问 HZtalk
</a>
<br>
<a title="Github" href="https://github.com/xuyisheng" target="_blank"><br>
<ul class="panel_head"><span>个人Github</span></ul><br>
欢迎Follow、Fork、Star
</a>
代码中把前面的内容代码一块儿贴了出来，让你们把结构更看的清楚一点。咱们只是加了一个
<ul class="panel_head">
而已。
贴图
高大上的边栏怎么能没有图片，惋惜的是，CSDN不容许引用站外图片。。。
因此，咱们只能寄但愿于CSDN本身的相册中的图片，可是。。。CSDN的相册隐藏的如此之好，以致于咱们只能经过源代码来找到它的位置。。。因此，这里仍是直接告诉你们吧：
点击进入个人CSDN首页——把鼠标放到个人收藏旁边的下拉箭头上——个人相册出来了，不知道这是怎么设计出来的，太反人类了。当咱们把图片上传到相册中后，就可使用相册中的图片了。选中图片，右键选择，在新窗口中打开图片，就得到了图片的地址，有了站内的图片，引用就很是简单了。
<ul class="panel_head"><span>个人微信公众号</span></ul>
<ul class="panel_body">
为你推荐最新的博文~更有惊喜等着你
<img style="width:95%;" src="https://img-my.csdn.net/uploads/201503/15/1426428496_7596.jpg">
</ul>
效果就是这样：
若是你想居中的话：
<center><img src='imgurl'></center>
其实这些都是最基本的HTML语句，我这样的半吊子Web开发者都能写。相信大半吊子的程序猿应该能够用HTML写出更好的内容。
Flash
添加Flash与使用图片几乎没有太大差异：
例如咱们要显示凯子哥页面上的这个动画效果：
咱们能够这样：
<div id="custom_column_28798789" class="panel">
<ul class="panel_head"><span>我的说明</span></ul>
<ul class="panel_body">
<div height="120" width="150" align="center"><embed height="120" width="150" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" src="http://chabudai.sakura.ne.jp/blogparts/honehoneclock/honehone_clock_wh.swf" quality="high" autostart="1" wmode="transparent"></div>
仍是那句话，都是HTML。
新浪微博
新浪微博也是程序员交（zhuang）流（bi）的好东西，因此，这里咱们再来配置下新浪微博，可是，这个东西咱们很差直接用HTML来作，毕竟写上去毕竟难看，不信邪你能够试试。
那么咱们怎么作呢？首先，咱们须要帮助。。。
打开微博工具，直接给地址：戳我戳我
上面都是广告，咱们要的是下面。
看见没，多么贴心，还给咱们准备好了复制。
咱们把这个代码直接复制到栏目中：
<iframe width="100%" height="550" class="share_self" frameborder="0" scrolling="no" src="http://widget.weibo.com/weiboshow/index.php?language=&width=0&height=550&fansRow=2&ptype=1&speed=0&skin=1&isTitle=1&noborder=1&isWeibo=1&isFans=1&uid=1904977584&verifier=05864e99&dpc=1"></iframe>
OK，微博已经自动获取了，不信能够贴上上面的代码，给我宣传宣传，thanks。
是否是so easy：
邮我
像QQ邮箱这样的鹅厂产品，大多都会带有一些社交类的元素，咱们一样能够在页面中设置这样的信息，好比给我发邮件：
点击后，会跳到这样一个界面：
点击开发平台，你也可使用这样的功能，跟使用微博同样，咱们可让它自动生成咱们须要的样式，一键获取代码：
真的是so easy。
固然要注意，代码中会带有站外的图片，你一样须要传到本身的CSDN相册。
HTML代码示例
除了咱们上面列举的这些经常使用的设置，下面咱们再从网上拔一些经常使用的代码来，供你们参考：
贴图：<img src="图片地址">
加入链接：<a href="所要链接的相关地址">写上你想写的字</a>
贴图：<img src="图片地址">
加入链接：<a href="所要链接的相关地址">写上你想写的字</a>
在新窗口打开链接：<a href="相关地址" target="_blank">写上要写的字</a>
消除链接的下划线在新窗口打开链接：
<a href="相关地址" style="text-decoration:none" target="_blank">写上你想写的字</a>
移动字体(走马灯)：<marquee>写上你想写的字</marquee>
字体加粗：<b>写上你想写的字</b>
字体斜体：<i>写上你想写的字</i>
字体下划线: <u>写上你想写的字</u>
字体删除线: <s>写上你想写的字</s>
字体加大: <big>写上你想写的字</big>
字体控制大小：<h1>写上你想写的字</h1> (其中字体大小可从h1-h5,h1最大，h5最小)
更改字体颜色：<font color="#value">写上你想写的字</font>(其中value值在000000与ffffff(16位进制)之间
消除链接的下划线：<a href="相关地址" style="text-decoration:none">写上你想写的字</a>
贴音乐：<embed src=音乐地址 width=300 height=45 type=audio/mpeg autostart="false">
贴flash: <embed src="flash地址" width="宽度" height="高度">
贴影视文件：<img dynsrc="文件地址" width="宽度" height="高度" start=mouseover>
换行：<br>
段落：<p>段落</p>
原始文字样式：<pre>正文</pre>
换帖子背景：<body background="背景图片地址">
固定帖子背景不随滚动条滚动：<body background="背景图片地址" body bgproperties=fixed>
定制帖子背景颜色：<body bgcolor="#value">(value值见10)
帖子背景音乐：<bgsound="背景音乐地址" loop=infinite>
贴网页：<iframe src="相关地址" width="宽度" height="高度"></iframe>
以上，基本能够玩转了。
能够看出，自定义CSDN的博客栏目，无非就是HTML!!!因此，包括但不限于上面的HTML，均可以设置咱们的博客栏目。OK，点到即止，赶忙去自定义吧。
- 1. CSDN：玩转CSDN栏目管理——CSDN栏目中自定义个性化栏目最强攻略
- 2. CSDN自定义栏目代码
- 3. CSDN 自定义专栏
- 4. 博客园（自定义导航栏）
- 5. 关于博客自定义栏目下线的公告
- 6. 自定义博客样式
- 7. 查看csdn收藏的博客并给博客添加自定义标签
- 8. csdn博客栏目添加微博关注
- 9. 玩转dnmp之自定义PHP容器
- 10. 玩转dnmp之自定义容器
- 更多相关文章...
- • 自定义TypeHandler - MyBatis教程
- • MySQL自定义函数（CREATE FUNCTION） - MySQL教程
- • RxJava操作符（十）自定义操作符
- • 互联网组织的未来：剖析GitHub员工的任性之源
-
每一个你不满意的现在，都有一个你没有努力的曾经。
- 1. CSDN：玩转CSDN栏目管理——CSDN栏目中自定义个性化栏目最强攻略
- 2. CSDN自定义栏目代码
- 3. CSDN 自定义专栏
- 4. 博客园（自定义导航栏）
- 5. 关于博客自定义栏目下线的公告
- 6. 自定义博客样式
- 7. 查看csdn收藏的博客并给博客添加自定义标签
- 8. csdn博客栏目添加微博关注
- 9. 玩转dnmp之自定义PHP容器
- 10. 玩转dnmp之自定义容器