I'd completely overlooked that aspect of the request ... not using a button as a button would indeed be very strange.
As an alternative, in the short term, don't learn them. Have an AI write some for you so you can see how they work.
NOTE: The rest of this post relates to using AI to help solve a problem, and using it as a learning tool. Proceed at your own risk, though this macro does nothing risky and is fully tested.
Here's an example I cooked up with ChatGPT:
Download Macro(s): A Mostly AI Custom HTML prompt.kmmacros (7.6 KB)
Macro screenshot
Macro notes
- Macros are always disabled when imported into the Keyboard Maestro Editor.
- The user must ensure the macro is enabled.
- The user must also ensure the macro's parent macro-group is enabled.
System information
- macOS 15.7.3
- Keyboard Maestro v11.0.4
When run, you get an onscreen button selector that handles varying button name lengths, though it does so with same-sized buttons:
Click Accept, and the macro displays the state of each button (On or Off) in a Display Text action. So how did I have AI write this? I prompted ChatGPT with this:
The Prompt
β-β-β-β-β-β-β-β-β-β
I need a Custom HTML Prompt for Keyboard Maestro that accepts three variables from Keyboard Maestro as input:
local_button1
local_button2
local_button3
These buttons hold the name that should appear on each of three button-like objects. When the user clicks the button-like object, its shading should change to indicate it's selected. If it's clicked again, its shading should change back to the default.
The dialog will also accept a fourth variable, local_dialogText, that holds the text that will appear above the buttons.
At the bottom, a Cancel button dismisses the prompt without returning anything, and an Accept button returns the button states for the three buttons to Keyboard Maestroβif they've been clicked into an active state, they should return On, otherwise Off.
β-β-β-β-β-β-β-β-β-β
The first version didn't quite work, but was closeβthe button names were blank, which meant something was wrong with the variable names getting passed into the script. Pretending that I knew nothing of custom HTML prompts, I searched the Keyboard Maestro forums for topics related to passing variables to custom HTML prompts, and found this discussion, which included the right way to do it. I told ChatGPT the right method (the one line of JavaScript), and it revised the script. The prompt now worked fine, but the window sizing was wrong, and the button shading was wonky.
ChatGTP easily fixed the shading, but had no luck with the window sizing. So I used the Keyboard Maestro Wiki to look up the Custom HTML Prompt command, and found the section about how to specify the window size (this is also noted in the prior-linked discussion on variables). I added that one bit to the body tag, and that was that.
If you continue the conversation, you could probably get it to give you variable-width button names, etc. Would you understand 100% of what it had done? No, but you'd have the source code, and you could see that it's mostly HTML and CSS with a few key bits of Javascript that won't vary much from prompt to prompt if you're just using it to set and return variables. The code is probably far from perfect, but as a learning tool, it's nice to start with something that works as a baseline.
This took me about 10 or 15 minutes from start to finish, acting like I'd never used the Keyboard Maestro action before.
-rob.