• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

Add external JS and CSS files in an Add On

abdfahim

Active member
#1
Hi,

I want to add external JS and CSS file in my addon.

1. For JS file, I tried using template hook "page_container_js_body" in the following way, but it fails.

Code:
if($hookName == 'page_container_js_body')
{
            $contents = "<xen:require js=\"js/MyTest/owl.carousel.min.js\" />.$contents;
}
However, I can add inline JS with the same command without an issue. Also, I can add the JS file with simple template modification just by adding following line in page_container_js_body template
Code:
<xen:require js="js/MyTest/owl.carousel.min.js" />
2. How to add external CSS files in an add on. Should I just create a new template copying that CSS file?
 

abdfahim

Active member
#2
For JS, I created a new template "mytest_owl_js" in master style

mytest_owl_js:
Code:
<xen:require js="js/MyTest/owl.carousel.min.js" />
Then used following code,
Code:
public static function templateHook($hookName, &$contents, array $hookParams, XenForo_Template_Abstract $template)
    {
        if($hookName == 'page_container_js_body')
        {
            $contents .= $template->create('mytest_owl_js');
        }
    }
Hope I am doing it right.

Also, still not sure how to add the external CSS.