Example of simple inspector control affecting block?

[smlombardi]

The inspector control sample obviously displays all the controls in the inspector, and then gets the value of each and displays it in a list in the_content.

In reality, we’re not going to do this; we are going to display something like rich text and utilize the setting of one or more inspector controls to modify it. Is there an example of this?

For example, I have a DIV I want to style as an alert. I want a select control in the inspector controls that allows the user to select the type or alert (e.g. warning, info).

[Zac Gordon]

Those examples are meant to show how you can use each of the form controls.

If you want to have the form controls do specific things it would just be a matter of writing the custom JavaScript to do that.

For instance, if you want to modify the font-size you would hav the control get the value and save it to attributes. Then you could code out inline styles that apply those attribute values where needed.

Or if you want to have a drop down with a few options of how to style a DIV, you would do that with the controls as demoed in the examples. Then you could apply different classes depending on what attribute value was selected.

So I don’t think you will find examples of every thing you want to do specifically, but all the building blocks are there 👍

If you get stuck or are not sure how to do something specific, code up what you can and then throw the link in here and I’ll try to help you get unstuck 🙂

[Author]

Posts