The Gravstrap Modal shortcode handles the Bootstrap Modal component. Here is a live example:

The carousel shortcode, shown above, is defined by the following definition:

[g-modal id="modal" name="modal" title="Awesome"]
Cras **mattis** consectetur purus sit amet fermentum.

[g-modal-buttons]
[g-button button_type="primary" button_label="Click Me" remove=true][/g-button]
[g-button button_label="Close Me" button_attributes="data-dismiss:modal"][/g-button]
[/g-modal-buttons]
[/g-modal]

Shortcode parameters

The [bootstrap-modal] shortcode has some optional parameters:

  • name - defines an unique component name.
  • title - defines the Carousel previous label.
  • attributes - defines extra attributes you can add to your shortcode. Attributes is a string of HTML key:value tokens, separated by commas. A valid attributes value is attributes=class:myclass, rel:my-rel".
  • close_button_attributes - defines the attributes for the close button. This property works exacly like the attributes one.

The [g-modal-buttons] does not have parameters and it is just a container for one or more buttons to modal content. In our example we added two buttons. You can get detailed information about the button shortcode in this document.

Next Post Previous Post