The {deck} macro, when used with the {card} macro creates a tabbed panel which is ideal for separating out blocks of related content.
The {deck} macro is the outer wrapper which defines the general properties of any tabs such as their graphical style, location (above or below the deck) and a unique ID that's used to remember which card you have selected for when you return to the page.
The tabs are each defined by the card macro which provides card specific settings such as the text that appears in the tab and it's access key (also known as a keyboard shortcut).
This tutorial is primarily concerned with the {deck} macro and there is a related tutorial on the card macro.
The {deck} macro parameters that define the position of the tabs and the CSS class used to define how they look.
Either 'top', 'bottom' or 'none'. Defaults to 'top'.
class
The custom CSS class the deck is decorated by.
This plug-in is available without cost for both commercial and non-commercial purposes. However, if you have found it to be useful, particularly within a commercial environment, please consider making a donation to the author. This will encourage continued development of this and other plug-ins, as well as speeding up the response for your latest maintenance request.
If you wish to donate, it can be done easily with a credit card or bank transfer using Paymate. No account sign-up is required for credit card payments.
This macro is compatible with Confluence 1.3.x, 1.4.x and 2.x. It has been tested by Adaptavist with Confluence 1.4.1, 1.4.3 and 1.4.4. It has been tested by David Peterson with Confluence 2.0.
Adaptavist maintain a JIRA Project for tracking bug reports and feature requests for this macro. The currently reported items are shown below:
jiraissues: Could not download[ http://jira.adaptavist.com/secure/IssueNavigator.jspa?view=rss&pid=10036&component=10101&statusIds=1&statusIds=3&statusIds=4&statusIds=5&sorter/field=updated&sorter/order=DESC&tempMax=25&reset=true&decorator=none] : caused by : Circular redirect to 'http://jira.adaptavist.com:80/secure/IssueNavigator.jspa'
The deck of cards below, that contains our examples, uses the default Confluence tabs theme. Example three shows how to use alternate themes.
Basic Usage
At its most basic level you can simply give the deck an ID and add some cards
{deck:id=myDeck}
{card:label=tab1}
This is the first tab's content
{card}
{card:label=tab2}
This is the second tab's content
{card}
{deck}
Which produces the following output:
This is the first tab's content
This is the second tab's content
Changing the position of the tabs
There may be times when you want the tabs to be displayed at the bottom of the tabbed area, you can set this using the tablocation parameter
{deck:id=myDeck1|tablocation=bottom}
{card:label=tab1}
This is the first tab's content
{card}
{card:label=tab2}
This is the second tab's content
{card}
{deck}
Which looks like this:
This is the first tab's content
This is the second tab's content
Deck Style
The deck and macro can be styled if required using the graphics and style sheets available here: Styling deck and card macros. Please note that the graphics and style sheets are provided on an "as is" basis without support.
To set the class on the deck, use the "class" parameter:
{deck:id=myDeck2|class=aqua}
{card:label=tab1}
This is the first tab's content
{card}
{card:label=tab2}
This is the second tab's content
{card}
{deck}
Hints and Tips
Only use these macros where they are really needed as they can sometimes make a web page look a little cluttered.
When using these macros, remember that printouts will only include whichever card (ie. tab) is selected within each deck on a page.
Try not to nest decks of cards within each other (as seen in our examples). While it can be tempting to have a deck of sections with each section containing a deck of topics and each topic containing a deck of sub-topics, it can be very confusing for the end user if they are presented with such a structure - it's easy to loose track of where you are in relation to the other content. Instead, you should consider using the cloak macro for the inner content.
With regards to the issue with the gallery macro, it's probably best to contact the author over at http://www.randombits.org. It's likely that the gallery macro isn't compatible with the deck/card macros and that RandomBits (where the deck/card macros come from) and Atlassian (who make the gallery macro) would need to work together to resolve the issue.
As for setting the width, there was a recent upgrade to the macros which I believe has a new width parameter.
I found a bug in that if linking to attachments on the page, that the cards after the link will not display their content. The card with the links, will display properly however. So if the links are on the first card, the second will not display.
i'm probably breaking any number of GUI standards, but if I build a deck of 26 cards - A-Z it ends up being too wide. any idea if you can have two rows of cards? Or other suggestions on how to handle a large number of cards?
Have you by chance tested this macro with Confluence 2.7.1, or do you know if it should have problems with this version? We're upgrading and so far it doesn't seem to work on this version.
I'd like to add a different image to each of my tabs. Example 3 mentions the fact that you can, but doesn't expound further. Any advice on how I can add images to tabs (and control/suppress the mouseover colors)?
I need help. We are developping our own Dashboard (rerouting to it) and we'd like to use the card/deck macro to display the following:
Tab1 = Favorite Spaces (this tab would display two columns, one with favorite spaces and one with the recently updated favorite spaces)
Tab2 = Favorite Pages (this tab would display two columns, one with favorite pages and one with recently updated favorite pages)
Tab3 = ALL (This tab would display two columns, one with ALL spaces and one with ALL recently updated)
Tab4 = Most accessed or used pages (not sure how we are going to do this one yet).
Anyway...
I am trying to use the recently-updated macro, but I'm having an extremely difficult time getting it to do all 3 functions (display for ALL, for fav pages, and for fav spaces). The default Confluence Dashboard at least displayed two of these (the recently updated for all spaces and for favorite spaces). But I can't seem to duplicate it. Is there anyone who would know what parameters I need to use to do this? Please help!!!
How can I reference a card of the deck in the page link. I mean something like
[Page#myDeck.tab2].
I tryed to insert {anchor:refTab2} and reference like [Page#refTab2], but this is not working.
This isn't currently possible as far as we are aware. Please check with the plugin author over at http://www.randombits.org.
When I place a {gallery} onto a card the results are inconsistent. One one particular page the gallery was shoved over several hundred pixels.
Also, is there a way to define the width of the card/deck w/o having to wrap it in a {div} or {column}?
Much thanks! D. Kozlowski. America's Army.
With regards to the issue with the gallery macro, it's probably best to contact the author over at http://www.randombits.org. It's likely that the gallery macro isn't compatible with the deck/card macros and that RandomBits (where the deck/card macros come from) and Atlassian (who make the gallery macro) would need to work together to resolve the issue.
As for setting the width, there was a recent upgrade to the macros which I believe has a new width parameter.
I found a bug in that if linking to attachments on the page, that the cards after the link will not display their content. The card with the links, will display properly however. So if the links are on the first card, the second will not display.
Updated by yatin Umrotkar
Jul 05, 2007 22:21
ok
i'm probably breaking any number of GUI standards, but if I build a deck of 26 cards - A-Z it ends up being too wide. any idea if you can have two rows of cards? Or other suggestions on how to handle a large number of cards?
Hi,
Have you by chance tested this macro with Confluence 2.7.1, or do you know if it should have problems with this version? We're upgrading and so far it doesn't seem to work on this version.
Thanks,
Limor
You'll have to check with the plugin author - David Peterson at http://customware.net
I'd like to add a different image to each of my tabs. Example 3 mentions the fact that you can, but doesn't expound further. Any advice on how I can add images to tabs (and control/suppress the mouseover colors)?
Thanks,
Rob
You can customise the deck macro using CSS - some sample graphics and CSS is provided "as is" here: Styling deck and card macros.
Is it possible to link between tabs? For example, on tab 1 provide a link that, when clicked, displays tab 2 (or some anchor on tab 2)?
Updated by Alain Moran
Apr 04, 2008 13:14
Builder 3.0.2 now includes the aqua & tan styles ... to use them select the 'use deck/card styles' checkbox on the css tab.
can I add a tab for view and a tab for edit such that when I can click on view I can see the page and click on edit to edit the page???
I need help. We are developping our own Dashboard (rerouting to it) and we'd like to use the card/deck macro to display the following:
Tab1 = Favorite Spaces (this tab would display two columns, one with favorite spaces and one with the recently updated favorite spaces)
Tab2 = Favorite Pages (this tab would display two columns, one with favorite pages and one with recently updated favorite pages)
Tab3 = ALL (This tab would display two columns, one with ALL spaces and one with ALL recently updated)
Tab4 = Most accessed or used pages (not sure how we are going to do this one yet).
Anyway...
I am trying to use the recently-updated macro, but I'm having an extremely difficult time getting it to do all 3 functions (display for ALL, for fav pages, and for fav spaces). The default Confluence Dashboard at least displayed two of these (the recently updated for all spaces and for favorite spaces). But I can't seem to duplicate it. Is there anyone who would know what parameters I need to use to do this? Please help!!!
(We are using Themebuilder and Confluence v. 2.7)
Thanks,
Liz
Example: