Enhance and stylize your data representation by applying filters to your data tags. Filters allow you to manipulate and format data according to your preferences, ensuring your information is presented clearly and effectively. This guide will walk you through the process of adding filters to your data tags.
How to Apply Filters
Without Filter: Simply use the data tag as follows:
{{ data.tag }}With Filter: To apply a filter, modify the data tag by appending the filter name connected by a pipe (|) symbol:
{{ data.tag | filter_name }}
Available Filters
Here is a list of currently available filters along with examples and their outputs:
1. Format Money
Purpose: Formats a numeric amount to money notation.
Syntax:
{{ event.fee | format_money }}Output:
1,500.00
2. Format Percentage
Purpose: Formats a numeric amount to percentage notation and removes decimals.
Syntax:
{{ event.vat_percentage | format_percentage }}Output:
21
3. Upcase
Purpose: Transforms text to all uppercase.
Syntax:
{{ event.title | upcase }}Output:
WOODSTOCK
4. Date Formatting
Purpose: Formats a date to your preferred structure.
Syntax and Examples:
{{ event.start | date: "%B %d, %Y" }}formats a date as "April 16, 2017".Date formatting tokens include:
%B- Full month name ("January")%d- Day of the month (01..31)%Y- Year with century
Below is a comprehensive list of all possible date formatting options:
%a - The abbreviated weekday name ("Sun")
%A - The full weekday name ("Sunday")
%b - The abbreviated month name ("Jan")
%B - The full month name ("January")
%d - Day of the month (01..31)
%e - Day of the month without a leading zero (1..31)
%j - Day of the year (001..366)
%m - Month of the year (01..12)
%U - Week number of the current year, starting with the first Sunday as the first day of the first week (00..53)
%W - Week number of the current year, starting with the first Monday as the first day of the first week (00..53)
%w - Day of the week (Sunday is 0, 0..6)
%x - Preferred representation for the date alone, no time
%y - Year without a century (00..99)
%Y - Year with century
5. Time Formatting
Purpose: Formats time to your preferred structure.
Syntax and Examples:
{{ current_time | date: "%H:%M %p" }}formats time as "14:55 PM".Time formatting tokens include:
%H- Hour of the day, 24-hour clock (00..23)%M- Minute of the hour (00..59)%p- Meridian indicator ("AM" or "PM")
Below is a comprehensive list of all possible time formatting options:
%H - Hour of the day, 24-hour clock (00..23)
%I - Hour of the day, 12-hour clock (01..12)
%l - Hour of the day, 12-hour clock without a leading zero (1..12)
%M - Minute of the hour (00..59)
%P - Meridian indicator ("am" or "pm")
%p - Meridian indicator ("AM" or "PM")
%S - Second of the minute (00..60)
%X - Preferred representation for the time alone, no date
%Z - Time zone name
Conclusion
By using filters on your data tags, you can ensure that your data is not only accurate but also displayed in a manner that best suits the needs of your project or presentation. If you have any questions or need further assistance with data tags and filters, please contact our support team.