Page Publishing

[denvergeeks]

页面发布的一种替代方法是使用 CSS 来删除常规主题帖子中不需要的元素，同时保留所有功能（例如，已安装主题组件中的 Javascript 和 CSS 样式等）。

作曲家中的标签可用于有选择地将格式应用于特定的主题帖子。

例如，在我的网站上，我通过将以下 CSS 粘贴到我的主题 CSS 的通用选项卡中来实现这一点：

/********************** 使用标签从布局中删除内容 **********************/

.tag-no-header {
    .d-header {
        display: none !important;
    }
    #post_1 nav.post-controls .actions button.edit {
    top: 0px !important;
    }
    .topic-body h1 {
        padding-top: 0 !important;
    }
}

.tag-no-sidebars {
    aside.sidebar {
        display: none !important;
    }
}

.tag-no-category {
    .topic-category {
        display: none !important;
    }
}

.tag-no-timeline {
    .topic-navigation {
        display:none !important;
    }
    .container.posts {
        grid-template-columns: 100% !important;
    }
    .topic-body {
    width: 100% !important;
    }
}

.tag-no-post-links {
    .post-links-container {
        display:none !important;
    }
}

.tag-no-box-shadow {
    .topic-body {
        width: 100% !important;
        border-top: none !important;
        box-shadow: none !important;
        background-color: unset !important;
    }
}

.tag-no-topic-meta-data {
    .topic-meta-data {
        display:none !important;
    }
}

.tag-no-side-margins {
    .wrap {
        max-width: unset !important;
        padding: 0 10px !important;
    }
    .content-wrapper {
        display: block !important;
    }
    #main-outlet-wrapper {
        width: 100% !important;
    }
    .topic-body {
        width: 100% !important;
    }
}

.tag-no-footer-buttons {
    #topic-footer-buttons {
        display: none !important;
    }
}

然后我创建标签，我可以有选择地应用于主题帖子，以匹配以上代码中的 CSS 选择器…

no-header
no-sidebars
no-category
no-timeline
no-post-links
no-box-shadow
no-topic-meta-data
no-side-margins
no-footer-buttons

---

所以这里是同一主题帖子的两个不同版本…

之前（未应用标签）：

之后（应用所有标签）- 我也可以将其作为 iframe 嵌入到我网站上的其他帖子中 :