Description
A Badge looks much like a lozenge. You can define different styles and sizes and also combine it with an HTML heading or a Bootstrap button. The shortcode adds a <span> element. If you need an empty space before or after you need to addit manually.
Examples and Outputs
[bsv-badge style="danger"]New![/bsv-badge]
New!
[bsv-badge style="warning" displayas="button" buttonlink="https://www.lewe.com" target="_blank" prefix="Button"]1234[/bsv-badge]
[bsv-badge style="success" type="pill" displayas="h4" prefix="Button"]1234[/bsv-badge]
Button1234
Format
[bsv-badge parameter="value" ...]your content here[/bsv-badge]
Parameters
| Parameter | Description | Default |
|---|---|---|
| style | Defines the Bootstrap style. Supported values:
|
primary |
| type | Allowed values:
|
badge |
| displayas | The badge can be combined with a button or heading. Supported values:
|
no value |
| prefix | If combined with a button or heading, this will be the text of it.
This parameter only works in combination with a displayas value. |
no value |
| buttonstyle | If combined with a button, this defines the button style. Supported values:
This parameter only works in combination with a displayas value. |
primary |
| buttonlink | If combined with a button, the button can link to a URL. Define it here. | no value |
| target | If combined with a linked button, this defines the target of the link. | _self |
| customtextcolor | If you want to change the text color of the badge style you can do it here by proividng the hex color code in CSS format, e.g. #99000. | no value |
| custombgcolor | If you want to change the background color of the badge style you can do it here by proividng the hex color code in CSS format, e.g. #000099. | no value |