I know I can use copy and paste but I'd love to have button templates. Especially since I'm sure others have made far better ones than I have.
Once I've changed one, I'd like the change to cascade to all my buttons of that template.
I just logged on to make this feature request and realised I'd already done it?
Does no one else want this? Surely it's a pain to configure the way a button looks every time? The font size, the colours etc. I'd love to be able to save templates.
I am not sure and I have not tested it. But maybe you can do what you want with a "template preset" that you import when needed.
Do you know HTML/CSS? If so, you could create a class describing the style of your element and add it in ~/Library/Application Support/BetterTouchTool/NotchBar/BTTNotchBarUser.css
This class could then be applied to your elements and they would all change whenever you update the class.
But this is only feasible if you like to tinker with HTML/CSS and maybe a little JS
I can do html and css but no js.
Would there be a dropdown where I can select my class?
I think I'll give it a shot but if, say, I have five different class definitions, do you think you could add a dropdown menu that has each named? Easier to remember 
I'm editing the BTTNotchBarUser.css
I've copied it from
~/Library/Application Support/BetterTouchTool/NotchBar
into
~/Library/Application Support/BetterTouchTool/PresetBundles/
Do I need to delete it from the former?
My preset bundle contains nothing else. My settings are stored elsewhere?
My file
/Users/james/Library/Application Support/BetterTouchTool/PresetBundles/1004A42B-94CF-4C02-BD2D-267C8351E8A0BTT JV October 2021/BTTNotchBarUser.css
now reads
/* You can add custom css here */
.jvbutton1 .button {
background-color: rgba(0, 0, 0, 0.29);
background-size: auto;
border-style: solid;
border-width: 1px;
border-color: rgb(85, 85, 85);
border-radius: 3px;
color: rgb(255, 255, 255);
font-size: 8px;
height: 12px;
margin-bottom: 3px;
margin-left: 1.5px;
margin-right: 3px;
padding-bottom: 1px;
padding-left: 3px;
padding-right: 3px;
padding-top: 1px;
text-align: center;
}
and to Add Extra CSS class I've added
.jvbutton1
But my css doesn't seem to be getting picked up.
Do I need !important; or am I doing something else wrong?
The css file needs to stay there, these settings are not bound to a specific preset.
You can alway right-click the notch bar and choose "Inspect Element" to open the Safari Web Inspector.
Re CSS on the notch bar and having half BTT and the other half, native I'm running into problem with apps with lots of menu items: Photoshop, for instance.
I think the fix is to reduce the spacing between the menu items so that they will probably all fit before the notch.
I tried something like
.menubar-button {
left: 30px !important;
}
but obviously that's not relative to the other divs because this is what happened 
Any ideas what should try?
The menu items must be at the exact same position as they are on the original macOS menubar. This is a technical limitation and can not be changed.
Ah. Even if the font is reduced they'll still be in the same place?
Correct. That's because BTT basically just overlays the original menubar and if you click on a BTT menu bar item it will just "let the click through" and the original menubar will receive the click event.
Ahhhhh. Cool. Thanks.
Might be back to the drawing board re my system icons.