This tutorial is part of a series of tutorials based on the SportsPress for Football plugin.
Note. We assume you are a user of the SportsPress for Football plugin and have it installed already.
In this post, we’ll show you how to manage SportsPress football clubs on the frontend.
This can be useful if you are creating a platform for your clients on which they can manage clubs, matches, events, leagues, etc., from the frontend. You can use the SportsPress for Football plugin behind the scenes, and your users won’t have to deal with wp-admin on the backend to manage everything related to their soccer events and matches.
To create the necessary frontend pages, we will use the WP Frontend Admin plugin. This plugin allows you to display any wp-admin page on the frontend with a simple click or by using a simple shortcode on any WordPress page builder.
You can try the premium plugin on your website for free for 7 days.
Once you install and activate the plugin, you need to follow these steps to display and manage SportsPress football clubs on the frontend.
1- Show the SportsPres clubs list on the frontend
To display the SportsPress clubs list on the frontend, you have at least two options, both are really easy!
First, you can go to Clubs in wp-admin and click View on the frontend.
Second, you can use any page builder to create your frontend pages. Here are some page builders that are compatible with WP Frontend Admin:
- Elementor
- Visual Composer
- Gutenberg
- Divi
- Beaver Builder
- WP Page Builder
- Page Builder by SiteOrigin
- Oxygen
- Live Composer
- Brizy
- Etc.
Therefore, you can display the SportsPress football clubs on any page created with any of these page builders by using this shortcode:
[vg_display_admin_page page_url="edit.php?post_type=sp_team"]
Once you paste the shortcode, click Preview to view the football clubs on the frontend.
2- Start setting up your frontend SportsPress clubs page
WP Frontend Admin will display everything you need to configure your frontend pages in a simplified way on the Quick Settings panel on the left side of the screen.
You can start configuring your frontend clubs page by selecting the following information:
- Page title: Enter the new page title here.
- URL slug: Enter the URL slug using keywords only.
- Page template: We’ll select the Default template to keep using our theme’s settings. If you select the template on a page builder, this value will be inherited.
- Add page to this menu: Select the navigation menu where you want to add this page.
3- Remove any unnecessary elements from your frontend clubs page
WP Frontend Admin allows you to hide any unnecessary elements from your frontend pages to simplify the pages and remove all the fields and metaboxes that your users don’t need to create and manage football clubs on the frontend.
Just follow these simple steps:
- Click Hide element.
- Click the element you want to hide.
Keep in mind that you need to repeat these two simple steps with every element you want to hide from your frontend clubs page.
Also, you can toggle the Hide notices added by other plugins or themes checkbox to prevent users from seeing unnecessary elements that may appear in the future.
4- Edit any texts on your frontend clubs page
With WP Frontend Admin, you can also edit any text on the admin pages on the frontend. This allows you to customize the admin content displayed on the frontend completely.
Just follow these simple steps to edit any text on your frontend SportsPress clubs page.
- Click Edit texts.
- Edit all the texts you want.
- Click Stop editing texts.
5- Hide any unnecessary columns and publish the page
Since this page will show the list of SportsPress clubs on the frontend, you can hide some columns to simplify the page. Just tick the unnecessary columns on the Disabled Columns section.
Also, you can tick the The users should see the posts created by them only checkbox to make sure users will be able to see and manage their own clubs only.
Finally, you can click Save to apply the changes and publish the frontend SportsPress football clubs page.
6- Optional: Edit the add new/edit football club form on the frontend
In addition to configuring the list of football clubs on the frontend, you can configure the add new or edit football club form.
You can click Add New or open an existing club to hide any unnecessary elements and edit the texts. This way you will customize your page even more and simplify your users’ experience.
Manage SportsPress clubs on the frontend
This is how our SportsPress clubs page looks on the frontend. Users can see the list of football clubs, search for specific clubs, apply bulk actions to dozens of football clubs, etc.
And this is how the Add New/Edit football club form looks on the frontend. As you see, we’ll showing only essential elements on the form, but you can hide any other element to simplify the page even more.
Important notes
- Take into account that only users with the edit_sp_clubs capability will be able to manage clubs on the frontend. You can follow this tutorial to learn how to assign that capability to any other user role.
- Since the Clubs section includes the leagues table page, you can follow the same process to create the frontend leagues table page.
- If you use a page builder, you can use the following shortcode:
[vg_display_admin_page page_url="edit.php?post_type=sp_table"]
As you see, it’s really simple to display and manage SportsPress football clubs on the frontend because you don’t need to program anything. WP Frontend Admin makes the task really simple for you.
You can try the premium plugin on your website for free for 7 days.