AndyPi hosts websites for a few clients, mostly using WordPress, since it is easy to set up for us and easy to operate for the end user. All of the functionality is provided by additional plugins, but we wanted to have a small widget on the dashboard to show off and remind clients of the AndyPi brand, but also to be able to send a help email direct from the WordPress dashboard. You can find plugins to help you do this, but I thought it would be neater to make something myself and learn about how to program WordPress.

WordPress is coded using PHP, but in addition to this has an API of its own which you need to know how to use – but it does make a lot of things a lot easier. For example, wp_mail() is a function you can directly call from plugins to send an email, and it will pull the email settings from directly from the WordPress database (as long as you have it set up correctly).

PHP is a server side scripting language that can produce web pages on the fly. You can write code, and anything that you “echo” is directly sent as html. For our WordPress plugin there are three main sections in the code, which we’ll run through here.

1. Plugin header

<?php
/*
Plugin Name: AndyPi
Description: AndyPi.co.uk dashboard widget
Version:     1.0
Author:      AndyPi
*/

The above header is required for a WordPress plugin, starting with the standard opening php tag, followed by a multiline comment with minimum of name, description, version and author.

2. WordPress Dashboard hook

function add_andypi_dashboard_widgets() {
	wp_add_dashboard_widget('AndyPi', 'AndyPi.co.uk', 'andypi_widget_function');
}

add_action( 'wp_dashboard_setup', 'add_andypi_dashboard_widgets' );

This is where we meet the WordPress API. The add_action call is WordPress terminology is a ‘hook’. We ‘hook’ our code into a WordPress function, in this case ‘wp_dashboard_setup’, and it runs our function ‘add_andypi_dashboard_widgets’ every time, (you guessed it) the wordpress dashboard is loaded. Our ‘add_andypi_dashboard_widgets’ has another special WordPress API function ‘wp_add_dashboard_widget’. We have no need to write any custom html or positioning, or setting up how the dashboard will work – WordPress does this behind the scenes. It just needs to know the slug (short name) ‘AndyPi’, the title of the dashboard widget ‘AndyPi.co.uk’ and the name of the function to run when the widget is loaded ‘andypi_widget_function’.

3. Widget Function itself – for both GET and POST requests.

function andypi_widget_function() {
	echo 'Welcome to your AndyPi blog!<br>Please visit <a href="https://andypi.co.uk" target="_blank" >AndyPi.co.uk</a> for info on how to use the features.<br>For technical support enquiries, please use the form below or email [email protected] .';

	echo '<form name="andypi" action="'; echo admin_url(); echo '" method="post">
		<div class="textarea-wrap" id="description-wrap"><textarea name="email_body" class="mceEditor" rows="3" cols="15"></textarea></div>
		<input type="hidden" name="andypi_send_mail" value="True" />
		<p><input type="submit" value="Send Message" name="submit" class="button"/></p>
		</form>';
		 
		 if($_SERVER['REQUEST_METHOD']=='POST' && isset($_POST['andypi_send_mail'])) {
				
				$receiver_email_id = '[email protected]';
				$email_subject = 'AndyPi help request';
				$headers = array('Content-Type: text/html; charset=UTF-8');

				if(isset($_POST['email_body'])) {
					$email_body = nl2br(esc_attr($_POST['email_body']));
				} else{
					$email_body="Nothing sent...";
				}
			
				$lp_mail_report = wp_mail($receiver_email_id, $email_subject, $email_body, $headers);
				if(isset($lp_mail_report)) {
					$success = 'Message sent. You will receive a reply to your email address.'; 
					
				} else {
					$success = 'Message failed';
				}
		echo "<i>";
		echo $success;
		echo "</i><br>";
		echo $email_body;
		echo "<br>";
}
}
?>

When an html page is requested by a browser it can be of a number of different types. GET is the standard, which usually returns html to display, and POST is when submitting things like a form (user input field). Our plugin needs to be able to handle both – the function will be called whenever the plugin hook is called, GET or POST. We’ll always want to display the text and form. Our PHP code simply echos out the html needed. Note that the form action is admin_url, which just returns the page for the dashboard in WordPress.
After this, the final section of code only runs if a POST request has been submitted. This takes the text input from our form, and calls the wp_mail() function, another built in WordPress function that we supply the email, subject, message and headers to. The rest is done by WordPress! Finally we repeat the message to the user with a success or fail message, and close the PHP file with the ?> tag.

Plugin packaging
This code needs to be saved as a *.php file, in a folder with the same name as the plugin. This folder then needs to be compressed into a *.zip file. You can then upload it to WordPress through via Plugins > Add New > Upload. Simply activate it, and you are good to go. See https://github.com/andy-pi/wp_dash_plugin/ for the complete php file and zipped up plugin.

Here it is in action:
dash