Card

Free Macro

Screenshot

Description

A Bootstrap card has several sections that you can show or hide with the macro. See the following diagram:

Adding the Macro

Edit your page.

Select “+” => Other macros

Type in “Bootstrap” in the Search box

Select the “Bootstrap Card” macro

Macro Options

Header

Enter the header of your card. If you leave this empty, the header section will not be shown.

Header Level

Select the Confluence header level to be used for the card header.

Title

Enter the title of your card. If you leave this empty, the title section will not be shown.

Title Level

Select the Confluence header level to be used for the card title.

Subtitle

Enter the subtitle of your card. If you leave this empty, the subtitle section will not be shown.

Subtitle Level

Select the Confluence header level to be used for the card subtitle.

Width

Specify the width of your card in pixel or in percent of the parent object.

If you leave this empty, the card’s width will be adjusted to 99.6% of the parent object. If that is the page itself, it will stretch along the whole page width. The default is set a littler lower than 100% to avoid vertical scroll bars that might occur in Confluence page sections.

If you enter a pixel value here, e.g. 300px, the width of the parent object will not matter. The card’s width will be what you enter.

Float Left

The content on your page after the card will always be displayed below the card, even if you only set it to 300px for example. With this option enabled, the next content will be displayed on the right of it if the space available allows. Use this option if you want to place another card or some free text right next to it.

Style

Select one of the Bootstrap color styles.

Outline

The same styles are also available as outline cards.

Use Image

You can use an image in your card. It will be displayed at the top, underneath the Header. Allowed are image files of type GIF, JPG and PNG. You have to attach the image to the page first.

Switch this option on if you want to use an image in your card.

Image

Select the image from your attachments that you want to use in your card. It is recommended that you size your image according to the width of your card. If your card is 300px wide, make your image so as well.

Footer

Enter the footer of your card. If you leave this empty, the footer section will not be shown.

Body

This macro supports a body. The content that you place in the content will be displayed in the card as regular text. See diagram above to locate the body.

After you save the macro while editing the page, put any text or another macro in the body: