Please upgrade here. These earlier versions are no longer being updated and have security issues.
HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.

How to add elements in Head?

CansiliCansili New
edited February 2016 in Vanilla 2.0 - 2.8

How would add the following elements in the head?

Meta Tag - I'd like to add
<meta name="viewport" content="width=device-width, initial-scale=1" /> just after the < title > tag. I have tried
public function base_render_before($Sender) { $Sender->Head->addTag('meta', array('name' => 'viewport', 'content' => "width=device-width,minimum-scale=1.0,maximum-scale=1.0")); }
but it's added after the CSS files, not after the < title > tag which is what I wanted.

JavaScript File - I'd like to add a JS file before any other JS files so I put
public function base_render_before($Sender) { $Sender->AddJsFile('myJavaScript.js'); }
but again it's added at the end of the JS files (after jQuery, jQuery UI, etc.). Is there any way I can insert it at the very top of them?

Also, which of these two is the correct one to use in theme hooks:

  • base_render_before (all small)
  • base_Render_Before
    ?

Lastly, may I know the reason why meta tags, scripts and CSS file inclusions were not just put into the Smarty template? Isn't it easier for theme authors? For example, some would not like jQuery UI and instead opted for individual plugins.

Comments

  • R_JR_J Ex-Fanboy Munich Admin

    It would either be Base_Render_Before (old convention) or base_render_before (current convention). If I remember correct, you've already decided to use your own convention, so feel free ;-)

    You can trick to put a script at the very first place in the list by adding it as a tag:

    public function base_render_before($sender) {
        if ($sender->Head) {
            $sender->Head->addTag(
                'script',
                array(
                    'src' => '/themes/....js'
                )
            );
        }
    }
    

    But there is no way to change the order of the tags in the head. They are sorted alphabetically (css, meta, script). This is done in the headmodule in the method tagCmp. You could raise an issue on GitHub and ask for a way to change that. I must say that i totally agree that meta tags should be inserted at first.

  • R_JR_J Ex-Fanboy Munich Admin

    And concerning why they are not set in the template: everything that is hard coded in the template can not be changed by plugins or themehooks. It would always require to replace the complete default.master. You can always remove a js file with removeJsFile() or clear alls js files with clearJsFiles
    If it may sound easier for themers at first, but it would be a no go for plugin developers.

  • R_JR_J Ex-Fanboy Munich Admin

    @R_J said:
    I must say that i totally agree that meta tags should be inserted at first.

    ... but after a little research I only found one meta where the position in the head might have influence: <meta charset="UTF-8">. This info could speed up some browsers slightly, so it should be placed above the title. Even W3C does it that way. Here is an example you can find online:

    <!DOCTYPE HTML>
      <HTML>
      <HEAD>
        <META CHARSET="UTF-8">
        <BASE HREF="http://www.example.com/">
        <TITLE>An application with a long head</TITLE>
        <LINK REL="STYLESHEET" HREF="default.css">
        <LINK REL="STYLESHEET ALTERNATE" HREF="big.css" TITLE="Big Text">
        <SCRIPT SRC="support.js"></SCRIPT>
        <META NAME="APPLICATION-NAME" CONTENT="Long headed application">
      </HEAD>
      <BODY>
    

    But that info is only important, if it hasn't been passed before. When a Garden controller is constructed, the charset is already passed in the http header. Therefore even the above mentioned meta tag does not need to be above the title.

    I guess there is no reason to change anything...

Sign In or Register to comment.