Ninja Tables offers you a variety of advanced options after you configure the Basic Settings. You can add more specifics and dynamic elements to your table columns with these settings.
Let’s look at this simple article to learn how to add these Advanced Settings to a column.
- Go to the Ninja Tables plugin from the dashboard first and then click on the Edit option under the specific table.
- Next, click on the Add Column button.
- A pop-up will appear with the Advanced Settings located on the 2nd tab.
- This area contains many advanced options from which to choose. Each of these options is explained in detail below-
- Extra Classes: The Extra Classes help you customize your column more easily. Add Additional Custom CSS classes to the column and use space to separate each class.
- Give the particular column’s Extra Classes field a name first.
- Then select the Custom CSS/JS tab and enter your own CSS style there.
- This is how that particular column looked after Extra Classes were added.
- Max Width: To define the maximum width of a particular table column, use this option. Just add the maximum width of the column & this width will be applied throughout the whole column.
- Header Text Align: Use this option to align the column header text. You will have six options to choose from for alignment. From there, pick the correct text alignment option, which will only be applied to the header. Options include Center, Left, Right, Justify, Start, and End.
- Row Content Text Align: This option is nearly the same as the previous one, except this time, it’s for content in row text. You’ll have 3 options to choose from in a dropdown style. They are Center, Left, and Right. You can also find another checkbox option that allows for table header HTML content.
- Header HTML Content: Provide content for the table column header if you want to show HTML content. And then, it will override the column header then.
- Filterable: If you disable this, then the column data will not be filterable at the front end.
- Sortable: When this is disabled, the column data will not be sortable at the front end. Look at the below screenshot where the Sortable option is enabled.
- You can also disable the Sortable option by going to the Table Design tab.
- First, go to the Table Design tab → Features → Enable sorting of the table by the visitor. Just uncheck the Enable sorting of the table by the visitor option, and then the sorting option will be disappeared.
- Column Background: You can set a particular column’s background color to be displayed on the front end table.
- Column Text Color: With this, you can set a particular column’s Column Text color, which will be shown on the frontend table.
- Let’s have an example by providing all the options in all fields to the column.
- This is how the table looked after all the advanced options were added-
This is all about the Advanced Settings option for any specific column!
