Frontend Edit Button Plugin
The Frontpage Edit Button Plugin is for Grav CMS.
This plugin adds an 'edit this page' button on the frontend pages when logged in with a user account with admin rights. After clicking the button it will open the Admin Dashboard in another tab in your browser where you can start editing the page.
IMPORTANT (1): If no user is logged in as administrator (superuser), the button will show up only when this is explicitely set this in the plugin settings! By default a user has to be logged in to see the button.
IMPORTANT (2): You can't login from this plugin itself. You have to login by using the login to enter the Administrator Dashboard. When not logged in, the login dialog will be shown from GRAV CMS.
It will also work when you have an admin dashboard open in another tab of your browser. The moment you are logged in and are able to edit pages, the button will show up on the frontend pages. The moment you logout you are not able to edit any pages that are at that time displayed. The automatic refresh will prevent this.
This plugin requires that you have the following plugins installed and enabled:
Installing the Frontend Edit Button plugin can be done in different ways. The GPM (Grav Package Manager) installation method enables you to quickly and easily install the plugin with a simple terminal command, while the manual method enables you to do so via a zip file.
GPM Installation (Preferred) **
The simplest way to install this plugin is via the Grav Package Manager (GPM) through your system's terminal (also called the command line). From the root of your Grav install type:
bin/gpm install frontend-edit-button
This will install the Frontpage Edit Button plugin into your
/user/plugins directory within Grav. Its files can be found under
In the user/plugins folder of your site:
git clone https://github.com/enovision/grav-frontend-edit-button
To install this plugin, download the zip version of this repository and unzip it under
/your/site/grav/user/plugins. Then, rename the folder to
grav-frontend-edit-button. You can find these files on GitHub or via GetGrav.org.
You should now have all the plugin files under
Before configuring this plugin, you should copy the
user/config/plugins/grav-frontend-edit-button.yaml and only edit that copy.
Here is the default configuration and an explanation of available options:
Position of the button The following options are available:
- (tr) Top right (default)
- (tl) Top left
- (br) Bottom right
- (bl) Bottom left
Show the label on the button
Show icon (requires Fontawesome to be loaded, it works when you install the plugin
Markdown Font Awesome)
showIcon are disabled, it will use internally
showLabel = true automatically.
Only visible after login
When the plugin is enabled there is nothing else to do, it will show the button on the frontend pages.
It is possible however to switch the frontend editing off per page by adding the following to the header of a page (frontmatter):
This plugin has a simple mechanism build in that will react on a
focus of the browser tab involved.
The moment you click the button it will open the Dashboard in another tab in the browser. The moment you click back
on the page you have just left by clicking on the button, this page will automatically refresh.
This refresh will always execute when you leave (blur) the tab and click back (focus) on the tab with the presented page.
You can change the styling of the button by modifying the
style.scss file in the
It is required that the following CSS tags stay intact:
You can compile the SASS by entering in the root of /assets folder of this plugin
./sass.cmd. It is required that you have the compiler installed.
There is a languages file available for multilanguage support