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

Adding CSS template to head?

Discussion in 'XenForo Development Discussions' started by Renari, Dec 3, 2012.

  1. Renari

    Renari Member

    I thought something like
    PHP:
        public static function templateHook($hookName, &$contents, array $hookParamsXenForo_Template_Abstract $template)
        {
            if (
    $hookName == 'page_container_head')
            {
                
    $contents .= '<xen:require css="style.css" />';
            }
    would work however it seem that this is run after template syntax is evaluated, I also tried outputting the css using $template->create() which also failed miserably.
     
  2. Chris D

    Chris D XenForo Developer Staff Member

    Hi Renari, this is the correct way (as you've ascertained, <xen tags do not work in template hooks as they are processed prior to the hook code being inserted therefore, they get missed):

    PHP:
     public static function templateHook($hookName, &$contents, array $hookParamsXenForo_Template_Abstract $template)
        {
            if (
    $hookName == 'page_container_head')
            {
                
    $template->addRequiredExternal('css''style.css');
            }
    EDIT: By the way, this can also be used to include javascript (just change 'css' to 'js' and the template name to the path to your js file, e.g. 'js/addon/javascript.js'
     
    Adam K M likes this.
  3. Renari

    Renari Member

    Thanks Chris, however that doesn't seem to be adding the required css to the page either. I also tried storing it as a file instead of a template and linking to it like you mentioned with a javascript file but that also didn't work.

    PHP:
    public static function templateHook($hookName, &$contents, array $hookParamsXenForo_Template_Abstract $template)
        {
            if (
    $hookName == 'page_container_head')
            {
                
    $template->addRequiredExternal('css''styles/addon/style.css');
            }
     
  4. Chris D

    Chris D XenForo Developer Staff Member

    It definitely works, I've just tried it myself.

    Bear in mind that it will be added alongside all of the other css files that are included in the page, e.g:

    HTML:
    <link rel="stylesheet" href="css.php?css=Gritter,GritterEXTRA,bb_code_button,moderator_bar,node_category,node_forum,node_list,node_page,sidebar_share_page,social_connect_auth,waindigo_debug_info_debugonpost,waindigo_loginasuser&amp;style=1&amp;dir=LTR&amp;d=1354564584" />
    It should be in there somewhere, just somewhat difficult to spot.

    Have you created a code event listener etc. in the admin CP?
     
  5. Renari

    Renari Member

    Right, I'm seeing that however the contents aren't being added to the css being output by that.
    HTML:
    <link ref="stylesheet" href="css.php?css=moderator_bar,node_category,node_forum,node_list,node_page,sidebar_share_page,style.css&style=1&dir=LTR&d=1354571168">
    Checking the css being output at css.php?css=moderator_bar,node_category,node_forum,node_list,node_page,sidebar_share_page,style.css&style=1&dir=LTR&d=1354571168 I find...

    http://pastebin.com/0xCZPymx

    The css I've added in the style.css template is not here.
     
  6. Chris D

    Chris D XenForo Developer Staff Member

    I'm sorry, I made a mistake.

    In your template hook, you do not need to put ".css" at the end.

    PHP:
    $template->addRequiredExternal('css''style');
     
  7. Renari

    Renari Member

    Thanks, not sure why I didn't try that considering none of the other files listed had css extensions in the include.
     
    Chris D likes this.
  8. abdfahim

    abdfahim Active Member

    Sorry to dig up an old post. I am trying to make my first add-on, to put some styled text in the hook "ad_header".

    So, below is my listener class, it correctly shows the text in the place. But I can't style the text using the css file I put in library/MyName/myname_style.css.

    I have 2 questions please,

    1. Why the CSS is not working
    2. Is it the correct way to style my add-on?

    Code:
    class MyName_Listener
    {
        public static function templateHook($hookName, &$contents, array $hookParams, XenForo_Template_Abstract $template)
        {
            if($hookName == 'ad_header')
            {
                $contents.= '<div class="myname-header" >THIS IS TEST</div>';
            }
          
            if ($hookName == 'page_container_head')
            {
                $template->addRequiredExternal('css', 'library/MyName/myname_style');
            }
        }
    }
     
  9. Brogan

    Brogan XenForo Moderator Staff Member

    If you are just modifying templates, why don't you just use the template modification system?
     
    abdfahim likes this.
  10. abdfahim

    abdfahim Active Member

    Actually, my main intention is to learn the XF system, otherwise I could just add that line in ad_header template.
     
  11. Brogan

    Brogan XenForo Moderator Staff Member

    That's fair enough, but there is no need to use PHP if you are just injecting your own CSS/templates into core templates.
     
    abdfahim likes this.

Share This Page