第一步：在后台建立多行文本扩展字段，然后填写内容。

第二步：在config中的：function.php中自定义一个函数。

function wenben_text($text)
{
    // 将 <br> 统一为分隔符，方便分割
    $parts = preg_split('/<br\s*\/?>/i', $text);

    $html = '<div class="wenben">' . PHP_EOL;

    foreach ($parts as $part) {
        $part = trim($part);
        if (empty($part)) continue;

        // 用 “：” 或 ":" 作为标题与内容的分界
        if (preg_match('/^(.*?[：:])(.*)$/u', $part, $matches)) {
            $title = trim($matches[1]);
            $desc = trim($matches[2]);
        } else {
            $title = '';
            $desc = $part;
        }

        $html .= '    <div class="wenben-list">' . PHP_EOL;
        $html .= '        <div class="name">' . htmlspecialchars($title) . '</div>' . PHP_EOL;
        $html .= '        <div class="desc">' . htmlspecialchars($desc) . '</div>' . PHP_EOL;
        $html .= '    </div>' . PHP_EOL;
    }

    $html .= '</div>' . PHP_EOL;

    return $html;
}

第三步：前端调用：

{content:ext_txts fun=wenben_text}

显示出来如图所示：

这看上去和直接用换行出来的效果没有什么区别。但是此时他是自带了div和CSS类的，我们只需要写一下CSS效果即可。

查看代码：

<div class="weiben">
    <div class="weiben-list">
        <div class="name">插件简介：</div>
        <div class="desc">可以有效地识别机器人行为并进行拦截。该插件支持自定义验证码样式和位置，</div>
    </div>
    <div class="weiben-list">
        <div class="name">验证码设置：</div>
        <div class="desc">该插件支持自定义验证码样式和位置，可以根据自己网站的风格和需求进行设置。在后台管理系统中，可以选择验证码字体、颜色、大小等参数，并且可以设置验证码出现的位置和触发方式。</div>
    </div>
    <div class="weiben-list">
        <div class="name">安装方法：</div>
        <div class="desc">包括图形验证码、滑动验证码、点选验证码等。可以根据网站的实际情况选择不同的验证方式，以提高验证的准确性和安全性。</div>
    </div>
</div>

第四步：写CSS样式就可以了。例如写一个简单的CSS样式：

<style>
.wenben{
	padding:15px;
	border:1px solid #ddd;
}

.wenben .wenben-list{
	 border-bottom:1px dashed #333;
	 margin-bottom: 15px;
	 padding-bottom: 15px;
}

.wenben .wenben-list .name{
	 font-size: 20px;
	 font-weight: bold;
	 margin-bottom: 15px;
}
.wenben .wenben-list .desc{
	 font-size: 16px;
	 line-height: 24px;
}

</style>