How to add a new Column Header inside WPUF Dashboard Table

In this post, I will serve on how to add a new Column Header on your WP User Front-end Dashboard Table.

Before stepping, tell me why/when do you need this?

Okay, imagine working on a site where you will get information alongside any File/Media info. So by default, in the WPUF dashboard, it won’t let you add all of your custom fields meta.

In this case, you will need to customize the table dashboard to place any custom fields meta info. In most cases, showing custom fields with WordPress get_post_meta() is easy to manipulate, but it’s getting a bit complicated once you deal with the File/Media direct URL/Link.

So I will show you how you can get and display the File/Media link on your dashboard table.

Process

This is a default view of the WPUF Dashboard Table.

As you can see, the Dashboard is consists of 04 Heading Element- Title, Status, Payment, Options.

 image

And after the final touch of our work-around, it will look like this.

 image

Things to do

Don’t forget that the associated Download File Link is coming from the post meta, so first, you need to ensure that the File Upload field is predefined on the Post/Form.

First, I’m creating a post form with the File Upload field and making a post to populate the associated File Upload field’s link on the Dashboard Table.

Code-base

The below code snippet will add a column header on the Dashboard Table.

/**
* @Add a new column header in dashboard table
* @param array $args dashboard query arguments
* @return void
*/
function wpufe_dashboard_change_head( $args ) {
printf( '<th>%s</th>', __( 'Files', 'wpuf' ) );
}
add_action( 'wpuf_account_posts_head_col', 'wpufe_dashboard_change_head', 10, 2 );


/** Add a new table cell to the dashboard table rows.
* It adds a form for changing the post status of each post via ajax call.
* @param array $args dashboard query arguments
* @param object $post current rows post object
* @return void
* @output of the below code will be like https://prnt.sc/tapb0o
*/


function wpufe_dashboard_row_col( $args, $post ) {
?>
<td>
<?php
 // retrieve file of the custom field (you need to modify the custom filed meta_key on your own)
if ( $file = get_post_meta($post->ID, 'file_upload', 1) ) {

//get the file attachment link
$filelink = wp_get_attachment_link($file);

//Print-Show the File link on the dashbaord
echo $filelink;


} else {

echo '—';

}
?>
</td>
<?php
}
add_action( 'wpuf_account_posts_row_col', 'wpufe_dashboard_row_col', 10, 2 );

The below code snippet will add a column header on the Dashboard Table.

 image

Now, we need to call & retrieve the Download File to make it appear on the Frontend Dashboard. The above code will make the Downloadable file appear on the front-end dashboard.

 image

Side Note

  1. Make sure the custom field meta_key name is according to your custom field’s meta name (like this).
  2. And you call the file attachment link of the file with wp_get_attachment_link otherwise it will let the user download the file throughout the link.

Wrapping-up

So this is fair enough to push the brain harder for today! 

I hope this will help you make the file download link appear on the front-end dashboard.

MM Aurangajeb
MM Aurangajeb

Spreading Happiness. Support Engineer, WordPress Enthusiast, Blogger.

Articles: 18

Newsletter Updates

Enter your email address below to subscribe to our newsletter

Leave a Reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.