Emlog 简码插件 (Shortcode)

简介

简码插件为 Emlog 提供了类似 WordPress 的简码功能，允许用户在文章中使用简单的标记来添加复杂内容和功能，无需编写 HTML 或 PHP 代码。

功能特点

• 易于使用：用户无需编程基础即可使用
• 丰富的内置简码：按钮、提示框、布局、选项卡等
• 编辑器集成：在文章编辑器中直接插入简码
• 自定义简码：管理员可以添加自定义简码
• 详细文档：提供完整的使用说明和示例

安装方法

1. 下载插件压缩包
2. 解压并将整个 shortcode 文件夹上传到 Emlog 的 content/plugins 目录
3. 登录到 Emlog 后台，进入"插件"页面，启用"简码(Shortcode)"插件

使用方法

基本语法

简码的基本语法如下：

• [tag] - 简单简码
• [tag attribute="value"] - 带属性的简码
• [tag attribute1="value1" attribute2="value2"] - 带多个属性的简码
• [tag]content[/tag] - 包含内容的简码

使用步骤

1. 在编辑文章时，点击编辑器工具栏中的"插入简码"按钮
2. 从下拉菜单中选择要使用的简码
3. 填写简码参数
4. 点击"插入简码"按钮将简码插入文章

内置简码示例

按钮简码

[button url="https://www.example.com" color="primary" size="md"]点击我[/button]

提示框简码

[alert type="info" dismissible="no"]这是一条提示信息[/alert]
[alert type="success" dismissible="no"]这是一条提示信息[/alert]

高亮文本简码

[highlight color="yellow"]重要文本[/highlight]

布局简码

[row]
    [column width="6"]左侧内容[/column]
    [column width="6"]右侧内容[/column]
[/row]

选项卡简码

[tabs id="mytabs"]
    [tab title="选项卡1"]选项卡1的内容[/tab]
    [tab title="选项卡2"]选项卡2的内容[/tab]
    [tab title="选项卡3"]选项卡3的内容[/tab]
[/tabs]

手风琴简码

[accordion id="myaccordion"]
    [accordion_item title="标题1" parent="myaccordion" open="yes"]内容1[/accordion_item]
    [accordion_item title="标题2" parent="myaccordion"]内容2[/accordion_item]
    [accordion_item title="标题3" parent="myaccordion"]内容3[/accordion_item]
[/accordion]

创建自定义简码

管理员可以通过以下步骤创建自定义简码：

1. 登录到 Emlog 后台
2. 点击左侧菜单栏中的"简码管理"
3. 在"添加自定义简码"部分填写相关信息
   • 简码标签：用于在文章中调用的标签名
   • 标题：简码在菜单中显示的名称
   • 描述：简码的简要描述
   • 分类：简码的分类
   • 包含内容：是否包含开始和结束标签
   • 简码属性：添加简码可以接受的参数
   • HTML模板：定义简码的输出内容
4. 点击"添加简码"按钮保存

HTML模板说明

在创建自定义简码时，您需要定义HTML模板来控制简码的输出。在HTML模板中：

• 使用 $content 变量表示简码包含的内容
• 使用属性名作为变量，如 $color, $size 等

示例

假设您想创建一个自定义卡片简码：

标签: mycard
属性:

• title: 卡片标题
• color: 卡片颜色

HTML模板:

<div class="card" style="border-color: $color;">
    <div class="card-header" style="background-color: $color; color: white;">
        $title
    </div>
    <div class="card-body">
        $content
    </div>
</div>

然后您可以在文章中这样使用：

[mycard title="我的卡片" color="#007bff"]卡片内容[/mycard]

文件结构

• shortcode.php - 插件主文件
• shortcode_callback.php - 插件回调函数文件
• shortcode_setting.php - 管理员后台设置页面
• shortcode_user.php - 用户后台功能页面
• shortcode_show.php - 前台展示页面
• assets/ - 资源文件夹
  • shortcode-admin.css - 后台CSS样式
  • shortcode-admin.js - 后台JavaScript
  • shortcode-front.css - 前台CSS样式
  • shortcode-front.js - 前台JavaScript
• preview.jpg - 插件图标

依赖

本插件依赖：

• Emlog Pro2.5.4+
• 现代浏览器 (Chrome, Firefox, Safari, Edge等)

注意事项

• 简码内容会根据当前主题样式进行渲染，可能在不同主题下显示效果略有不同
• 如果与其他插件发生冲突，请尝试调整插件加载顺序
• 建议在使用复杂简码前先在预览模式下查看效果

常见问题

Q: 为什么我插入的简码没有效果？
A: 请确保简码格式正确，并且插件已正确安装和激活。

Q: 简码会影响网站性能吗？
A: 本插件经过优化，对性能影响很小。

Q: 可以在页面和其他内容中使用简码吗？
A: 是的，任何支持内容编辑的地方都可以使用简码。

版本历史

• 1.0.0 (2025-03-02)：首次发布

作者信息

• 作者：属余

• 网站：

  https://www.emlog.net/author/index/858

  www.emlog.net

许可证

本插件采用

     许可证发布。