View source for Manual:Extension/ContentDroplets/Examples

{{TOClimit|limit=1|nonum=1|notitle=1|noborder=0|fontlarge=0|inline=1}}
==Lists==
<div class="sectionflex col3 frame">
<div>
== Statistics ==
<bs:whoisonlinepopup /> (<bs:whoisonlinecount />)
* Number of characters: <bs:countcharacters mode="chars" />
* Number of files: <bs:countfiles />
* Number of pages: <bs:countarticles />
* Number of users: <bs:countusers />
</div>
<div>
===Booklist===
<bs:booklist filter="author1:Margit Link-Rodrigue" />
</div>
<div>
===Links to this page===
<whatlinkshere count="5" period="-" sort="time" showns="0" />
</div>
<div>
===Members in group===
<bs:userlist groups="sysop" count="10" />
</div>
<div>
===Most visited pages===
<bs:toplist count="6" period="-" />
</div>
<div>
===Data query===
<dataquery modified="+" format="ul" count="10" namespaces="Manual" />
</div>
<div>
===Recent Changes===
<recentchanges count="6" period="-" sort="time" showns="0" />
</div>
<div>
===Subpages===
{{Subpages|parentnamespace=Manual|parentpage=Extension/ContentDroplets|cols=no|bullets=yes}}
</div>
<div>
===My last visited pages===
<bs:pagesvisited count="6" maxtitlelength="30" order="time" />
</div>
<div>
===My watchlist===
<bs:watchlist count="6" maxtitlelength="30" order="time" />
</div>
</div>
==Visual formatting==
<div class="sectionflex col3 frame">
<div>
===Button===
{{ButtonLink|external=no|target=Main Page|label=My page|format=blue}}
</div>
<div>
===Modal button===
{{ModalDialog|title=Legal notice|btnLabel=Google.com|body=You are leaving this website. We are not responsible for any content beyond this point.

[https://google.com Visit google.com]|bgcolor=blue|footer=}}
</div>
<div>
===Circled number===
{{CircledNumber|bgColor=#3e5389|fgColor=white|number=1}} Preheat oven to 425°F

{{CircledNumber|bgColor=#3e5389|fgColor=white|number=2}} Mix all the ingredients

{{CircledNumber|bgColor=#3e5389|fgColor=white|number=3}} Bake for 40 minutes

{{CircledNumber|bgColor=#3e5389|fgColor=white|number=4}} Take out and let cool 30 mintes

{{CircledNumber|bgColor=#3e5389|fgColor=white|number=5}} Eat
</div>
</div>

===PDF preview===
===Progress===
Inspector
{| class="wikitable"
!setting
!value
!description
|-
|Base count
|5
|number of items that are counted to reach 100%
|-
|Base item
|Is:
|prefix that specifies the progress item. If you do not provide a base item, the progress item could be to unspecific
|-
|Progress item
|closed
|item that will be counted towards the base count
|-
|Width
|300
|width in pixels
|}'''Output'''<div><bs:statistics:progress basecount="5" progressitem="closed" width="300" baseitem="Statecheck:" /></div><br />
*This is my topic 1 (Statecheck:open)
*This is my topic 2 (Statecheck:closed)
*This is my topic 3 (Statecheck:closed)
*This is my topic 4 (Statecheck:closed)
*This is my topic 5 (Statecheck:closed)
===Pros and cons===
{{ProConList|title-advantages=Advantages|title-disadvantages=Disadvantages|advantages=* affordable
* well-known
* easily accessible|disadvantages=* somewhat dated look and feel
* not customizable
* GDPR compliance unclear}}
===Tip Message===
{{Textbox|boxtype=tip|header=|text=This is a tip message.|icon=yes}}