FreePress Blog

Extending the WP MobileAdmin Plugin : Section 3

*NOTE - this page picks up on the sample used in the “Basics” section, and assumes you’ve read that one, so it will only explain the parts that have changed.

The sample we covered in the “Basics” section contained everything you need in order to create a new plugin, but in order for that plugin to actually behave any differently than the default plugin that it’s inheriting all it’s behavior from, you’ll need to add a few more lines of stuff.

CSS

Here’s the sample plugin from the “Basics” page, with a few lines added to allow us to attach our own CSS files and have them be loaded with the page:

<?php
class SamplePlugin_MobileAdmin extends MobileAdmin {
   var $Name = "SamplePlugin";
   var $MatchingUserAgents = array('SampleUserAgent');

   function GetCSSLinks() {
      $cssFiles = array(’sample.css’);
      return $this->GetLinks($cssFiles,dirname(__FILE__) . “/css/”);
   }

}
$MAController->RegisterMobileAdminPlugin('SamplePlugin_MobileAdmin');
?>

As you can see, we added the GetCSSLinks function, which tells our plugin that there are CSS files we want to include when our plugin is used to render the page, and specifies where to find them.

The first line will create an array of file names that should contain all the css files you’d like to include. In this sample, we’re just using one, called ’sample.css’.

The second line will be used by the plugin to locate and build CSS links (for the header) for the files in your array above, and tell it to get them from the ‘css’ subdirectory of your plugin. I recommend not changing this line, although if you really want to store your css files in a different directory, just remember to set that name in this line.

Javascript

Adding javascript links works exactly the same way as described above for CSS links, just using a function with a slightly different name, but very similar structure:

	function GetScriptLinks() {
		$jsFiles = array('SamplePlugin.js');
		return $this->GetLinks($jsFiles,dirname(__FILE__) . "/js/");
	}

Conclusion

This should give you everything you need to build “skin” type plugins, where you’re adding style (via CSS) or client-side behavior (via script) to the basic structure that the MobileAdmin plugin provides. If you’d like to do further customizations, many more potential extension methods are covered in the advanced section of this guide.