Wiki source code of Navigation Block Macro

Last modified by Андрей Калиновский on 2022/05/16 17:07
Show last authors
1
2 This Macro displays a nice block with links under it. It is possible to add an image and a title in the block. This macro uses bootstrap so it is possible to pass [[bootstrap classes>>url:http://www.w3schools.com/bootstrap/bootstrap_grid_system.asp]] to the macro in order to control the behavior of the blocks on all devices.
3
4 The bootstrap classes look like .col-screensize-nbblocks, with screensize being one of xs,sm,md,lg and the nbblocks a value between 1 and 12. For example if you choose to add "col-md-4,col-lg-1" it will make your block take either 4/12 or 1/12 of the width of the area where your block is put depending if you are on a smaller screen device or on a larger screen device. It's only on the larger screen that you would use 1/12 of the screen width.
5
6 == Sample block macro code ==
7
8 {{code}}
9 {{block title="XWiki" image="xwiki.png" top-bgcolor="blue" top-height="150" link-height="200" image-width="50" image-height="50" top-bgcolor="blue" link-bgcolor="black" classes="col-lg-3 col-md-4 col-sm-6"}}
10 * [[XWiki.org>>url:http://www.xwiki.org]]
11 * [[XWiki SAS>>url:http://www.xwiki.com]]
12 {{/block}}
13 {{/code}}
14
15 == Sample block macro with 6 blocks with constant height ==
16
17 (% class="row" %)
18 (((
19 {{block title="XWiki" image="xwiki.png" top-height="150" link-height="200" image-width="50" image-height="50" top-bgcolor="blue" link-bgcolor="black" classes="col-lg-3 col-md-4 col-sm-6"}}
20 * [[XWiki.org>>url:http://www.xwiki.org]]
21 * [[XWiki SAS>>url:http://www.xwiki.com]]
22 {{/block}}
23
24 {{block title="XWiki" image="toto.png" top-height="150" link-height="200" top-bgcolor="gold" link-bgcolor="black" classes="col-lg-3 col-md-4 col-sm-6"}}
25 * [[XWiki.org>>url:http://www.xwiki.org]]
26 * [[XWiki SAS>>url:http://www.xwiki.com]]
27 {{/block}}
28
29 {{block title="XWiki" image="xwiki.png" top-height="150" link-height="200" top-bgcolor="green" link-bgcolor="black" classes="col-lg-3 col-md-4 col-sm-6"}}
30 * [[XWiki.org>>url:http://www.xwiki.org]]
31 * [[XWiki SAS>>url:http://www.xwiki.com]]
32 {{/block}}
33
34 {{block title="XWiki" image="xwiki.png" top-height="150" link-height="200" image-width="50" image-height="50" top-bgcolor="blue" link-bgcolor="black" classes="col-lg-3 col-md-4 col-sm-6"}}
35 * [[XWiki.org>>url:http://www.xwiki.org]]
36 * [[XWiki SAS>>url:http://www.xwiki.com]]
37 {{/block}}
38
39 {{block title="XWiki" image="toto.png" top-height="150" link-height="200" top-bgcolor="gold" link-bgcolor="black" classes="col-lg-3 col-md-4 col-sm-6"}}
40 * [[XWiki.org>>url:http://www.xwiki.org]]
41 * [[XWiki SAS>>url:http://www.xwiki.com]]
42 {{/block}}
43
44 {{block title="XWiki" image="xwiki.png" top-height="150" link-height="200" top-bgcolor="green" link-bgcolor="black" classes="col-lg-3 col-md-4 col-sm-6"}}
45 * [[XWiki.org>>url:http://www.xwiki.org]]
46 * [[XWiki SAS>>url:http://www.xwiki.com]]
47 {{/block}}
48 )))
49
50 == Sample block macro with 3 blocks with variable height ==
51
52 (% class="row" %)
53 (((
54 {{block title="XWiki" image="xwiki.png" top-bgcolor="blue" link-bgcolor="#f5f5f5" classes="col-lg-3 col-md-4 col-sm-6"}}
55 * (% style="border: 0px;" %)[[(% style="color: #222;" %)This is a nice and long link>>url:http://www.xwiki.org]]
56 * [[(% style="color: #222;" %)This is an even more nicer and long link>>url:http://www.xwiki.com]]
57 {{/block}}
58
59 {{block title="XWiki" image="toto.png" top-bgcolor="gold" link-bgcolor="blue" classes="col-lg-3 col-md-4 col-sm-6"}}
60 * [[XWiki.org>>url:http://www.xwiki.org]]
61 * [[XWiki SAS>>url:http://www.xwiki.com]]
62 {{/block}}
63
64 {{block title="XWiki" image="xwiki.png" top-bgcolor="green" link-bgcolor="blue" classes="col-lg-3 col-md-4 col-sm-6"}}
65 * [[XWiki.org>>url:http://www.xwiki.org]]
66 * [[XWiki SAS>>url:http://www.xwiki.com]]
67 {{/block}}
68
69 )))
70

Меню

ГЛОНАССSoft wiki - 2023г