Chapter 2: Approach 2 [Component override]
This alternative approach is for those where approach one will not work, and for those who are developers and don’t mind making changes to their component to add inline editing support.
Okay before we start, we are going to create a directory structure as follows:
+files_inlinemycck [FILES_INLINE + COMPONENT NAME] | ------+contexts | ---+mycck [COMPONENT NAME] | -----category.php [TYPE NAME as explained in XML] | -----item.php [TYPE NAME as explained in XML] | -----blog.php [TYPE NAME as explained in XML] | index.html | inlinemyck.xml [INLINE + COMPONENT NAME].xml
Do not worry about the content you need to put into the files for now, that will be explained in detail later, for now just create the folders and files for your component.
Now, don’t worry, the changes required here are few, in fact, it will just amount to a plugin call, simply, here and there.
The plugin mentioned above just requires two parameters.
- The text to add editable reason
- Configurartion settings
An example would be something like the following:
$dispatcher = JEventDispatcher::getInstance(); JPluginHelper::importPlugin('inline'); dispatcher->trigger('editable',array(&$text, array('id'=>$id,'context'=>$dataContext,'itemtype'=>$type)));
So, for our MyCCK component the configuration settings would be as follows:
- Id of current item
- Component name
- Item Type (Item, Category, and Blog)
- Type (Possible values are 'body' and 'title'. This defaults to 'body' and can be omitted. The value 'title' means no HTML will be allowed, and any found in the content will be stripped out)
So, in the default item layout, in our component, where we render out the main text for our item:
<div class="item-body"> <?php echo $this->item->text; ?> </div>
<div class="item-body"> <?php $dispatcher = JEventDispatcher::getInstance(); JPluginHelper::importPlugin('inline'); dispatcher->trigger('editable',array(&$this->item->text; array('id'=>$this->item->id,'context'=>mycck,'itemtype'=>’item’,html))); echo $this->item->text; ?> </div>
Yes, that is it.