Create a custom field plugin for Joomla 3.7

Create a custom field plugin for Joomla 3.7

Joomla's 3.7 core custom field system has spawned a new series of extension development, and the forward thinking developers at Joomla have made it so simple, a Geico caveman could do it.

The custom field plugin uses the JForm API so the standard Joomla field types as used in an extension's .xml file, are applicable, just written differently, in a .php file.

Here is how a calendar field is written in an xml file for other Joomla extensions

NOTE: This code is not part of the custom field, just shown as example.

<field 
name="mycalendar" 
type="calendar" 
label="Select a date"  
required="true" 
filter="user_utc"
showtime="false" 
todaybutton="true" 
filltable="true" 
translateformat="true" />

 

Create the plugin primary file

To do the same with a custom field plugin, the field type attributes must be set by the setAttribute() function which appends the onCustomFieldsPrepareDom() function.

<?php defined('_JEXEC') or die;

JLoader::import('components.com_fields.libraries.fieldsplugin', JPATH_ADMINISTRATOR);

class PlgFieldsMyCalendar extends FieldsPlugin {

	public function onCustomFieldsPrepareDom($field, DOMElement $parent, JForm $form) {
		$fieldNode = parent::onCustomFieldsPrepareDom($field, $parent, $form);

		if (!$fieldNode) {
			return $fieldNode;
		}
		
		$fieldNode->setAttribute('type', 'calendar');
		$fieldNode->setAttribute('singleheader', true);
		$fieldNode->setAttribute('todaybutton', true);
		$fieldNode->setAttribute('filltable', true);
		$fieldNode->setAttribute('translateformat', true);
		$fieldNode->setAttribute('filter', 'USER_UTC');

		return $fieldNode;
	}
}

 

The 'name' and 'label' attributes are not included. Both are taken from the Name and Label fields when a user creates a new instance of the custom field.

custom-fieldname.jpg

 

The class extension name must match the plugin file name

class PlgFieldsMyCalendar

file: mycalendar.php

 

Create the installer XML file as usual

<?xml version="1.0" encoding="utf-8" ?>
<extension type="plugin" version="3.7.0" group="fields" method="upgrade">
	<name>plg_fields_mycalendar</name>
	<author>CMSEnergizer.com</author>
	<creationDate>March 2016</creationDate>
	<copyright>Copyright (C) 2010 - 2017 CMSEnergizer.com. All rights reserved.</copyright>
	<license>GNU General Public License version 2 or later; see LICENSE.txt</license>
	<authorEmail>mail@cmsenergizer.com</authorEmail>
	<authorUrl>www.cmsenergizer.com</authorUrl>
	<version>1.0</version>
	<description>PLG_FIELDS_MYCALENDAR</description>
	<files>
		<filename plugin="mycalendar">mycalendar.php</filename>
		<folder>params</folder>
		<folder>tmpl</folder>
		<folder>language</folder>
	</files>
	<languages folder="language">
		<language tag="en-GB">en-GB/en-GB.plg_fields_mycalendar.ini</language>
		<language tag="en-GB">en-GB/en-GB.plg_fields_mycalendar.sys.ini</language>
	</languages>
</extension>

 

Create an options file

As with other Joomla extensions that can include option fields, the same is possible with custom fields, just done differently, yet still done simply with an XML file

params/mycalendar.xml

<?xml version="1.0" encoding="utf-8"?>
<form>

<fields name="fieldparams">
	<fieldset name="fieldparams">
		<field name="dateformat" type="list" label="Date Format" default="F jS Y">
			<option value="m/d/Y">01/07/2017</option>
			<option value="m-d-Y">01-07-2017</option>
			<option value="Y/m/d">2017/10/07</option>
			<option value="M. d Y">Jan. 07 2017</option>
			<option value="D d M. Y">Sat 07 Oct. 2017</option>
			<option value="l d M. Y">Saturday 07 Oct. 2017</option>
			<option value="l d F, Y">Saturday 07 October, 2017</option>
			<option value="F d, Y">October 07, 2017</option>
			<option value="F jS Y">October 7th 2017</option>
			<option value="F j, Y">October 7, 2017</option>
		</field>
	</fieldset>
</fields>

</form>

The options output

customfield-options.jpg

 

Create the output file

The frontend output file is simple. It just collects the user submitted value from the database and print.

tmpl/mycalendar.php

<?php defined('_JEXEC') or die;

$value = $field->value;
		
if ($value == '') {
	return;
}


if (is_array($value)) {
	$value = implode(', ', $value);
}


echo htmlentities( JHtml::_('date', $value, JText::_( $field->fieldparams->get('dateformat') )) );

 

The language files

language/en-GB/en-GB.plg_mycalendar.ini

This is needed to pass the type value

PLG_FIELDS_MYCALENDAR="Fields - My Calendar"
PLG_FIELDS_MYCALENDAR_LABEL="My Calendar (%s)"

 

language/en-GB/en-GB.plg_mycalendar.sys.ini

PLG_FIELDS_MYCALENDAR="Fields - My Calendar"

 

The output

calendar-plugin-output.jpg

 

Note about the plugin download below

This date custom field plugin was created for a user who wanted to use the Joomla content manager as an event listing, and they needed the listing to automatically un-publish at the date of the event. The option labeled Auto Set Create Date, when enabled, will update the database created and publish_down columns of the listed article, to the date set in the custom field.

autosetdate-expl.jpg

There will not be any new releases of this custom field plugin, so feel free to make it your own and edit the files as needed.

| June, 9th, 2017

 

Copyright © 2017 CMSEnergizer.com. All Rights Reserved.
This website is powered by the Joomla!©™ 3 Website Framework | File download and article manager component by K2 | Comment component by JoomlaTune | Advanced Module Manager and Modules Anywhere by NoNumber Elements | Website hosting and development by WebsiteDons

CMSEnergizer.com is owned and operated by Emuzement Net Inc, 4532 West Kennedy Blvd. Ste 180 33609 Tampa, Florida USA