Changes for page Start here if you're new
Last modified by Ryan C on 2025/06/28 04:59
From 22.1 to 21.1
Show context
Hide context
Summary
Details
-
Page properties
-
- Content
-
... ... @@ -12,60 +12,49 @@ 12 12 13 13 == Getting Started with XWiki == 14 14 15 -The example macro in XWiki is an underrated powerhouseโgreat for *teaching*, *showcasing macros*, *hiding complex markup*, and *letting users play with source-output pairs*. Here are some **highly effective and interesting uses**: 15 +The `{{example}}` macro in XWiki is an underrated powerhouseโgreat for *teaching*, *showcasing macros*, *hiding complex markup*, and *letting users play with source-output pairs*. Here are some **highly effective and interesting uses**: 16 16 17 +--- 17 17 19 +## ๐งช 1. **Macro Showcase: Source-to-Output Toggle** 18 18 19 - ==โก **Using the/MacroShortcut**==21 +Show how a macro works without cluttering the page with raw syntax. 20 20 21 -The / macro shortcut is a powerful and quick way to insert macros while editing pages in XWiki's WYSIWYG editor: 22 - 23 -* Simply type / and start typing the macro name or feature you want to add. 24 -* You'll see suggestions appear as you type. Select the macro to insert it directly without manual syntax. 25 -* Example macros include: 26 -** /toc โ Table of Contents 27 -** /box โ Insert Box Macro 28 -** /gallery โ Image Gallery 29 -** /footnote โ Add footnotes to your text 30 -** /code โ Code blocks for programming snippets 31 - 32 -This shortcut dramatically speeds up editing, no need to memorize complicated wiki syntax 33 - 34 ----- 35 - 36 -## ๐งช 1. **Macro Showcase: Source-to-Output Toggle**## 37 - 38 -In this section we will go over many of the common macros used. The source code is how you use the macro editing in Wiki mode. If you are doing standard WYSIWYG edit mode (the default mode you get when you click edit instead of the dropdown), you can call most of these macros by simply typing /thecommand 39 - 40 - 41 -== Gallery Macro `/gallery` == 42 - 23 +```xwiki 24 +== Gallery Macro == 43 43 {{example}} 44 44 {{gallery}} 45 -[[1 747262485678-297.png]]27 +[[image:photo1.jpg]] 46 46 [[image:photo2.jpg]] 47 47 {{/gallery}} 48 48 {{/example}} 31 +``` 49 49 33 +**Why it's good:** New users see both source and result without confusion. 50 50 51 - == Alternatively `/carousel` ==35 +--- 52 52 53 -{{example}} 54 -{{carousel/}} 37 +## ๐ 2. **Editable Template Snippets** 55 55 56 - 57 -{{/example}} 39 +Use `{{example}}` to store reusable content that users can copy, paste, and modify. 58 58 41 +```xwiki 59 59 == Boilerplate Box == 60 - 61 61 {{example}} 62 62 {{box cssClass="highlight"}} 63 63 Insert your highlighted content here. 64 64 {{/box}} 65 65 {{/example}} 48 +``` 66 66 67 - == Velocity Greeting ==50 +--- 68 68 52 +## ๐ 3. **Educational Tutorials (e.g., Velocity or Groovy)** 53 + 54 +Teach scripting with real, live code examples. 55 + 56 +```xwiki 57 +== Velocity Greeting == 69 69 {{example}} 70 70 {{velocity}} 71 71 #set($name = "Visitor") ... ... @@ -72,31 +72,45 @@ 72 72 Hello, $name! 73 73 {{/velocity}} 74 74 {{/example}} 64 +``` 75 75 66 +--- 76 76 77 - ==InfovsWarning`/infobox` ==68 +## ๐ฏ 4. **Comparing Macro Parameters** 78 78 70 +Demonstrate how different macro parameters change outputโside-by-side. 71 + 72 +```xwiki 73 +== Info vs Warning == 79 79 {{example}} 80 -{{info}} 81 -This is an info box. 82 -{{/info}} 75 +{{info}}This is an info box.{{/info}} 83 83 84 -{{warning}} 85 -This is a warning box. 86 -{{/warning}} 77 +{{warning}}This is a warning box.{{/warning}} 87 87 {{/example}} 79 +``` 88 88 89 - == Footnote Demo `/footnote and /put footnotes` put the put footnotes macro at the bottom where you want the references ==81 +--- 90 90 91 -{{example}} 92 -footnote{{footnote}} https://www.thewhitearchive.org/bin/view/Guides%20and%20Help/Start%20here%20if%20you're%20new/#edit{{/footnote}} 83 +## ๐งฉ 5. **Interactive Data Blocks (TOC, Footnotes, etc.)** 93 93 85 +Visually show what happens when you use certain macros together. 86 + 87 +```xwiki 88 +== Footnote Demo == 89 +{{example}} 90 +This claim needs a source{{footnote}}Here it is.{{/footnote}}. 94 94 {{putFootnotes/}} 95 95 {{/example}} 93 +``` 96 96 95 +--- 97 97 98 - ==GroovyLookup==97 +## ๐งช 6. **Live Scripting Playgrounds** 99 99 99 +Embed small self-contained scripting playgrounds where users can view or modify dynamic output. 100 + 101 +```xwiki 102 +== Groovy Lookup == 100 100 {{example}} 101 101 {{groovy}} 102 102 def now = new Date() ... ... @@ -103,29 +103,61 @@ 103 103 println("Current time: " + now) 104 104 {{/groovy}} 105 105 {{/example}} 109 +``` 106 106 111 +--- 107 107 108 - ==ExpandableSummary`/expandable`ย VERY USEFUL MACRO==113 +## ๐ฆ 7. **Component/API Call Demos** 109 109 115 +Useful for devs exploring the API. 116 + 117 +```xwiki 118 +== Access Current User == 110 110 {{example}} 120 +{{velocity}} 121 +Current user: **$xcontext.user** 122 +{{/velocity}} 123 +{{/example}} 124 +``` 125 + 126 +--- 127 + 128 +## ๐ 8. **Expandable Wiki Templates with Output** 129 + 130 +Pair `{{example}}` with `{{expandable}}` for full disclosure without visual clutter. 131 + 132 +```xwiki 133 +== Expandable Summary == 134 +{{example}} 111 111 {{expandable summary="๐ง Study Summary"}} 112 112 Key findings go here. 113 113 {{/expandable}} 114 114 {{/example}} 139 +``` 115 115 116 - == List Formatting ==141 +--- 117 117 143 +## ๐ง 9. **Syntax Training: Bad vs Good** 144 + 145 +Side-by-side "Do this, not that" with toggles. 146 + 147 +```xwiki 148 +== List Formatting == 118 118 {{example}} 119 119 *Bad formatting* 120 - 121 121 * use - inconsistently 122 122 ** Good formatting: 123 -* Consistent bullet style 124 -* Indented items properly 153 + * Consistent bullet style 154 + * Indented items properly 125 125 {{/example}} 156 +``` 126 126 127 - == Python Code ==158 +--- 128 128 160 +## ๐ก Bonus Tip: Combine `{{example}}` + `{{code}}` for Highlighted Snippets 161 + 162 +```xwiki 163 +== Python Code == 129 129 {{example}} 130 130 {{code language="python"}} 131 131 def greet(): ... ... @@ -132,10 +132,17 @@ 132 132 print("Hello World") 133 133 {{/code}} 134 134 {{/example}} 170 +``` 135 135 136 - == ==172 +--- 137 137 174 +Want me to generate a panel with these uses or make a macro gallery page pre-filled with them? 138 138 176 + 177 +This page covers all the essential steps and tips you need to create great content in XWiki without any confusion. 178 + 179 +== == 180 + 139 139 == ๐ **Attachments and Images** == 140 140 141 141 You can easily upload files and images directly from the WYSIWYG editor: ... ... @@ -147,19 +147,6 @@ 147 147 * Drag-and-drop or select your file to upload it instantly. 148 148 * Uploaded files will automatically be listed as attachments at the bottom of your page. 149 149 150 -== Audio Embedding for attached media its better to use the code sometimes but you can embed media with `/embed content` for external media and `/embed JWPlayer` == 151 - 152 -{{example}} 153 -{{html}} 154 -<audio controls> 155 - <source src="/bin/download/Sandbox/TestPage2/Anti-Black%20racial%20slur%20was%20found%20written%20on%20high%20school%20desk%20in%20Rockville.mp3" type="audio/mpeg"> 156 - Your browser does not support the audio element. 157 -</audio> 158 -{{/html}} 159 -{{/example}} 160 - 161 -This page covers all the essential steps and tips you need to create great content in XWiki without any confusion. 162 - 163 163 === **Inserting Images with Enlargable Thumbnails** === 164 164 165 165 1. In the editor, click the **"Insert Image"** icon from the toolbar. ... ... @@ -166,27 +166,25 @@ 166 166 1. Upload or select the image. 167 167 1. Choose the **Thumbnail option** to create a clickable enlargable preview automatically. 168 168 169 - [[image:1747262485678-297.png||data-xwiki-image-style="thumbnail-clickable" width="200"]]198 +---- 170 170 171 -== == 200 +== โก **Using the / Macro Shortcut** == 172 172 173 -((( 174 -=== **You can also use this format to insert images** === 202 +The / macro shortcut is a powerful and quick way to insert macros while editing pages in XWiki's WYSIWYG editor: 175 175 176 -{{example}} 177 -~[~[image~:1747262485678-297.png]] 178 -{{/example}} 204 +* Simply type / and start typing the macro name or feature you want to add. 205 +* You'll see suggestions appear as you type. Select the macro to insert it directly without manual syntax. 206 +* Example macros include: 207 +** /toc โ Table of Contents 208 +** /box โ Insert Box Macro 209 +** /gallery โ Image Gallery 210 +** /footnote โ Add footnotes to your text 211 +** /code โ Code blocks for programming snippets 179 179 180 - 181 -))) 213 +This shortcut dramatically speeds up editing, no need to memorize complicated wiki syntax. 182 182 183 -{{code}} 184 - [[image:example.jpg]] 185 -{{/code}} 215 +---- 186 186 187 - 188 -== == 189 - 190 190 == โ๏ธ**ย Basic Formatting and Links (Quick Guide)** == 191 191 192 192 * **Bold text**: Select text, click the **Bold** button or press Ctrl + B. ... ... @@ -229,6 +229,7 @@ 229 229 230 230 * **WYSIWYG (What You See Is What You Get) Editor**: Ideal for users unfamiliar with wiki syntax, this editor provides a user-friendly interface resembling traditional word processors. It allows for straightforward text formatting, image insertion, and link creation without delving into markup language. ๎cite๎turn0search0๎๎ 231 231 * **Wiki Editor**: This mode enables direct editing using XWikiโs markup syntax. Itโs suitable for users comfortable with wiki syntax and those requiring precise control over the content structure.๎ 259 +* **Inline Form Editing**: Used primarily for pages containing structured data or custom applications, this mode presents editable fields directly within the page view, streamlining data entry and updates.๎ 232 232 233 233 == **Essential Formatting Options** == 234 234 ... ... @@ -243,6 +243,62 @@ 243 243 {{/code}} 244 244 245 245 274 +=== **Text Formatting** === 275 + 276 + 277 + 278 +* 279 +** ((( 280 +=== **Bold**: Surround text with double asterisks. === 281 +))) 282 + 283 +{{code}} 284 +**bold text** 285 +{{/code}} 286 + 287 + 288 +* 289 +** ((( 290 +=== **Italics**: Use double underscores. === 291 +))) 292 + 293 +{{code}} 294 +__italic text__ 295 +{{/code}} 296 + 297 + 298 +* 299 +** ((( 300 +=== **Underline**: Enclose text with double tildes. === 301 +))) 302 + 303 +{{code}} 304 +~~underlined text~~ 305 +{{/code}} 306 + 307 + 308 +* 309 +** ((( 310 +=== **Unordered List**: Begin lines with asterisk (*) or hyphen (-). === 311 +))) 312 + 313 +{{code}} 314 +* Item 1 315 +* Item 2 316 +{{/code}} 317 + 318 + 319 +* 320 +** ((( 321 +=== **Ordered List**: Start lines with a number followed by a period. === 322 +))) 323 + 324 +{{code}} 325 +1. First item 326 +2. Second item 327 +{{/code}} 328 + 329 + 246 246 == **Links** == 247 247 248 248 ... ... @@ -262,9 +262,14 @@ 262 262 {{/code}} 263 263 264 264 ((( 265 -=== 349 +=== **Images** === 266 266 ))) 267 267 352 +{{code}} 353 + [[image:example.jpg]] 354 +{{/code}} 355 + 356 + 268 268 == **Utilizing XWiki Macros** == 269 269 270 270 Macros are powerful tools in XWiki that allow for dynamic content inclusion and advanced formatting. Here are ten notable macros to consider:๎ ... ... @@ -335,12 +335,12 @@ 335 335 == Example Macro == 336 336 337 337 The example macro displays the output of a macro or script or anything that you like 338 - 339 339 == Expandable Macro == 340 340 341 341 The following example demonstrates how to present complex information cleanly using ` 342 342 343 343 {{example}} 432 + 344 344 {{expandable summary="Study: The Wilson Effect: The Increase in Heritability of IQ With Age"}} 345 345 **Source:** *Twin Research and Human Genetics (Cambridge University Press)* 346 346 **Date of Publication:** *2013* ... ... @@ -410,4 +410,4 @@ 410 410 {{/example}} 411 411 412 412 413 - 502 +
-
1747262485678-297.png
-
- Author
-
... ... @@ -1,1 +1,0 @@ 1 -XWiki.AdminAngriff - Size
-
... ... @@ -1,1 +1,0 @@ 1 -1.6 MB -
Content
