Where does the common folder (for html) go in a plugin?

[JQ331]

I want to change some basic html in a plugin I am experimenting with (would be convenient to have all changes in a single plugin). This would be html that I would put in the header section of the theme customizer on the admin dashboard, if I were using that dashboard instead of a plugin.

In a theme, you would have just a direct folder labeled common, that would have the different files, such as header.html.

I know common stylesheets for a plugin can go in plugin/assets/stylesheets/common. Where would I put this header.html file in a plugin?

[merefield (Robert)]

What’s in your ‘html’?

Scripts would normally go in an initializer or be fired by an event in a component.

Calls to the plugin api would go in the initializer.

Changes to templates would probably be attached to a plugin connector (or if desperate only: override them in the templates folder)

You might also decorate or reopen widgets in the initializer.

You shouldn’t need to put ‘bare html’ anywhere, after all, what you are actually modifying is a web app, not a web page?

In any case there will no particular harm in running multiple plugins and TCs alongside each other …

[JQ331]

@merefield

You shouldn’t need to put ‘bare html’ anywhere

We put in new html all the time in themes and the customizer. I want to add this to my plugin (instead of a theme) so I have a single code-base.

Where do you put html in a plugin that, were you making a theme, you would put in the “header” in the common folder?

[merefield (Robert)]

There is no direct equivalent afaia

You don’t need one either.

Port over what you are trying to do.

[JQ331]

For CSS, the equivalent in a plugin is [plugin]/assets/stylesheets/common/[file.scss]

Matching this format, I’ve tried adding a file at [plugin]/assets/views/layouts/common/header.html, but it didn’t work (just doing views/header.html didn’t work either).

I can change the templates, but for simple html changes like we do in themes a simple html change in header.html (or the equivalent) would be nice. For example, where would you put the following in a plugin (that’s already doing complex server side stuff, hence the need for a plugin):

@dax

Select the common or desktop tab and then add your custom HTML to the header tab . Customizing on mobile can be complicated if you are a new to HTML/CSS, so I personally recommend that you change your header only on desktop to start.

As example you can start to add the HTML part of your menu in the header tab

 <div id="top-navbar">
   <span id="top-navbar-links">
     <a href="http://example.com">Home</a>
     <a href="http://example.com/about/">About</a>
     <a href="http://example.com/news/">News</a>
     <a href="http://example.com/products/">Products</a>
     <a href="http://blog.example.com/blog">Blog</a>
     <a href="http://forums.example.com/">Forums</a> 
   </span>
 </div>

[pfaffman (Jay Pfaffman)]

I find the differences in how to do stuff like that in a plugin vs in a theme confusing too. You could punt and use a theme component for that stuff, but it sounds like you’re looking for the best answer rather than the fast one. (though there are some advantages to having that stuff split out for separate maintenance)

I think you need to add a line to the plugin.rb that includes the file you want. What I do is clone a thing from the discourse github repo called all-the-plugins and grep there for an example.

[JQ331]

Cool. Thanks. Yes, I’ve been thinking that perhaps the situation is that indeed there is not currently a straightforward way to do html changes in a plugin like you would do in a theme–to make html changes you have to go into the templates/connectors in a plugin (not too complicated, but different than the simpler theme mindset of common/header.html).

I’ll take a look at plugin.rb and see if that is currently easier than just going the normal template/component route.

[pfaffman (Jay Pfaffman)]

See How to override a template.hbs from a plugin - #4 by tshenry. I think that’s the magic your looking for.

It’s not where I said, but you stick it in the assets tree with the right name. It’s impossible to understand until you get it and then it’s totally obvious.

Edit : Hey @JQ331. I just realized that I think I did what you want in s plugin yesterday, but I’m so bad at it I didn’t realize that’s what you’re looking for. See https://github.com/literatecomputing/discourse-max-topics-per-month. It’s very simple so there’s not much to get in the way of finding the example.