Formatting toolbar

Plugin
168

I make a highly opinionated fork here :

https://github.com/linuxuser-gr/discourse-formatting-toolbar

It look like this and needs the maths plugin

image
image1737×217 14.9 KB

Is there a way to move some buttons to the cog menu ;

1 Like
169

The way to code the buttons in the cog menu is a bit different, you can take inspiration in my theme component : https://github.com/iunctis/md-composer-extras/blob/master/desktop/head_tag.html

Here is a button in the toolbar

api.onToolbarCreate(toolbar => {
    toolbar.addButton({
        id: "align_justify_button",
        group: "extras",
        icon: "align-justify",
        perform: e => e.applySurround('[wrap="justify"]\n', '\n[/wrap]', 'align_justify_text')
    });
});

Here is a button in the menu

api.addToolbarPopupMenuOptionsCallback(() => {
  return {
      action: "columns",
      icon: "columns",
      label: "columns_button"
  };
});

api.modifyClass("controller:composer", {
  actions: {
       columns() {
	  this.get("toolbarEvent").applySurround('[wrap="columns"]\n', '\n[/wrap]', "columns_text");
	}
  }
});
3 Likes
170

Yeah, TinyMCE WYSIWYG Editor is good option to work with. There are few other good providers as well. But I myself is familar to something old style of Wordpress, that’s why I would like to choose it.

171

Was wondering this plugin is available as Theme Component? Thanks

172

There is a theme component : GitHub - iunctis/md-composer-extras: Add some formatting option in your discourse forum

There are a few different options but it’s more or less the same idea

173

Yeah Thanks Steven, but I am missing a coloring optior for text on the theme component. Something that is more intuitive to use than BBCode ideally with a color picker and preselected text.

174

I don’t know if something like this is doable in a theme component to be honest. There is a branch in the theme component with a basic bbcode color option https://github.com/iunctis/md-composer-extras/tree/color

I have a very basic knowledge in coding so I’m not the one that could do a color picker. But I’d gladly take a pull request if someone wants to upgrade the plugin!

175

Oh I really like all these formatting options and I almost exclusively use floatr btw :wink:
where do I see this option as quoted?
in the classic theme there is no css option to add or disable buttons
and after installing I got this error:
/var/discourse# unexpectedly found “! template-lint-disable ~” when slicing source, but expected " template-lint-disable "

176

That error doesn’t come from that plugin, I guess. Because I got it too — it didn’t break anything, though. I reckon it comes from the core.

177

Tnx @Jagster I added this theme component

and ‘uninstalled’ the plugin and the error is now gone so…

178

Interesting :thinking: Because I don’t use it. Can there be some other plugin that uses same something?

Damn… I have to go and check out if I’ve forgotten that after I gave a try for it →

Aaaand back. I’ve had it but it is commented out. Can second rebuild be the trick here?

179

These options were deleted a few years ago, it broke with a newer version of Discourse. I don’t have the knowledge or the time to reimplant them sadly

Regarding your issue, you need to choose between the plugin or the theme component or it will break, they basically share the same code.

Uninstall the theme component if you want to try the plugin

Note that this plugin or theme component also breaks with plugin like the official Discourse bbcode

2 Likes
180

Maybe/perhaps time to change the top post informing of that and to disable the github link? Cause basically it does not work right.

It was a great idea (thank you), and wish it would be standard in Discourse, or supported as an add-on.

181

The plugin works, the mention of these options was deleted in the OP and I’ve added some warnings a while ago. No reason to edit anything and deactivate the plugin at the moment

1 Like
183

Awesome toolbar plugin! Was wondering if you could add bicolor bbcode for background color?

Another interesting idea is use of drop downs in the toolbar. This might be useful on mobile for example.

Also.wondering if there is a master list of bbcodes your plugin supports

Thanks

184

I guess I can add compatibility to it, The base of the code is available in this official plugin : discourse-bbcode-color/assets/javascripts/lib/discourse-markdown/bbcode-color.js at main · discourse/discourse-bbcode-color · GitHub

I’ll think about it. I probably won’t add a button tho :thinking:

I’ve added support for these bbcode :

color=
size=
small
floatl
floatr
floatc
left
center
right
justify

1 Like
185

Thank you very much. Yeah we don’t really need buttons for everything.
:beers::sunglasses::+1::sparkles: :discourse:

186

The support for the [bgcolor] bbcode has been added

1 Like
187

Hello! If text placed inside bbcode tags is have two new line in sequence, or new line and carriet in sequence:

[center]
text "\n\n" text
[/center]

[center]
text "\r\n" text
[/center]

then we have plain text with [center][/center] tags itself in posts.

But this way:

[center]
text "\n" text
[/center]

or this way:

[center]
text text
[/center]

bbcode is correct wrapped and i have centered text.

I was thinked what this is discourse restriction, but may be we can do something with this?