[WP-TABLE RELOADED] Easy way for client to right-align currency data

Hi,

thanks for your post.

Unfortunately, I don’t yet have an idea for a quick and easy, ready-to-use solution.

The main question basically is:
Do all tables (in WP-Table Reloaded) on that site have three columns, where the third column contains a currency value that shall be right aligned?
If that’s the case, just a small piece of CSS is necessary.

If not, we could use a filter hook to add a CSS class to all cells that contain the $ symbol (as that’s going to be a cell with a currency value obviously), and then use that CSS class to align the text to the right.

Regards,
Tobias

Hi TobiasBg,

Thank you for your response; I appreciate you answering my question.

No, the tables in the site are in different formats. Some of them provide an index to publications that can be downloaded, with no currency values included. Therefore, adding one-size-fits-all-tables CSS isn’t an option.

So, on to option two: adding a filter hook that triggers right-align when the cell contains a $ symbol. That sounds like something that could work. How do I do that?

Thanks!

ea/

Hi,

ah, ok, that’s what I thought.

Then lets try the filter hook idea.
You’ll basically just need to create a new “Plugin Extension” for WP-Table Reloaded, which is described here: https://tobias.baethge.com/wordpress-plugins/wp-table-reloaded-english/extensions/

The relevant code to add a CSS class “currency-value” to all cells with a “$” symbol is this (I just went ahead and developed it for you ?? ):

function wp_table_reloaded_cell_class_currency_value( $class, $table_id, $row, $column, $cs, $rs, $cell_content ) {
	if ( false !== strpos( $cell_content, '$' ) )
		$class .= ' currency-value';
	return $class;
}
add_filter( 'wp_table_reloaded_cell_css_class', 'wp_table_reloaded_cell_class_currency_value', 10, 7 );

This code basically checks the cell content of each table, on whether it contains an $ somewhere. If it does, the CSS class “currency-value” is added to the cell.
This then gives us the possibility to use the following CSS code (which needs to be added to the “Custom CSS” textarea on the “Plugin Options” screen). That code will right-align all cells that have the class “currency-value”.

.wp-table-reloaded .currency-value {
	text-align: right !important;
}

Regards,
Tobias

Hi Tobias,

I’m really grateful for your help. However, I seem to be missing something, as the numbers are not yet right-aligning in my practice post (scroll down to the second and third tables):

https://www.kiangle.com/demo-right-justify-a-column-in-wp-table-reloaded/

Here is what I did.

1. Went to your post on creating an extension file for wp-table-reloaded, https://tobias.baethge.com/wordpress-plugins/wp-table-reloaded-english/extensions/

2. I created a new document in TextEdit called wp-table-reloaded-extensions.php, with this “assembled” code in it (select-all-copy-paste):

<?php
/*
Plugin Name: WP-Table Reloaded Extensions
Plugin URI: https://tobias.baethge.com/wordpress-plugins/wp-table-reloaded-english/extensions/
Description: Custom Extensions for WP-Table Reloaded
Version: 1.0
Author: Tobias Baethge
*/

// 

function wp_table_reloaded_cell_class_currency_value( $class, $table_id, $row, $column, $cs, $rs, $cell_content ) {
	if ( false !== strpos( $cell_content, '$' ) )
		$class .= ' currency-value';
	return $class;
}
add_filter( 'wp_table_reloaded_cell_css_class', 'wp_table_reloaded_cell_class_currency_value', 10, 7 );

?
?>

3. I saved the file and uploaded it to the plugins folder on my server ( /wp-content/plugins ), and not into the wp-table-reloaded folder, as per the instructions in your post on creating extensions.

4. Then I went into Plugins Options for wp-table-reloaded. I copy-pasted the following into the Custom CSS box and selected the checkbox:

.wp-table-reloaded .currency-value {
	text-align: right !important;
}

I must be missing something, even after triple-checking it. Can you see where I may be going wrong?

Thanks so much! (Hoping this will be helpful for others, too!)

ea/

Hi,

that looks great so far, and you did everything correct! ??

Just one more small step: As the wp-table-reloaded-extensions.php file that you created is a new (though small) WordPress plugin, you have to activate it, just like any other plugin. So, in your Dashboard, go to “Plugins”, and in that list you’ll find a new plugin “WP-Table Reloaded Extensions” which you’ll just have to activate there.

Best wishes,
Tobias

Hi Tobias,

I’m afraid I’m getting this message when I try to activate the plugin:

se error: syntax error, unexpected T_FUNCTION in /home6/letaloui/public_html/kianglecom/wp-content/plugins/wp-table-reloaded-extensions.php on line 16

This is what the full code looks like, and line 16 starts with “function”

<?php
/*
Plugin Name: WP-Table Reloaded Extensions
Plugin URI: https://tobias.baethge.com/wordpress-plugins/wp-table-reloaded-english/extensions/
Description: Custom Extensions for WP-Table Reloaded
Version: 1.0
Author: Tobias Baethge
*/

/*
* Extension: Check for $ in cell to tag cell as currency-class value
*/

//

function wp_table_reloaded_cell_class_currency_value( $class, $table_id, $row, $column, $cs, $rs, $cell_content ) {
	if ( false !== strpos( $cell_content, '$' ) )
		$class .= ' currency-value';
	return $class;
}
add_filter( 'wp_table_reloaded_cell_css_class', 'wp_table_reloaded_cell_class_currency_value', 10, 7 );

?>

I’ve looked through this guide on PHP, https://www.brandonsavage.net/how-to-write-a-function-in-php/, but still can’t figure out what the syntax error is.

Please advise!

Getting close…

??

Many thanks,

ea/

Oops… sorry, missed the beginning of the error message in my copy-paste (although I’m sure you can figure it out still):

Plugin could not be activated because it triggered a fatal error.

Parse error: syntax error, unexpected T_FUNCTION in /home6/letaloui/public_html/kianglecom/wp-content/plugins/wp-table-reloaded-extensions.php on line 16

Sorry.

ea/

Hi,

that’s odd. I just copied the code and tried myself, and I don’t get any errors. Also, I can’t spot any mistakes in the code, that could cause this error message…

Now, it might be possible that there’s some “invisible white-space” in the file somehow (from copy&paste), that could be causing this.
Can you try removing it, by editing the file like this:
Place the cursor right in front of the “f” in function, in line 16. Then press the Backspace key several times, until the cursor/caret is right behind the / in the */ line. (Yes, this will remove the //, which is ok.)

If that does not fix it, please contact me by email (the address is in the main plugin file “wp-table-reloaded.php”. I would then like to take a direct look at the file.

Regards,
Tobias

Hi Tobias,

Sorry to create such a puzzle for you!

Now the error has moved to Line 12, so I’ll drop you a note.

Thanks for your help!

(Let’s post the solution here when we solve it?)

ea/

Hi,

just as a short update for everybody else:

After taking a direct look at the file in question, we found that there was some invisible white-space at the end of the file, which seems to have caused this. It probably crept up from some copy&paste operation.
Removing the white-space allowed the plugin to be activated, and it is now working as intended ??

Best wishes,
Tobias

Thank you for your help, Tobias!

??

ea/

Hi,

no problem, you are very welcome! Good to see that it works ??

Best wishes,
Tobias

Hi Tobias,

I had a similar issue today – white-space was causing a Parse error: syntax error, unexpected T_FUNCTION when I tried to activate extension plugin. I had copied the code directly from your website. I fixed it by first pasting the code into TextEdit and making it plain text. Then copied this into my file.

(awesome plugin by the way)

Hi,

ah, you are refering to https://www.ads-software.com/support/topic/plugin-wp-table-reloaded-custom-name-in-the-admin-menu

Great that you found the solution. Yes, some weird things with white-space seem to be going on right now… I checked the code on my site again, but couldn’t anything… Really weird…
In general, removing all line breaks temporarily (and inserting them by manually typing them again), seems to fix this.

Best wishes,
Tobias

Tobias,

Sorry for adding to an 8 month old post but I’m using your code from this page and noticed an issue that I’m hoping you can help with. When you add a $ sign to the field it changes the type from numeric to alpha which changes the results from the Table Tools sort function.

The column is right justified but the numbers are sorted by the first char value rather then the numbers value. So for example, 350 comes before 90 and after 2000.

the numbers look like this now:
1
10
100
2
20
200

is there a way to change they type back to number and still display the $ sign?

Thanks,

Kevin