@baris said in Upgrade - nodebb-widget-rss:

I'm not sure if you need to restart after saving in the acp page.

Well, you have to 😄 Working now, thanks

Hi everybody 🌴

Today I show you how to make a sticky brand header and avatars in Harmony.

preview

Step-by-step

We need modify 6 files: library.js, harmony.json, theme.tpl, harmony.tpl, brand.tpl, post.tpl to add 3 new settings:

Sticky avatars (user avatars in the posts) Sticky header (brand header) Setting to show sticky header on mobile devices

First we add a new settings in library.js

Paste this code after this line stickyAvatars: 'on', stickyHeader: 'off', stickyHeaderMobile: 'off', Paste this code after this line config.stickyAvatars = config.stickyAvatars === 'on'; config.stickyHeader = config.stickyHeader === 'on'; config.stickyHeaderMobile = config.stickyHeaderMobile === 'on';

Now we need add translation for the new settings in harmony.json

Paste this code after this line "settings.stickyAvatars": "Sticky user avatars in posts", "settings.stickyHeader": "Sticky header on desktop", "settings.stickyHeaderMobile": "Show sticky header on mobile",

Next step, create controls of new settings in ACP and user profile in harmony.tpl and theme.tpl

Paste this code after this line in harmony.tpl <div class="form-check form-switch"> <input type="checkbox" class="form-check-input" id="stickyAvatars" name="stickyAvatars" /> <label for="stickyAvatars" class="form-check-label">settings.stickyAvatars</label> </div> <div class="form-check form-switch"> <input type="checkbox" class="form-check-input" id="stickyHeader" name="stickyHeader" /> <label for="stickyHeader" class="form-check-label">settings.stickyHeader</label> </div> <div class="form-check form-switch"> <input type="checkbox" class="form-check-input" id="stickyHeaderMobile" name="stickyHeaderMobile" /> <label for="stickyHeaderMobile" class="form-check-label">settings.stickyHeaderMobile</label> </div> Paste this code after this line in theme.tpl <div class="form-check mb-3"> <input class="form-check-input" type="checkbox" id="stickyAvatars" name="stickyAvatars" {{{ if config.theme.stickyAvatars }}}checked{{{ end }}}> <label class="form-check-label" for="stickyAvatars">settings.stickyAvatars</label> </div> <div class="form-check mb-3"> <input class="form-check-input" type="checkbox" id="stickyHeader" name="stickyHeader" {{{ if config.theme.stickyHeader }}}checked{{{ end }}}> <label class="form-check-label" for="stickyHeader">settings.stickyHeader</label> </div> <div class="form-check mb-3"> <input class="form-check-input" type="checkbox" id="stickyHeaderMobile" name="stickyHeaderMobile" {{{ if config.theme.stickyHeaderMobile }}}checked{{{ end }}}> <label class="form-check-label" for="stickyHeaderMobile">settings.stickyHeaderMobile</label> </div>

The finally we modify a theme files post.tpl and brand.tpl

Replace the code in this line with a new code in post.tpl <div class="icon py-1 bg-body d-none d-sm-block {{{ if config.theme.stickyAvatars }}}position-sticky{{{end}}}" {{{ if config.theme.stickyAvatars }}}style="top:7.5rem;"{{{end}}}> Replace the code in this line with a new code in brand.tpl <div class="container px-md-4 brand-container {{{ if config.theme.stickyHeaderMobile }}}sticky-top{{{end}}} {{{ if config.theme.stickyHeader }}}sticky-lg-top bg-body pt-3{{{end}}}" {{{ if config.theme.stickyHeader }}}style="margin-top:-1rem;"{{{end}}}>

/.nodebb build

🖖 Happy Dev

@Sebastián-Cisneros maybe you are missing this file in your composer-default plugin?

It was added in nodebb 3.4.0 https://github.com/NodeBB/NodeBB/issues/11949

So add that file into plugin.json of quill,

"composer/post-queue.js": "../nodebb-plugin-composer-default/static/lib/composer/post-queue.js",

@DownPW change 6M to 150M or 200M

@brazzerstop Hi 🙂 Thanks for your response. I think as long as teaser content is not parsed as post content there won't be a big chance. It's smiliar with images being shown as "50012345324-b88c-fe1233-343242fe.png". So maybe more related to recent cards plugin than to magic button plugin 🙂

@baris Awesome, thank you!

@tankerkiller125 I too opt for /recent as I prefer to see all activity rather than categories

This settings for widgets not work on /category and /recent page

Set the topic IDs you want to display this widget on (separated by commas) Set the category IDs you want to display this widget on (separated by commas)

Cat Typing GIF

For the data stored by this plugin you can get that info with the below calls.

await db.sortedSetCount(`tid:1:ratings`, 1, 1); await db.sortedSetCount(`tid:1:ratings`, 2, 2); await db.sortedSetCount(`tid:1:ratings`, 3, 3); await db.sortedSetCount(`tid:1:ratings`, 4, 4); await db.sortedSetCount(`tid:1:ratings`, 5, 5);

These will give the number of ratings given for each rating from 1 to 5

@baris Thank you! Now it's work ❤

@brazzerstop https://github.com/NodeBB/NodeBB/issues/11902