This tutorial will show you how to override plugin template files. We will extend the plain game layout with additional data.
Before / After
Default layout (BEFORE)
Modified layout (AFTER)
Step 1 – Add Shortcode to a page
First of all, we should add a shortcode to a page.
[anwpfl-matches type="fixture" limit="1" filter_by_clubs="21761"
days_offset="-1" layout="plain"]
We we use days_offset=”-1″ to hide postponed games and layout=”plain” !!!
Add your website club ID in the “filter_by_clubs” argument.
Step 2 – Override Template
Download and install a helper plugin to override templates.
– https://github.com/anwppro/anwp-fl-templater/releases/download/v0.1.0/anwp-fl-templater.zip
Copy template from
<your site root>/wp-content/plugins/football-leagues-by-anwppro-premium/templates/match/match–plain.php
to
<your site root>/wp-content/plugins/anwp-fl-templater/templates/match/match–plain.php
Make some changes in “/anwp-fl-templater/templates/match/match–plain.php” to check that everything works.
Step 3 – Modify Template
Open “/anwp-fl-templater/templates/match/match–plain.php” file for editing and make the changes you want.
Below you will find a code used in our example.
<?php
/**
* The Template for displaying Match (plain version).
*
* This template can be overridden by copying it to yourtheme/anwp-football-leagues/match/match--plain.php.
*
* @var object $data - Object with shortcode args.
*
* @author Andrei Strekozov <anwp.pro>
* @package AnWP-Football-Leagues/Templates
* @since 0.14.8
*
* @version 0.14.8
*/
if ( ! defined( 'ABSPATH' ) ) {
exit;
}
$data = (object) wp_parse_args(
$data,
[
'club_home_title' => '',
'club_away_title' => '',
'permalink' => '',
]
);
?>
<div class="match-plain">
NEXT MATCH - <?php echo esc_html( $data->club_home_title ); ?> vs <?php echo esc_html( $data->club_away_title ); ?>
/ <?php echo esc_html( date_i18n( 'j F Y', get_date_from_gmt( $data->kickoff, 'U' ) ) ); ?>
<?php if ( $data->stadium_id ) : ?>
/ <?php echo anwp_football_leagues()->stadium->get_stadium_title( $data->stadium_id ); ?>
<?php endif; ?>
</div>
Useful Tips 1 – Query Monitor
You can see all available data in the $data variable with the help of the awesome Query Monitor plugin.
Install Query Monitor – https://wordpress.org/plugins/query-monitor/
Add in your code (see the screenshot)
do_action( 'qm/info', $data );
Open logs in the dropdown admin menu and check all available data.
Useful Tips 2 – PHP date format
If you want, you can change the date format. A list of all available characters you will find here – https://www.php.net/manual/en/datetime.format.php