目录 - Table of Contents

UBB 代码

Typecho-Plus 支持一些简易的UBB代码,不过不建议您过于依赖UBB,请尽量使用Markdown的语法。
因为与Markdown语法冲突,所以嵌套UBB时,记得一定要在两个UBB方括号之间添加一个空格
[bgcolor=black] [color=#fff]这样才能正确解析UBB互相嵌套的代码[/color] [/bgcolor]
这样才能正确解析UBB互相嵌套的代码

另外,Typecho-Plus 所生成的大部分元素都可以参考typechoplus.css,并通过插件目录下的 tpluscustom.css 来定义样式、进行美化!

块级代码

Typecho-Plus 的块级UBB代码拥有最高权限,因此会与Markdown的Code块相互作用,若是你想在Code代码块中显示块级别的UBB代码,请记得使用 \[ 来注释掉它。
目前 Typecho-Plus 只有 \[hide] \[notify] \[login] \[picbox] \[div] 这几个块级UBB,其他的UBB代码块不需要进行转义。
最好将块级代码放在行首,尽量不要与其他的内容放在一行:

下方示例的代码使用了自定义类名,我采用Typecho的魔术方法将Style插入到了文章内:
!!!
<style>
.ClassName1 {text-shadow: 3px 3px #CCC}
.ClassName2 {font-style: italic}
.ClassName3 {text-decoration: line-through}
.ClassName4 {text-align: right}
.ClassName5 {border: 1px dotted #ccc}
</style>
!!!

隐藏内容

需要点击才会显示的内容,内部可以使用Markdown与UBB代码。
可接受2个参数:
参数1为自定义标题,标题中可以使用简单的HTML代码;
参数2为自定义类名。
[hide=可以自定义标题,<i>甚至可以使用HTML</i>,ClassName1]
内部的内容,支持 **Markdown** 与 [color=red]UBB[/color]
[/hide]
可以自定义标题,甚至可以使用HTML


通知、提醒

一个醒目的提示栏。
可接受2个参数:
参数1为自定义标题;
参数2为自定义类名。
[notify=通知标题,ClassName2]
内部同样支持 **Markdown** 与 [color=red]UBB[/color]
[/notify]
通知标题
内部同样支持 MarkdownUBB


权限浏览块

某段内容只有注册会员、且高于指定权限才可浏览。
可接受2个参数:
参数1为指定的权限,若为空则默认为4;
参数2为自定义类名。
[login=4,ClassName3]
内部同样支持 **Markdown** 与 [color=red]UBB[/color]
[/login]


权限参数可以是 0~4,权限0代表管理员,之后依次是编辑、贡献者、关注者、访问者
权限参数也可以直接写成文本形式:administrator\admin\editor\contributor\subscriber\visitor\user

图集

当发布大量图片时,只需要将图片链接按行发布即可,不需要填写繁琐的UBB和MD代码!
可接受3个参数:
参数1为图集的标题,支持简易的HTML语法;
参数2代表是否隐藏图集,输入1即可;
参数3为自定义类名。

如果出现了图集标题,则此图集会被一个边框包裹,并且可以通过点击标题来折叠。
如果没有出现标题,则此图集仅用作发布图片,不会有边框也无法被折叠。
如果隐藏了图集,只有用户点击了图集标题才会打开图集。
内部无效的文本会被忽略,但Typecho-Plus会智能识别Markdown与UBB的图片语法。
[picbox=图集标题 如果不填写则图集不会出现边框 也无法被折叠,1,ClassName4]
https://files.catbox.moe/igbtg3.jpg
https://files.catbox.moe/984goq.jpg
无效的内容会被忽略!!!

![](https://files.catbox.moe/ju5kf2.jpg)
[img]https://files.catbox.moe/gf0s7r.jpg[/img]
Markdown与UBB格式图片也可以被识别!

https://files.catbox.moe/e6h47o.jpg
[/picbox]
图集标题 如果不填写则图集不会出现边框 也无法被折叠

DIV 包装 new

v0.6.0 新添加的块级标签,用以提供更强大的自定义功能,语法为:
[div=ClassName5,一个可用标题 <i>支持简易HTML</i>]
内容可多行
可使用 **Markdown** 与 [red]UBB[/red]
[/div]

[div=ClassName5]
没有标题的内容
[/div]
一个可用标题 支持简易HTML
内容可多行
可使用 MarkdownUBB


没有标题的内容


为何要添加这个块级标签?
请参阅此教程 https://blog.clso.fun/posts/2021-02-01/typecho-plus-div-span-wrap.html
更多预设风格 https://blog.clso.fun/posts/2021-02-01/typecho-plus-div-span-wrap.html?page=2

行级代码

这类代码实现功能太过繁杂,我就不一一介绍了,只给出示例。

位置

[center]居中文本[/center]
居中文本

[right]居右文本[/right]
居右文本

[align=right]另一种写法[/align]
另一种写法

URL

[url]URL地址[/url]
[url=URL地址]说明文本[/url]
[url=URL地址,blank]新窗体打开链接,不需要加 _ [/url]
[url=URL地址,blank,nofollow noopener]指定rel属性[/url]

安全链接可以在设置中指定检测地址,并自动应用 nofollow noopener 等属性
[safe]URL[/safe]
[safe=URL]说明文本[/safe]
CLSO.FUN
CLSO.FUN 安全模式

Download

[download=文件URL]文件名[/download]
[download=/usr/uploads/xxx.7z]downfile.7z[/download]
[download=/usr/uploads/xxx.7z]downfile[/download]
(若不想改变附件后缀,文件名可以省略后缀)
<A>标签添加一个download属性,并可以指定文件名!
因为 Typecho 的附件系统会改变文件名,所以可以用这个方法来让用户下载原本的文件名,而不是一串数字。
不过这个功能仅支持现代浏览器,IE全系列是无效的,并且无法跨域,仅支持当前域名下的文件!

点此下载 老司机.jpg

IMG

[img]url[/img]
[img=宽x高]url[/img]
[img=宽,高]url[/img]
宽与高不用加px

Pic

[pic=url]带描述文本的图片[/pic]
[pic=url,宽x高]带描述文本的图片[/pic]
[pic=url,宽,高]带描述文本的图片[/pic]
[pic]url[/pic] 如果忽略了URL参数,则描述文本即为URL
带描述文本的图片

颜色

[color=red]文本[/color]
[color=#ccc]文本[/color]
[yellow]文本[/yellow]
[color=red,#ccc]带背景色的文本[/color]
[red=#ccc]带背景色的文本[/red]
文本
文本
文本
带背景色的文本
带背景色的文本

颜色TAG支持 red|green|blue|white|purple|yellow|violet|brown|black|pink|orange|gold
v0.6.0 可设置第二个参数为背景色
[bgcolor=red]文本[/bgcolor]
[bgcolor=#ccc]文本[/bgcolor]
文本
文本

字体

[font=宋体,5,red]字体[/font]
[size=7]字体[/size]
[face=黑体]字体[/face]
字体
字体
字体

(注意,font标签已被淘汰,我在考虑是否应该升级此标签为span,风格也改换成CSS样式。) [?]

音频、视频

[audio=音量,播放速度,自动播放,重播]url[/audio]
[audio=0.3,1.5,1,1]url[/audio]
[mp3]url[/mp3]
[music]url[/music]

[video=音量,播放速度,自动播放,重播]url[/video]
[vod=0.25,1.5,1,1]url[/vod]
[movie]url[/movie]
[mov]url[/mov]

示例:音量25%,速度1.5倍,不自动播放,自动重播
[audio=0.25,1.5,,1]https://music.163.com/song/media/outer/url?id=353696[/audio]


自 v0.6.1 开始,Typecho-Plus 已能正确对媒体元素进行控制,同时也支持对HTML的媒体元素进行控制,方式为:
<audio src="src" volume="0.3" playbackrate="1.5" autoplay="true" loop="loop" width="400" height="280" />

注音

一段[ruby=zhù yīn]注音[/ruby]文字
一段注音zhù yīn文字
该功能兼容性其实不错,IE5都支持这个功能!

SPAN 包装 new

一个简易的[span=className]SPAN包装[/span]内容
一个简易的SPAN包装内容

请参阅上面的 DIV 包装,或者直接点击下方的教程:
https://blog.clso.fun/posts/2021-02-01/typecho-plus-div-span-wrap.html

下一页没了
下一页真的没了