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

Where is the best place to call a JS file so It is called before the body.

EQnoble

Well-known member
#1
As the the title says I am curious if anyone has figured the best place to call a JS file so that it will be loaded before the body of every XenForo powered page?

I would rather ask before I confuse myself learning the wrong way. My first inclination was to add

Code:
 <script type="text/javascript" src="js/jquery/jq.EQ.1.8.x.custom.js"></script>
to: page_container_js_head
right after
Code:
<script type="text/javascript" src="{$jQuerySource}"></script>
<script type="text/javascript" src="js/jquery/jquery.xenforo.rollup.js?_v={$xenOptions.jsVersion}"></script>
<script type="text/javascript" src="js/xenforo/xenforo.js?_v={$xenOptions.jsVersion}"></script>
and before
Code:
<!--XenForo_Require:JS-->
leaving me with:
Code:
    <script type="text/javascript" src="{$jQuerySource}"></script>
    <script type="text/javascript" src="js/jquery/jquery.xenforo.rollup.js?_v={$xenOptions.jsVersion}"></script>
    <script type="text/javascript" src="js/xenforo/xenforo.js?_v={$xenOptions.jsVersion}"></script>
    <script type="text/javascript" src="js/jquery/jq.EQ.1.8.x.custom.js"></script>
<!--XenForo_Require:JS-->
Can anyone tell me if this would work or if there is a different place/way to add it to the script?
 

EQnoble

Well-known member
#4
OK ... I got it working

One more question - where would be the best place to include styling information that is to be loaded on every XenForo powered page (I am trying to extract the style from a css doc and include it in the xenforo script in order to scrap the .css file.)





Now is there anyone out there with skype that want's to talk dev in relation to the mod I am trying to make here. 50/50 credit for any who can sort out some of these minor code related unfavorable activities. PM me if think you can offer ANY assistance...be it grand or minute, any communication made may spark the imagination to figure out the minimal discomfort this code is giving me. Also this mod I'm working on is still in early dev so I am open to suggestions, corrections, and influence seeing as I am making this with you in mind, the end user of XenForo.

It is media related and is in a working state now.


Includes:
(custom BB-code made using the KingK bbcode manager)
(can use between 1-3 template edits - trying to find the best configuration for this setup , again it IS working now)
 

Jake Bunce

XenForo moderator
Staff member
#5
One more question - where would be the best place to include styling information that is to be loaded on every XenForo powered page (I am trying to extract the style from a css doc and include it in the xenforo script in order to scrap the .css file.)
Admin CP -> Appearance -> Templates -> PAGE_CONTAINER

You can see the CSS link that is included on every page:

Code:
	<link rel="stylesheet" type="text/css" href="css.php?css=xenforo,form,public&amp;style={xen:urlencode $_styleId}&amp;d={$visitorStyle.last_modified_date}" />
That includes these CSS templates:

xenforo.css
form.css
public.css


So you can add your code to one of those CSS templates. Or create a new template for your code and then reference it in the code above:

Admin CP -> Appearance -> Templates -> Create New Template
 

EQnoble

Well-known member
#6
Admin CP -> Appearance -> Templates -> PAGE_CONTAINER

You can see the CSS link that is included on every page:

Code:
	<link rel="stylesheet" type="text/css" href="css.php?css=xenforo,form,public&amp;style={xen:urlencode $_styleId}&amp;d={$visitorStyle.last_modified_date}" />
That includes these CSS templates:

xenforo.css
form.css
public.css

So you can add your code to one of those CSS templates. Or create a new template for your code and then reference it in the code above:

Admin CP -> Appearance -> Templates -> Create New Template

Thanks again my friend!!!

Everywhere I look your helping someone. Just awesome...keep it up...that is what community is all about :)

Jake for Moderator - Anyone else with me on this?
 

Jaxel

Well-known member
#7
Why would you ever want to call your JS BEFORE the body? For good page design, your JS should always be loaded after the page... otherwise you can slow the loading of your pages, as well as create problems with silent failures and graceful degradation (very important that JS degrades gracefully).

Use the following, instead of html code to make sure your stuff is loaded when it should be:
Code:
<xen:require css="" /> (this pulls from template)
<xen:require js="" /> (this pulls from an actual file on the server)
These codes will also prevent files/templates from loading more than once.
 

EQnoble

Well-known member
#8
The nature of the script requires it be loaded before the body or it will not work properly as far as I know and have seen. Your also talking to someone with noobabilities so I will be google searching the breakdown of your response there as I'm sure it makes perfect sense but I have not the comprehension yet with regards to scripting to break it down from my acquired knowledge. I'll update this post if I manage to figure out how to implement the same outcome with your method there, but I must admit I have no formal experience so what I know is what I know and to tell you the truth I don't even know half of the correct terms I should know to be able to do the little that I can so it's not looking good for today, tomorrows forecast: see todays.
:)

I do thank you though but your way above my level, I went through one of your mods when you first released it and was blown away by the amount of things going on in it. On the other hand I spend 24 hours to debug 40 lines of code that you could probably write off the top of your head in minutes sans the errors I end up needing to fix.

I got very sick and was having problems in other personal areas in my life literally just got back into the xen of things yesterday (though still sick, my throat is open enough to breathe now so we're up and running) but that doesn't change me needing an a-z walk-through of the inner workings of the XF script itself and/or a professional to tell me what to go learn myself in an order that is comparable to what a formal education would teach. Otherwise the professional advice your giving me would just need to be dumbed down for me personally although I am quite sure this helps someone who actually codes but me...I am just trying.

Again thank you for your response, I will before I post in this thread again try and figure out how exactly you are intending me to use this but give me some time as I necessitate a new scholastic subject called noobanomics and the learning curve is great.

@Jaxel If you would like I can pm you the location where I have my mod running and you can take a look yourself and tell me what you think about my approach to it.
 

Jaxel

Well-known member
#9
Well I hope you're feeling better...

I too consider myself a "noob" when it comes to programming. I've always been a flat procedural programmer, and XenForo is completely object oriented... which is very different. I too can't figure anything out on my own... unless there is some sort of documentation, or existing code I can look at and reverse engineer. Right now there is still a major lack of documentation in XenForo...

If you want to PM me your mod... I can look into it for you. What you're probably going to want to do, is add the JS to the XenForo parser... then load it with an INIT function. This way it will degrade gracefully if the user doesn't have javascript enabled on their particular platform.