除了正在连载的「用 HappyFiles、Meta Box 和 Bricks 做自定义画廊与滑块」系列之外，作者还写了一个能输出指定文件夹所有子文件夹的代码片段。如果你想做一个自定义「下载区」，这个片段非常实用：所有可下载文件都可以在 WP 媒体库（Media）里管理，文档/图片变动、删除或新增时不需要手动更新页面。
片段包含的功能
- 图标生成
- 可选择带或不带 CSS 规则输出
- 自动按文件夹分组文件/图片
- 过滤器支持添加自定义链接
使用前提
基本上你只需要创建文件夹结构并上传文件。注意两点：
- 所有想包含的文件夹必须是同一个父文件夹的子文件夹；
- 父文件夹里面的文件不会被脚本包含——脚本只处理子文件夹！
一个可行的目录结构：
如上图，父文件夹里也有一些文件，但它们不会出现在输出里（见文章顶部效果图）。这一点要记住。
完整源代码
`<?php function get_happyfile_childFolders($parentSlug) { $happyfile_terms = get_terms([ “taxonomy” => HAPPYFILES_TAXONOMY, “hide_empty” => false, ]);
$parentID = false;
// GET THE ID OF THE PARENT FOLDER
foreach ($happyfile_terms as $term) {
if ($term->slug == $parentSlug || $term->name == $parentSlug || $term->term_id == $parentSlug) {
$parentID = $term->term_id;
}
}
if (!$parentID){
return false;
}
$folders = [];
foreach ($happyfile_terms as $term) {
if ($term->parent == $parentID) {
$term = json_decode(json_encode($term), true);
$folders[$term["slug"]] = $term;
}
}
return $folders;}
function outputFiles($folderSlug) { global $wpdb; $folders = get_happyfile_childFolders($folderSlug);
if (!$folders){
echo 'No Folder found, please check the passed Parameter!';
return;
}
echo '<div class="downloads">';
foreach ($folders as $folder) {
$files = $wpdb->get_results(
"SELECT * FROM {$wpdb->prefix}term_relationships WHERE term_taxonomy_id = {$folder["term_id"]}",
OBJECT
);
// ADD CUSTOM CONTENT TO THE SPECIFIED FOLDER (via Filter)
$customContent = [];
$customContent = apply_filters('foldersCustomContent', $customContent, $folder['name']);
echo '<div class="folder">';
echo '<div class="folder-heading">';
echo "<h2>{$folder["name"]}</h2>";
echo "</div>";
echo '<div class="folder-content">';
foreach ($files as $file) {
$url = wp_get_attachment_url($file->object_id);
$title = get_the_title($file->object_id);
echo '<div class="file">';
echo '<i class="ti-file"></i>';
echo "<a href='{$url}' target='_blank'>{$title}</a>";
echo "</div>";
}
// OUTPUT CUSTOM CONTENT AFTER HAPPY-FILES FILES:
if ( count($customContent) != 0 ) {
foreach ($customContent as $title=>$file) {
echo '<div class="file">';
echo '<i class="ti-file"></i>';
echo "<a href='{$file}' target='_blank'>{$title}</a>";
echo "</div>";
}
}
echo "</div></div>";
}
echo "</div>";}
function outputDefaultStyles() { ?>
`
使用方法
把上面的代码复制到子主题的 functions.php 或你用的代码执行工具里。
在 WordPress 创建页面并用 Bricks 打开，在 Bricks 里使用 Code 元素，有两种输出方式（带或不带 CSS）：
带 CSS 样式，这样调用：
outputDefaultStyles(); outputFiles( 'SLUG/NAME/ID' ); // pass the slug, name or ID of your happyfiles-parentfolder here
更新：现在传给
outputFiles()的参数可以是 HappyFiles 文件夹的 SLUG、NAME 或 ID 任意一种，如上注释所说。
不带 CSS 样式：省略第一个函数 outputDefaultStyles()，自己写 CSS 样式。当然你也可以用预置样式，直接在 outputDefaultStyles() 函数开头的 CSS 变量里改颜色输出。
怎么换图标
每个文件前面的图标可以手动替换：从 FontAwesome、Bootstrap Icons 等地方下载一个图标，把 SVG 内容做 URL 编码。可以用这个在线工具：https://yoksel.github.io/url-encoder/
拿到 URL 编码后的 SVG 后，替换源码里对应部分——具体位置在 outputDefaultStyles() 函数里 .file a:before { 这一行，找到 -webkit-mask-image: url( 开头的那行，把里面的内容换成你的图标即可。
用过滤器添加自定义内容
这个过滤器可以让你在任意子文件夹里添加自定义链接。
想要一整块都是自定义链接的 Section？因为过滤器是在遍历所有子文件夹时运行的，你需要创建一个空的子文件夹，就能得到只有自定义链接的区块。当然，你也可以往那个文件夹里放文件，自定义链接会和文件夹内容混排。
在代码块里这样调用过滤器：
`add_filter( ‘foldersCustomContent’, function( $links, $name ) {
// Here you can specify the foldername to which you want to add custom links.
if ( $name != 'THE_NAME_OF_THE_FOLDER_YOU_WANT_TO_ADD_SOMETHING' ) {
return $links;
}
$links['NAME OF THE LINK'] = 'https://example.com';
$links['NAME OF ANOTHER LINK'] = 'https://example.com';
return $links;}, 10, 2);`
这个过滤器回调里有两个变量可用：
$links：当前循环文件夹的链接数组。可以像示例那样往里加任意链接甚至外部文件。$name：目标文件夹的 NAME（不是 slug）——也就是你在 HappyFiles 里定义的显示名称。
这样，自定义链接就加进你的文件夹循环了。
局限
查询本身还有优化空间——用 wp_query 可以替代 $wpdb，不过作者目前没遇到性能问题。
小结
这绝对不是一篇新手文章，但如果你只是复制粘贴片段、只玩 CSS，新手也能跑起来。它不像页面构建器那么可视化，但干起活来很漂亮，而且能在任何网站上省下大量维护下载区的时间。反正文件总要上传，用这个片段就不用在各个位置反复添加上传内容——脚本全帮你处理了。