<?xml version="1.0" encoding="UTF-8" ?>
<?xml-stylesheet type="text/xsl" href="https://community.element14.com/cfs-file/__key/system/syndication/rss.xsl" media="screen"?><rss version="2.0" xmlns:dc="http://purl.org/dc/elements/1.1/"><channel><title>How to use tabbed content and filtered tables</title><link>https://community.element14.com/members-area/support/w/site-faq/19312/how-to-use-tabbed-content-and-filtered-tables</link><description /><dc:language>en-US</dc:language><generator>Telligent Community 12</generator><item><title>How to use tabbed content and filtered tables</title><link>https://community.element14.com/members-area/support/w/site-faq/19312/how-to-use-tabbed-content-and-filtered-tables</link><pubDate>Fri, 11 Mar 2022 09:26:34 GMT</pubDate><guid isPermaLink="false">93d5dcb4-84c2-446f-b2cb-99731719e767:a16664a5-1a80-4a77-ba11-213caf7ac49e</guid><dc:creator>Matt</dc:creator><comments>https://community.element14.com/members-area/support/w/site-faq/19312/how-to-use-tabbed-content-and-filtered-tables#comments</comments><description>Current Revision posted to Site FAQ by Matt on 3/11/2022 9:26:34 AM&lt;br /&gt;
&lt;p style="margin:0;"&gt;&lt;strong&gt;&lt;span style="font-size:12pt;"&gt;Introduction&lt;/span&gt;&lt;br /&gt;&lt;/strong&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;These two features are written so that if someone views the content in an email, activity stream, notification, or browser that&amp;#39;s not running JavaScript, then the content will simply appear in a standard table.&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;strong style="font-size:12pt;"&gt;Tabbed Content&lt;/strong&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;This is an alternative way to present some content. If you put the command {tabbedtable} in the first column heading, you&amp;#39;ll enable a feature which turns your table into a tabbed layout when you publish your changes.&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;From the &amp;#39;Insert&amp;#39; menu:&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&lt;img alt="image" style="max-height:360px;max-width:640px;"  src="/resized-image/__size/1280x720/__key/communityserver-wikis-components-files/00-00-00-06-51/pastedimage1636850312570v7.png" /&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;This will give you a helper dialog which tells you how the feature works, and allow you to insert an example. It isn&amp;#39;t essential that you do this each time you want to use this feature.. it&amp;#39;s just a reminder of where you&amp;#39;d need to put your text and the {tabbedtable} command in a standard table.&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;img loading="lazy" alt="image" style="max-height:360px;max-width:640px;"  src="/resized-image/__size/1280x720/__key/communityserver-wikis-components-files/00-00-00-06-51/pastedimage1636850371433v8.png" /&gt;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;After you publish your content, the table will be automatically turned into a tabbed layout like this;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;span&gt;&lt;a href="https://community.element14.com/resized-image/__size/695x270/__key/communityserver-wikis-components-files/00-00-00-06-51/contentimage_5F00_52946.png"&gt;&lt;img loading="lazy" alt="image" src="https://community-storage.element14.com/communityserver-components-secureimagefileviewer/communityserver/wikis/components/files/00/00/00/06/51/contentimage_52946.png-695x270.png?sv=2016-05-31&amp;amp;sr=b&amp;amp;sig=S0uknaB2yxD9bi8WBSDrUvqGV2ADkgjXvxoU10VCGVs%3D&amp;amp;se=2026-08-15T23%3A59%3A59Z&amp;amp;sp=r&amp;amp;_=whIyhMsxeO4f9+1xjaUd7w==" style="max-height: 270px;max-width: 695px;" /&gt;&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;strong style="font-size:12pt;"&gt;Filtered Tables&lt;/strong&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;This is really handy If you&amp;#39;ve got a table of data that you&amp;#39;d like to make searchable, or have the columns filterable. Simply put the text {searchbar} in any column heading if you want to make the table searchable, and use {filter} to display a drop-down filter.&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;When you&amp;#39;re editing your content, click this icon in the editor toolbar;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;img loading="lazy" alt="image" style="max-height:360px;max-width:640px;"  src="/resized-image/__size/1280x720/__key/communityserver-wikis-components-files/00-00-00-06-51/pastedimage1636850404260v9.png" /&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;This will give you a helper dialog which tells you how the feature works, and allow you to insert an example. It isn&amp;#39;t essential that you do this each time you want to use this feature.. it&amp;#39;s just a reminder of where you&amp;#39;d need to put the {filter} and {searchbar} commands in a standard table.&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&lt;img loading="lazy" alt="image" style="max-height:360px;max-width:640px;"  src="/resized-image/__size/1280x720/__key/communityserver-wikis-components-files/00-00-00-06-51/pastedimage1636850446716v10.png" /&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;After you publish your content, you&amp;#39;ll see the filters and search bar will automatically appear;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;span&gt;&lt;a href="https://community.element14.com/resized-image/__size/663x333/__key/communityserver-wikis-components-files/00-00-00-06-51/contentimage_5F00_52949.png"&gt;&lt;img loading="lazy" alt="image" src="https://community-storage.element14.com/communityserver-components-secureimagefileviewer/communityserver/wikis/components/files/00/00/00/06/51/contentimage_52949.png-663x333.png?sv=2016-05-31&amp;amp;sr=b&amp;amp;sig=FaKkcofAT3Vfi0C5%2FJB77uoLFEQh2Qr3e5q332Kms7E%3D&amp;amp;se=2026-08-15T23%3A59%3A59Z&amp;amp;sp=r&amp;amp;_=1mJmca4Zzr+6MVS8PP3ogg==" style="max-height: 333px;max-width: 663px;" /&gt;&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;&lt;div style="clear:both;"&gt;&lt;/div&gt;&lt;script&gt;window.top.e14.func.queueScripts.add(function() { window.top.e14.func.e14DynaloadTabbedTables.init(); });&lt;/script&gt;&lt;script&gt;window.top.e14.func.queueScripts.add(function() { window.top.e14.func.e14DynaloadFilteredTables.init(); });&lt;/script&gt;
</description></item><item><title>How to use tabbed content and filtered tables</title><link>https://community.element14.com/members-area/support/w/site-faq/19312/how-to-use-tabbed-content-and-filtered-tables/revision/2</link><pubDate>Sun, 14 Nov 2021 00:40:52 GMT</pubDate><guid isPermaLink="false">93d5dcb4-84c2-446f-b2cb-99731719e767:a16664a5-1a80-4a77-ba11-213caf7ac49e</guid><dc:creator>cstanton</dc:creator><comments>https://community.element14.com/members-area/support/w/site-faq/19312/how-to-use-tabbed-content-and-filtered-tables#comments</comments><description>Revision 2 posted to Site FAQ by cstanton on 11/14/2021 12:40:52 AM&lt;br /&gt;
&lt;p style="margin:0;"&gt;&lt;strong&gt;&lt;span style="font-size:12pt;"&gt;Introduction&lt;/span&gt;&lt;br /&gt;&lt;/strong&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;These two features are written so that if someone views the content in an email, activity stream, notification, or browser that&amp;#39;s not running JavaScript, then the content will simply appear in a standard table.&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;strong style="font-size:12pt;"&gt;Tabbed Content&lt;/strong&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;This is an alternative way to present some content. If you put the command {tabbedtable} in the first column heading, you&amp;#39;ll enable a feature which turns your table into a tabbed layout when you publish your changes.&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;From the &amp;#39;Insert&amp;#39; menu:&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&lt;img alt="image" style="max-height:360px;max-width:640px;" src="/resized-image/__size/1280x720/__key/communityserver-wikis-components-files/00-00-00-00-72/pastedimage1636850312570v7.png"  /&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;This will give you a helper dialog which tells you how the feature works, and allow you to insert an example. It isn&amp;#39;t essential that you do this each time you want to use this feature.. it&amp;#39;s just a reminder of where you&amp;#39;d need to put your text and the {tabbedtable} command in a standard table.&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;img loading="lazy" alt="image" style="max-height:360px;max-width:640px;" src="/resized-image/__size/1280x720/__key/communityserver-wikis-components-files/00-00-00-00-72/pastedimage1636850371433v8.png"  /&gt;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;After you publish your content, the table will be automatically turned into a tabbed layout like this;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;span&gt;&lt;a href="https://community.element14.com/resized-image/__size/695x270/__key/communityserver-wikis-components-files/00-00-00-00-72/contentimage_5F00_52946.png"&gt;&lt;img loading="lazy" alt="image" src="https://community-storage.element14.com/communityserver-components-secureimagefileviewer/communityserver/wikis/components/files/00/00/00/00/72/contentimage_52946.png-695x270.png?sv=2016-05-31&amp;amp;sr=b&amp;amp;sig=w1bIWgjOWxO5adhO18ALd%2F0ygK%2BJi%2FB815%2FQ5566J1A%3D&amp;amp;se=2026-08-15T23%3A59%3A59Z&amp;amp;sp=r&amp;amp;_=whIyhMsxeO4f9+1xjaUd7w==" style="max-height: 270px;max-width: 695px;" /&gt;&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;strong style="font-size:12pt;"&gt;Filtered Tables&lt;/strong&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;This is really handy If you&amp;#39;ve got a table of data that you&amp;#39;d like to make searchable, or have the columns filterable. Simply put the text {searchbar} in any column heading if you want to make the table searchable, and use {filter} to display a drop-down filter.&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;When you&amp;#39;re editing your content, click this icon in the editor toolbar;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;img loading="lazy" alt="image" style="max-height:360px;max-width:640px;" src="/resized-image/__size/1280x720/__key/communityserver-wikis-components-files/00-00-00-00-72/pastedimage1636850404260v9.png"  /&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;This will give you a helper dialog which tells you how the feature works, and allow you to insert an example. It isn&amp;#39;t essential that you do this each time you want to use this feature.. it&amp;#39;s just a reminder of where you&amp;#39;d need to put the {filer} and {searchbar} commands in a standard table.&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&lt;img loading="lazy" alt="image" style="max-height:360px;max-width:640px;" src="/resized-image/__size/1280x720/__key/communityserver-wikis-components-files/00-00-00-00-72/pastedimage1636850446716v10.png"  /&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;After you publish your content, you&amp;#39;ll see the filters and search bar will automatically appear;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;span&gt;&lt;a href="https://community.element14.com/resized-image/__size/663x333/__key/communityserver-wikis-components-files/00-00-00-00-72/contentimage_5F00_52949.png"&gt;&lt;img loading="lazy" alt="image" src="https://community-storage.element14.com/communityserver-components-secureimagefileviewer/communityserver/wikis/components/files/00/00/00/00/72/contentimage_52949.png-663x333.png?sv=2016-05-31&amp;amp;sr=b&amp;amp;sig=LTmz0EwJ%2FLvCAdlXxVg40xb9A%2Flck7WdVTndsWDRrjM%3D&amp;amp;se=2026-08-15T23%3A59%3A59Z&amp;amp;sp=r&amp;amp;_=1mJmca4Zzr+6MVS8PP3ogg==" style="max-height: 333px;max-width: 663px;" /&gt;&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;&lt;div style="clear:both;"&gt;&lt;/div&gt;&lt;script&gt;window.top.e14.func.queueScripts.add(function() { window.top.e14.func.e14DynaloadTabbedTables.init(); });&lt;/script&gt;&lt;script&gt;window.top.e14.func.queueScripts.add(function() { window.top.e14.func.e14DynaloadFilteredTables.init(); });&lt;/script&gt;
</description></item><item><title>How to use tabbed content and filtered tables</title><link>https://community.element14.com/members-area/support/w/site-faq/19312/how-to-use-tabbed-content-and-filtered-tables/revision/3</link><pubDate>Sun, 14 Nov 2021 00:40:52 GMT</pubDate><guid isPermaLink="false">93d5dcb4-84c2-446f-b2cb-99731719e767:a16664a5-1a80-4a77-ba11-213caf7ac49e</guid><dc:creator>cstanton</dc:creator><comments>https://community.element14.com/members-area/support/w/site-faq/19312/how-to-use-tabbed-content-and-filtered-tables#comments</comments><description>Revision 3 posted to Site FAQ by cstanton on 11/14/2021 12:40:52 AM&lt;br /&gt;
&lt;p style="margin:0;"&gt;&lt;strong&gt;&lt;span style="font-size:12pt;"&gt;Introduction&lt;/span&gt;&lt;br /&gt;&lt;/strong&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;These two features are written so that if someone views the content in an email, activity stream, notification, or browser that&amp;#39;s not running JavaScript, then the content will simply appear in a standard table.&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;strong style="font-size:12pt;"&gt;Tabbed Content&lt;/strong&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;This is an alternative way to present some content. If you put the command {tabbedtable} in the first column heading, you&amp;#39;ll enable a feature which turns your table into a tabbed layout when you publish your changes.&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;From the &amp;#39;Insert&amp;#39; menu:&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&lt;img alt="image" style="max-height:360px;max-width:640px;" src="/resized-image/__size/1280x720/__key/communityserver-wikis-components-files/00-00-00-06-51/pastedimage1636850312570v7.png"  /&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;This will give you a helper dialog which tells you how the feature works, and allow you to insert an example. It isn&amp;#39;t essential that you do this each time you want to use this feature.. it&amp;#39;s just a reminder of where you&amp;#39;d need to put your text and the {tabbedtable} command in a standard table.&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;img loading="lazy" alt="image" style="max-height:360px;max-width:640px;" src="/resized-image/__size/1280x720/__key/communityserver-wikis-components-files/00-00-00-06-51/pastedimage1636850371433v8.png"  /&gt;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;After you publish your content, the table will be automatically turned into a tabbed layout like this;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;span&gt;&lt;a href="https://community.element14.com/resized-image/__size/695x270/__key/communityserver-wikis-components-files/00-00-00-06-51/contentimage_5F00_52946.png"&gt;&lt;img loading="lazy" alt="image" src="https://community-storage.element14.com/communityserver-components-secureimagefileviewer/communityserver/wikis/components/files/00/00/00/06/51/contentimage_52946.png-695x270.png?sv=2016-05-31&amp;amp;sr=b&amp;amp;sig=S0uknaB2yxD9bi8WBSDrUvqGV2ADkgjXvxoU10VCGVs%3D&amp;amp;se=2026-08-15T23%3A59%3A59Z&amp;amp;sp=r&amp;amp;_=whIyhMsxeO4f9+1xjaUd7w==" style="max-height: 270px;max-width: 695px;" /&gt;&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;strong style="font-size:12pt;"&gt;Filtered Tables&lt;/strong&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;This is really handy If you&amp;#39;ve got a table of data that you&amp;#39;d like to make searchable, or have the columns filterable. Simply put the text {searchbar} in any column heading if you want to make the table searchable, and use {filter} to display a drop-down filter.&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;When you&amp;#39;re editing your content, click this icon in the editor toolbar;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;img loading="lazy" alt="image" style="max-height:360px;max-width:640px;" src="/resized-image/__size/1280x720/__key/communityserver-wikis-components-files/00-00-00-06-51/pastedimage1636850404260v9.png"  /&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;This will give you a helper dialog which tells you how the feature works, and allow you to insert an example. It isn&amp;#39;t essential that you do this each time you want to use this feature.. it&amp;#39;s just a reminder of where you&amp;#39;d need to put the {filer} and {searchbar} commands in a standard table.&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&lt;img loading="lazy" alt="image" style="max-height:360px;max-width:640px;" src="/resized-image/__size/1280x720/__key/communityserver-wikis-components-files/00-00-00-06-51/pastedimage1636850446716v10.png"  /&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;After you publish your content, you&amp;#39;ll see the filters and search bar will automatically appear;&lt;/p&gt;
&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style="margin:0;"&gt;&lt;span&gt;&lt;a href="https://community.element14.com/resized-image/__size/663x333/__key/communityserver-wikis-components-files/00-00-00-06-51/contentimage_5F00_52949.png"&gt;&lt;img loading="lazy" alt="image" src="https://community-storage.element14.com/communityserver-components-secureimagefileviewer/communityserver/wikis/components/files/00/00/00/06/51/contentimage_52949.png-663x333.png?sv=2016-05-31&amp;amp;sr=b&amp;amp;sig=FaKkcofAT3Vfi0C5%2FJB77uoLFEQh2Qr3e5q332Kms7E%3D&amp;amp;se=2026-08-15T23%3A59%3A59Z&amp;amp;sp=r&amp;amp;_=1mJmca4Zzr+6MVS8PP3ogg==" style="max-height: 333px;max-width: 663px;" /&gt;&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;&lt;div style="clear:both;"&gt;&lt;/div&gt;&lt;script&gt;window.top.e14.func.queueScripts.add(function() { window.top.e14.func.e14DynaloadTabbedTables.init(); });&lt;/script&gt;&lt;script&gt;window.top.e14.func.queueScripts.add(function() { window.top.e14.func.e14DynaloadFilteredTables.init(); });&lt;/script&gt;
</description></item><item><title>How to use tabbed content and filtered tables</title><link>https://community.element14.com/members-area/support/w/site-faq/19312/how-to-use-tabbed-content-and-filtered-tables/revision/1</link><pubDate>Fri, 08 Oct 2021 08:21:37 GMT</pubDate><guid isPermaLink="false">93d5dcb4-84c2-446f-b2cb-99731719e767:a16664a5-1a80-4a77-ba11-213caf7ac49e</guid><dc:creator>Matt</dc:creator><comments>https://community.element14.com/members-area/support/w/site-faq/19312/how-to-use-tabbed-content-and-filtered-tables#comments</comments><description>Revision 1 posted to Site FAQ by Matt on 10/8/2021 8:21:37 AM&lt;br /&gt;
&lt;p style="margin:0;"&gt;&lt;strong&gt;&lt;span style="font-size:12pt;"&gt;Introduction&lt;/span&gt;&lt;br /&gt;&lt;/strong&gt;&lt;/p&gt;&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;&lt;p style="margin:0;"&gt;These two features are written so that if someone views the content in an email, activity stream, notification, or browser that&amp;#39;s not running JavaScript, then the content will simply appear in a standard table.&lt;/p&gt;&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;&lt;p style="margin:0;"&gt;&lt;strong style="font-size:12pt;"&gt;Tabbed Content&lt;/strong&gt;&lt;/p&gt;&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;&lt;p style="margin:0;"&gt;This is an alternative way to present some content. If you put the command {tabbedtable} in the first column heading, you&amp;#39;ll enable a feature which turns your table into a tabbed layout when you publish your changes.&lt;/p&gt;&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;&lt;p style="margin:0;"&gt;When you&amp;#39;re editing your content, click this icon in the editor toolbar;&lt;/p&gt;&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;&lt;p style="margin:0;"&gt;&lt;span&gt;&lt;a href="https://community.element14.com/resized-image/__size/218x260/__key/communityserver-wikis-components-files/00-00-00-00-72/contentimage_5F00_52944.png"&gt;&lt;img alt="image" src="https://community-storage.element14.com/communityserver-components-secureimagefileviewer/communityserver/wikis/components/files/00/00/00/00/72/contentimage_52944.png-218x260.png?sv=2016-05-31&amp;amp;sr=b&amp;amp;sig=p1yIqli1e0GJ20YZIkpWhG0q1JSwj9ebUEk%2Bv4AYD48%3D&amp;amp;se=2026-08-15T23%3A59%3A59Z&amp;amp;sp=r&amp;amp;_=YHQc54I0UUJ1dxRHApfPsQ==" style="max-height: 260px;max-width: 218px;" /&gt;&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;&lt;p style="margin:0;"&gt;This will give you a helper dialog which tells you how the feature works, and allow you to insert an example. It isn&amp;#39;t essential that you do this each time you want to use this feature.. it&amp;#39;s just a reminder of where you&amp;#39;d need to put your text and the {tabbedtable} command in a standard table.&lt;/p&gt;&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;&lt;p style="margin:0;"&gt;&lt;span&gt;&lt;a href="https://community.element14.com/resized-image/__size/443x345/__key/communityserver-wikis-components-files/00-00-00-00-72/contentimage_5F00_52945.png"&gt;&lt;img loading="lazy" alt="image" src="https://community-storage.element14.com/communityserver-components-secureimagefileviewer/communityserver/wikis/components/files/00/00/00/00/72/contentimage_52945.png-443x345.png?sv=2016-05-31&amp;amp;sr=b&amp;amp;sig=KzEfceRkLThPCmJAPvzgo9jkxSR8oK%2BGu3shlpZdPQk%3D&amp;amp;se=2026-08-15T23%3A59%3A59Z&amp;amp;sp=r&amp;amp;_=g3PzaOYcvIMMStzk6mGdGg==" style="max-height: 345px;max-width: 443px;" /&gt;&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;&lt;p style="margin:0;"&gt;After you publish your content, the table will be automatically turned into a tabbed layout like this;&lt;/p&gt;&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;&lt;p style="margin:0;"&gt;&lt;span&gt;&lt;a href="https://community.element14.com/resized-image/__size/695x270/__key/communityserver-wikis-components-files/00-00-00-00-72/contentimage_5F00_52946.png"&gt;&lt;img loading="lazy" alt="image" src="https://community-storage.element14.com/communityserver-components-secureimagefileviewer/communityserver/wikis/components/files/00/00/00/00/72/contentimage_52946.png-695x270.png?sv=2016-05-31&amp;amp;sr=b&amp;amp;sig=w1bIWgjOWxO5adhO18ALd%2F0ygK%2BJi%2FB815%2FQ5566J1A%3D&amp;amp;se=2026-08-15T23%3A59%3A59Z&amp;amp;sp=r&amp;amp;_=whIyhMsxeO4f9+1xjaUd7w==" style="max-height: 270px;max-width: 695px;" /&gt;&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;&lt;p style="margin:0;"&gt;&lt;strong style="font-size:12pt;"&gt;Filtered Tables&lt;/strong&gt;&lt;/p&gt;&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;&lt;p style="margin:0;"&gt;This is really handy If you&amp;#39;ve got a table of data that you&amp;#39;d like to make searchable, or have the columns filterable. Simply put the text {searchbar} in any column heading if you want to make the table searchable, and use {filter} to display a drop-down filter. &lt;/p&gt;&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;&lt;p style="margin:0;"&gt;When you&amp;#39;re editing your content, click this icon in the editor toolbar;&lt;/p&gt;&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;&lt;p style="margin:0;"&gt;&lt;span&gt;&lt;a href="https://community.element14.com/resized-image/__size/201x273/__key/communityserver-wikis-components-files/00-00-00-00-72/contentimage_5F00_52947.png"&gt;&lt;img loading="lazy" alt="image" src="https://community-storage.element14.com/communityserver-components-secureimagefileviewer/communityserver/wikis/components/files/00/00/00/00/72/contentimage_52947.png-201x273.png?sv=2016-05-31&amp;amp;sr=b&amp;amp;sig=iFfeMuWOTxmKjvPPAz657LwFzxHBoirWKjJIfNZ3dAo%3D&amp;amp;se=2026-08-15T23%3A59%3A59Z&amp;amp;sp=r&amp;amp;_=M5sIwRh2qTQ5dDZSyQ8GaQ==" style="max-height: 273px;max-width: 201px;" /&gt;&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;&lt;p style="margin:0;"&gt;This will give you a helper dialog which tells you how the feature works, and allow you to insert an example. It isn&amp;#39;t essential that you do this each time you want to use this feature.. it&amp;#39;s just a reminder of where you&amp;#39;d need to put the {filer} and {searchbar} commands in a standard table.&lt;/p&gt;&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;&lt;p style="margin:0;"&gt;&lt;span&gt;&lt;a href="https://community.element14.com/resized-image/__size/477x370/__key/communityserver-wikis-components-files/00-00-00-00-72/contentimage_5F00_52948.png"&gt;&lt;img loading="lazy" alt="image" src="https://community-storage.element14.com/communityserver-components-secureimagefileviewer/communityserver/wikis/components/files/00/00/00/00/72/contentimage_52948.png-477x370.png?sv=2016-05-31&amp;amp;sr=b&amp;amp;sig=lQtKpLVY7VwEUv%2Bu8V8Qq6Qx0noX%2BLbKImZgSMCEYf8%3D&amp;amp;se=2026-08-15T23%3A59%3A59Z&amp;amp;sp=r&amp;amp;_=2cS/KLMeMLzxbA1sDk0UBQ==" style="max-height: 370px;max-width: 477px;" /&gt;&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;&lt;p style="margin:0;"&gt;After you publish your content, you&amp;#39;ll see the filters and search bar will automatically appear;&lt;/p&gt;&lt;p style="margin:0;padding:0px;"&gt;&amp;nbsp;&lt;/p&gt;&lt;p style="margin:0;"&gt;&lt;span&gt;&lt;a href="https://community.element14.com/resized-image/__size/663x333/__key/communityserver-wikis-components-files/00-00-00-00-72/contentimage_5F00_52949.png"&gt;&lt;img loading="lazy" alt="image" src="https://community-storage.element14.com/communityserver-components-secureimagefileviewer/communityserver/wikis/components/files/00/00/00/00/72/contentimage_52949.png-663x333.png?sv=2016-05-31&amp;amp;sr=b&amp;amp;sig=LTmz0EwJ%2FLvCAdlXxVg40xb9A%2Flck7WdVTndsWDRrjM%3D&amp;amp;se=2026-08-15T23%3A59%3A59Z&amp;amp;sp=r&amp;amp;_=1mJmca4Zzr+6MVS8PP3ogg==" style="max-height: 333px;max-width: 663px;" /&gt;&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;&lt;div style="clear:both;"&gt;&lt;/div&gt;&lt;script&gt;window.top.e14.func.queueScripts.add(function() { window.top.e14.func.e14DynaloadTabbedTables.init(); });&lt;/script&gt;&lt;script&gt;window.top.e14.func.queueScripts.add(function() { window.top.e14.func.e14DynaloadFilteredTables.init(); });&lt;/script&gt;
</description></item></channel></rss>