How to insert the link taken from the Link Provider to the content editor
From TomatoCMS Documentation
At the article adding/editing page, we call all hook which has been applied for a target named News_Article_Add_ShowSidebar to show other elements which user want to have in the right side of these pages.
You can see the following line in /application/modules/news/views/scripts/article/add.phtml and /application/modules/news/views/scripts/article/edit.phtml
Tomato_Hook_Registry::getInstance()->executeAction('News_Article_Add_ShowSidebar');
So, create new hook, and apply it for News_Article_Add_ShowSidebar target.
Contents |
Create hook directory
In the /application/modules/news/hooks/ directory, create a sub-directory named internallinks. It is also the hook name.
In the hook directory, I create a file named about.xml which is used for storing the hook information.
Put the following content to this file:
/application/modules/news/hooks/internallinks/about.xml:
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE hook SYSTEM "http://schemas.tomatocms.com/dtd/hook_about.dtd"> <hook> <name>InternalLinks</name> <module>news</module> <description><![CDATA[Insert the links taken from Link Provider to the editor]]></description> <thumbnail></thumbnail> <author>TomatoCMS Core Team</author> <email>core@tomatocms.com</email> <version>2.0.8</version> <license>free</license> </hook>
Also, in the hook directory, we have to create a file named Hook.php and create a class that extends from Tomato_Hook class:
/application/modules/news/hooks/internallinks/Hook.php:
<?php class News_Hooks_InternalLinks_Hook extends Tomato_Hook { public static function action() { echo 'Internal Links'; } }
There are two kinds of hook:
- filter, which is used to filter the value.
The filter hooks have to contain the method named public static function filter and this method has to return the value.
- and action, which is use to process the data and don't need to return the value.
This kind of hook has to implement method named public static function action.
Our hook will be used to show the Link Provider, and it will be the action hook, not the filter hook.
Install hook
In the back-end section, go to the System > Extend > Hook menu, click on the news label from the list of modules and click on the Install button in the internallinks hook section.
You will see that all the hook information here (1, 2, 3, 4) are taken from the hook information file (about.xml).
Apply hook
We will apply our hook for a target named News_Article_Add_ShowSidebar.
Go to the System > Extend > Hook Target menu, select the internallink from the list of available hook (1) associating with News_Article_Add_ShowSidebar section, and click on the Add link (2).
Next, if you go to the adding article page, you will see the "Internal Links" message which comes from News_Hooks_InternalLinks_Hook ::action method.
Implement hook
As you see, the hook works. Now, it is the time to implement the hook feature:
- Show Link Provider
- Insert the link to article content editor when user click on the link
In the hook directory, I create a file named show.phtml which will be used as view script.
We can render this script by calling:
/application/modules/news/hooks/internallinks/Hook.php
<?php class News_Hooks_InternalLinks_Hook extends Tomato_Hook { public static function action() { // (1) $viewRenderer = Zend_Controller_Action_HelperBroker::getStaticHelper('viewRenderer'); $view = $viewRenderer->view; // (2) $view->addScriptPath(dirname(__FILE__)); // (3) echo $view->render('show.phtml'); } }
I am sure that you are familiar with the lines I used above:
- (1): Get the view instance
- (2): Add current hook directory to the list of directories where the view can find the script to render
- (3): Render the script
In the view script (show.phtml), I use the LinkProvider view helper (provided by core module) to show the Link Provider:
/application/modules/news/hooks/internallinks/show.phtml
<div class="t_a_bottom">
<div class="t_a_ui_helper_line">
<h3>Internal Links</h3>
</div>
<div>
<div class="t_a_bottom">
Click on the link below to insert it to the content editor:
</div>
<div class="t_a_bottom">
<?php echo $this->linkProvider(array('jsCallback' => 'insertLinkToEditor')); ?>
</div>
</div>
</div>
<script type="text/javascript">
function insertLinkToEditor(route, href, title) {
alert('route=' + route + '; href=' + href + '; title=' + title);
};
</script>Note that I passed insertLinkToEditor to jsCallback parameter.
This is name of callback method used to handle when user click on the link from Link Provider.
The callback method has three parameters which are described as following:
- route: The route associating with the link
- href: The link target
- title: The link title
For example, if you click on the Homepage link from Link Provider, then you will get:
route = core_index_index
href = /tomatocms/index.php/en_US/
title = Homepage
Now, the remaining task is very simple. Just insert the selected link to TinyMCE Editor by using:
function insertLinkToEditor(route, href, title) { tinyMCE.getInstanceById('content').execCommand('mceInsertContent', false, '<a href="' + href + '">' + title + '</a>'); };
The result is great:





