3.4
3.3
Your plugin may require additional CSS or JavaScript code to run. The TemplateManager includes helper functions to load scripts and styles.
use APP\template\TemplateManager;
$templateMgr = TemplateManager::getManager($request);
$templateMgr->addStyleSheet('tutorialExampleStyles', 'http://example.com/my-css.css');
$templateMgr->addJavaScript('tutorialExampleScript', 'http://example.com/my-script.js');
Scripts and styles may be located in the plugin’s directory. Use the base_url to get the URL to a plugin’s root directory.
use APP\core\Application;
use APP\template\TemplateManager;
$request = Application::get()->getRequest();
$url = $request->getBaseUrl() . '/' . $this->getPluginPath() . '/css/my-css.css';
$templateMgr = TemplateManager::getManager($request);
$templateMgr->addStyleSheet('tutorialExampleStyles', $url);
Scripts and styles should be loaded in the plugin’s register method.
namespace APP\plugins\generic\tutorialExample;
use APP\core\Application;
use APP\template\TemplateManager;
use PKP\plugins\GenericPlugin;
class TutorialExamplePlugin extends GenericPlugin
{
public function register($category, $path, $mainContextId = NULL)
{
$success = parent::register($category, $path);
if ($success && $this->getEnabled()) {
$request = Application::get()->getRequest();
$url = $request->getBaseUrl() . '/' . $this->getPluginPath() . '/css/my-css.css';
$templateMgr = TemplateManager::getManager($request);
$templateMgr->addStyleSheet('tutorialExampleStyles', $url);
}
return $success;
}
}
By default, scripts and styles are loaded on the reader-facing website. Pass a context argument to load them in the editorial backend.
$templateMgr->addStyleSheet(
'tutorialExampleStyles',
$url,
['contexts' => 'backend']
);
You can pass more than one context to load them in two places.
$templateMgr->addStyleSheet(
'tutorialExampleStyles',
$url,
['contexts' => ['backend', 'frontend']
);
View more examples.