首次使用Umbraco：如何在公共访问文档页添加文件夹与PDF文件

嘿，刚上手Umbraco的话，在公共访问文档页搭建文件夹结构并上传PDF其实没那么复杂，我给你梳理一套落地的步骤，都是实战里常用的操作：

第一步：先确认文档类型的权限配置（关键前提） #

Umbraco的内容节点结构是由文档类型控制的，所以得先确保你的「公共访问文档页」允许创建文件夹子节点：

• 登录Umbraco后台，切换到 Settings 面板，找到 Document Types
• 找到你用来创建「公共访问文档页」的那个文档类型，点击编辑
• 切换到 Permissions 标签页，在「Allowed child node types」里添加「Folder」（如果没有现成的Folder文档类型，先新建一个：只需要设置名称为Folder，不需要额外属性，保存即可）
• 保存修改后的文档类型

第二步：创建文件夹与子文件夹 #

现在可以在内容树里搭建层级结构了：

• 切换到 Content 面板，找到你的「公共访问文档页」节点
• 右键点击它，选择 Create，然后从列表里选你刚才配置的Folder类型，输入文件夹名称（比如「产品手册」），点击保存
• 如果要创建子文件夹，右键点击刚建好的父文件夹，重复上面的操作：Create > Folder，输入子文件夹名称（比如「2024版」），保存即可

第三步：上传并关联PDF文件 #

这里有两种常用的方式，看你需求选：

方式一：用媒体库存储PDF，在文件夹节点关联 #

这种方式更规范，PDF统一存在媒体库方便管理：

1. 切换到 Media 面板，创建和内容树对应的文件夹结构（或者直接上传PDF到根目录），上传你的PDF文件
2. 回到Content面板，编辑你创建的文件夹节点，给这个Folder文档类型添加一个「文档链接」属性（类型选 Media Picker，允许选择PDF）
3. 编辑文件夹时，在「文档链接」里选择媒体库中对应的PDF，保存

方式二：创建独立的「文档」节点来承载PDF #

如果需要给每个PDF加额外信息（比如描述、发布日期），推荐这种：

1. 回到Settings > Document Types，新建一个「Document」文档类型，添加两个属性：
   • 一个 Textstring 类型的「文档标题」
   • 一个 Media Picker 类型的「PDF文件」，限制只允许选择PDF
2. 回到Content面板，在目标文件夹下右键选择 Create > Document，输入标题，选择对应的PDF文件，保存
3. 子文件夹下的PDF也用同样的方式添加

第四步：让前端渲染出文件夹和PDF链接 #

最后要在前端页面展示这些内容，用Umbraco的Razor视图来实现：
比如创建一个Partial View（_DocumentFolder.cshtml），用来递归渲染文件夹结构：

@model IPublishedContent

@foreach (var child in Model.Children.OrderBy(x => x.Name))
{
    if (child.DocumentTypeAlias == "folder")
    {
        <div class="document-folder">
            <h4>📁 @child.Name</h4>
            <div class="folder-content">
                @* 递归渲染子文件夹 *@
                @Html.Partial("_DocumentFolder", child)
            </div>
        </div>
    }
    else if (child.DocumentTypeAlias == "document")
    {
        var pdfFile = child.Value<IPublishedContent>("pdfFile");
        if (pdfFile != null)
        {
            <div class="document-item">
                <a href="@pdfFile.Url" target="_blank" rel="noopener noreferrer">
                    📄 @child.Value<string>("documentTitle")
                </a>
            </div>
        }
    }
}

然后在你的公共访问文档页的视图里引用这个Partial：

<div class="document-library">
    <h2>公共访问文档库</h2>
    @Html.Partial("_DocumentFolder", Model)
</div>

这样就能在前端看到层级清晰的文件夹和可点击的PDF链接啦！

内容的提问来源于stack exchange，提问作者User123