This Theme Component for Discourse enables the author of a Topic to create a custom layout for any particular Topic by adding certain pre-defined tags which, when applied, selectively remove specific elements and sections of the layout for that Topic only.
Discussion and use-cases are described over on Meta: Create custom layouts for individual Topic Posts in Discourse
[This version includes settings for a Help Popup when the tag tag-layouts is applied. A clickable link will appear in the botton right corner of the composer text area which pops up a modal containing all of the available tags which can be used, and what they do. (The contents of the modal can be changed in the component's settings, but it defaults to https://denvergeeks.github.io/discourse-tag-layouts/.) Code from https://meta.discourse.org/t/composer-tip-under-specific-tag-topics/255618 was integrated into this theme component in order to provide this functionality. (The site setting characters required enabled should be un-checked or it will hide the Help Popup link, as it occupies that same space in the composer text area.)]
In your site's admin settings, search for tag and insure the following settings:
2) Secondly, you need to create 2 new Tag Groups so the Layout Tags will be hidden from (and won't needlessly clutter up) the Side Navigation Menu and the Tags Page:
For convenience, here is a link to an HTML page with just the tables.
I also use a plugin to provide a Help Popup inside the Composer: https://github.com/denvergeeks/discourse-plugin-composer-help-button
TAG (You must create the tags!) | HIDES/MODIFIES ELEMENT(S) |
---|---|
hide-all-but-topic-body |
[hides and modifies all of the below at once] |
hide-header |
.d-header |
hide-sidebar |
.sidebar-wrapper |
hide-topic-status |
.title-wrapper .topic-statuses |
hide-title |
#topic-title |
hide-avatar |
.topic-avatar |
hide-author |
.topic-meta-data.names |
hide-edits |
div.post-info.edits |
hide-post-date |
div.post-info.post-date |
hide-read-state |
.topic-body .read-state |
hide-category |
.topic-category |
hide-all-meta-data |
.topic-meta-data |
hide-timeline |
.topic-navigation.with-timeline |
hide-mobile-topic-progress |
div#topic-progress |
hide-topic-footer-buttons |
#topic-footer-buttons |
hide-topic-map |
div.topic-map |
hide-more-topics |
div.more-topics__container |
hide-more-content |
.more-content-wrapper |
hide-suggested-topics-message |
.suggested-topics-message |
hide-post-links |
.post-links-container |
hide-main-side-margins |
[adjusts columns and other widths] |
hide-post-menu-area |
.post-menu-area |
hide-reactions |
.discourse-reactions-actions |
hide-copy-link |
button.widget-button.btn-flat.post-action-menu__copy-link.no-text.btn-icon |
hide-like-button |
button.widget-button.btn-flat.button-count.like-count.highlight-action.regular-likes.btn-icon-text |
hide-flag-button |
button.widget-button.btn-flat.create-flag.no-text.btn-icon |
hide-bookmark-button |
button.widget-button.btn-flat.bookmark.with-reminder.no-text.btn-icon |
hide-reply-button |
button.widget-button.btn-flat.reply.create.fade-out.btn-icon-text |
hide-signup-cta |
.signup-cta |
hide-main-padding |
[removes all padding from #main-outlet] |
hide-topic-border-top |
[removes border-top from .topic-body] |
hide-topic-border-bottom |
[removes border-top from .topic-status-info, .topic-timer-info] |
hide-small-action-posts |
.small-action.onscreen-post |
TAG | HIDES/MODIFIES ELEMENT(S) - OTHER |
---|---|
hide-topic-bg-color |
[sets background-color: transparent on #main-outlet] |
TAG1 | TAG2 | SHOWS/MODIFIES ELEMENT(S) |
---|---|---|
hide-all-but-topic-body |
show-timeline |
[Hides Everything But TOC/Topic Timeline] |
? |
? |
[?] |
? |
? |
[?] |
Theme/Component/Plugin | TAG | HIDES/MODIFIES ELEMENT(S) |
---|---|---|
Elegant Theme | hide-topic-body-box-shadow |
[removes box-shadow from .topic-body in the Elegant Theme] |
Header Submenus | hide-header-submenus |
[removes Header Submenus Theme Component] |
Discourse Drawer | hide-drawer |
[removes Discourse Drawer Theme Component] |