How to customize the team information areas

Sports Bench has two areas that list out team information by default. These consist of the team stadium, head coach and the team logo. But you can customize these areas by adding filters to change the output to make it show what you want.

Here’s how you can customize the team information sections.

Creating a new filter

So the way to customize both areas will involve creating filters to change the data that is displayed. You can learn more about how to create and add filters on the WordPress codex.

But the basic gist of adding filters is that you create a custom function and then use add_filter to hook it into a filter. When the filter is applied to that section, it will be run through your function.

Don’t worry, we’ll go through the specifics for each of the team information filters.

Team Page

The first location for team information is the team page. If you’re using the Sports Bench theme or are using the team page shortcode to power the page, this section appears in the lower right side of the page.

To change this information, you’ll need to use the sports_bench_team_info filter accomplish your goal. Here’s the default for that section. You can use it as a guide for your custom filter function.

function sports_bench_do_team_info( $html, $team ) {
 $html .= '<div class="right">';
 $html .= $team->get_team_photo( 'team-logo' );
 $html .= '</div>';
 $html .= '<p>';
 $html .= __( 'Location', 'sports-bench' ) . ': ' . $team->team_city . ', ' . $team->team_state . '<br />';
 $html .= __( 'Stadium', 'sports-bench' ) . ': ' . $team->team_stadium . '<br />';
 $html .= __( 'Head Coach', 'sports-bench' ) . ': ' . $team->team_head_coach . '<br />';
 $html .= '</p>';

 return $html;
}
add_filter( 'sports_bench_team_info', 'sports_bench_do_team_info', 10, 2 );

You can remove this default filter by running remove_filter( 'sports_bench_team_info', 'sports_bench_do_team_info' );.

Team Listing Page

The other location is the team listing page. This is the page where all of the teams are listed and you can click on them to enter their respective team pages.

Fortunately, the process for adding your own custom filter here is essentially the same as the team information section. The only difference is that we’re using the sports_bench_team_listing_info filter.

So, the default filter for that section looks like this:

function sports_bench_do_team_listing_info( $html, $team_id, $team_name, $num_teams, $count ) {
 $current_team = new Sports_Bench_Team( (int)$team_id );
 if ( $count % 2 == 0 ) {
 $html .= '<div class="row sports-bench-row">';
 }
 $html .= apply_filters( 'sports_bench_before_team_listing', '', $current_team );
 $html .= '<div class="large-6 medium-6 small-12 columns">';

 $html .= '<a href="' . $current_team->get_permalink() . '">';

 $html .= '<div class="team-info clearfix">';

 $html .= '<h4 class="team-name">' . $team_name . '</h4>';

 $html .= '<div class="right">';
 $html .= $current_team->get_team_photo( 'team-logo' );
 $html .= '</div>';

 $html .= '<p>';
 $html .= $current_team->get_division_name() . '<br />';
 $html .= __( 'Location', 'sports-bench' ) . ': ' . $current_team->team_city . ', ' . $current_team->team_state . '<br />';
 $html .= __( 'Stadium', 'sports-bench' ) . ': ' . $current_team->team_stadium . '<br />';
 $html .= __( 'Head Coach', 'sports-bench' ) . ': ' . $current_team->team_head_coach . '<br />';
 $html .= '</p>';

 $html .= '</div>';

 $html .= '</a>';

 $html .= '</div>';
 $html .= apply_filters( 'sports_bench_after_team_listing', '', $current_team );
 if ( ( $count % 2 == 1 ) or ( $count == $num_teams - 1 ) ) {
 $html .= '</div>';
 }
 $count++;

 return $html;
}
add_filter( 'sports_bench_team_listing_info', 'sports_bench_do_team_listing_info', 10, 5 );

And that’s it. I hope these filters help you in customizing Sports Bench to make it work for your site. Feel free to visit the Codex and How To’s pages to learn more about what you can do to extend Sports Bench.