Beans HTML API Visual Hooks Guide

Posted 6 years, 8 months ago

Hey People,

So, while on my learning curve, I decided to create a plugin, get to know Beans more, and perhaps make something helpful...

Coming from Genesis, I always found the Genesis Visual Hooks Guide useful.

I found this in the forum from a while ago:

https://community.getbeans.io/discussion/what-about-a-visual-hook-guide/

I do agree with Thierry, this idea is somewhat redundant, everything we need is to be found in the inspector. But since I was already on my journey I completed the plugin. I have however tried to make it complimentary to development mode.

It only displays the possible action hooks that have been created by the HTML API markup, using the data-markup-id. These being:

{$markup_id}_before_markup
{$markup_id}_prepend_markup
{$markup_id}_append_markup
{$markup_id}_after_markup

It adds an admin toolbar dropdown that lets you display the hooks individually, choosing as many as you like. There is also a link to display all of the possible action hooks, which is a bit crazy, there's a lot of them, alongside a link to clear whatever hooks are showing, and a link to enable/disable the plugin functionality.

Plugin Github Link

https://github.com/JeffCleverley/Beans-HTML-API-Visual-Hook-Guide

Screenshots

(need to click on the link, then img icon to display the screenshot.)

I would've used Cloudup, but they are no longer accepting signups, so I had to fallback to my Amazon CloudDrive.

Toolbar https://www.amazon.com/clouddrive/share/phc3o9n7DFKoEnI5zcP92coT7oer5GzrJ6kts3zvUJ5

Show hooks selectively https://www.amazon.com/clouddrive/share/plAz21rHHozZ4AjsIxoJqyxA3Rfa71HlDP0tM4yj6Bg

Show All Possible hooks https://www.amazon.com/clouddrive/share/CeexRsCz9b6EsziTyd2IfyuMYHzRy1qktJHW9OFxp6u

All gets a bit crazy and confusing... Soooo many possible hooks https://www.amazon.com/clouddrive/share/ILePrtmxQDNVMdsXiAIFKK6DoOlvgOUBD73Z7MyEWK3

Any and all comments are welcomed.

Cheers

Jeff