Public Forums 71,145 posts

[anahid Friend anahidJoin date: October 2010Posts: 3Downloads:0Uploads:0]

#156142

Hi guys,

I want to add new javascripts and css files to JAT3 2.0 powered template… How and where?

Please advise,

Thank you,

Anahid

[taimurian Friend taimurianJoin date: July 2010Posts: 3Downloads:3Uploads:0 Thanks: 3 Thanked: 4 times in 3 posts]

#362152

Hello,

To add new CSS & JS files you have to edit the default layout of your template (default.xml) and add the following code just after the layout opening tag <layout>


<!--Extra css load for this layout-->
<stylesheets>
<file>css/style.css</file>
</stylesheets>

<!--Extra JS load for this layout -->
<scripts>
<file>js/script.js</file>
</scripts>

3 users say Thank You to taimurian for this useful post

1. Phill
2. gray
3. pixelzombie

[Phill Moderator PhillJoin date: February 2014Posts: 7013Downloads:40Uploads:77 Thanks: 917 Thanked: 2206 times in 1818 posts]

#362161

Great first post taimurian. Keep up the good work.

[anahid Friend anahidJoin date: October 2010Posts: 3Downloads:0Uploads:0]

#362332

I tried to add new CSS files and javascripts to

/XXXX.com/templates/ja_community_plus/core/etc/layouts/default.xml

but it didn’t appear in the front end.

1. Are you sure that this is the right file?
2. Where are listed all other CSS files and Javascripts of the template

In the past everything was in index.php….. 🙂

[Phill Moderator PhillJoin date: February 2014Posts: 7013Downloads:40Uploads:77 Thanks: 917 Thanked: 2206 times in 1818 posts]

#362333

Have a look throught the Wiki, it explains a lot more than I could write here.

http://wiki.joomlart.com/wiki/Main_Page

[taimurian Friend taimurianJoin date: July 2010Posts: 3Downloads:3Uploads:0 Thanks: 3 Thanked: 4 times in 3 posts]

#362336

Hello,

<blockquote>Are you sure that this is the right file?</blockquote>
1- Make sure that the default.xml is your currently selected layout in the profile setings.
2- Make sure that the CSS/JS files that you added to default.xml are already exist in the CSS/JS folders.

<blockquote>Where are listed all other CSS files and Javascripts of the template</blockquote>
The first set of files to be loaded by the template are actually the Framework’s files which are located at
yoursite/plugins/system/jat3/base-themes/default/

The second set of files to be loaded are the files in the root directory of the template
yoursite/templates/your_template/

The last and the highest priority files to be loaded is the template’s theme files
yoursite/templates/your_template/core/themes/your_theme/

More info can be found here http://wiki.joomlart.com/wiki/JA_T3_Framework_2/Guides

1 user says Thank You to taimurian for this useful post

1. Phill

[anahid Friend anahidJoin date: October 2010Posts: 3Downloads:0Uploads:0]

#362818

Hi again,

I finally managed to load a javascript file from /js/ directory… But if I want to load external js this method doesn’t work.

For example, I want to load this JS, but directly from the CDN and not my server.

http://code.jquery.com/jquery-1.4.4.min.js

How can I do it.

1. In which file I should write:
<script type=”text/javascript” src=”http://code.jquery.com/jquery-1.4.4.min.js”></script>

2. In which file all the CSS files are loaded:

<link rel=”stylesheet” href=”/templates/ja_community_plus/css/typo.css” type=”text/css” />
<link rel=”stylesheet” href=”/templates/ja_community_plus/css/layout.css” type=”text/css” />
<link rel=”stylesheet” href=”/templates/ja_community_plus/css/template.css” type=”text/css” />
<link rel=”stylesheet” href=”/templates/ja_community_plus/css/css3.css” type=”text/css” />
<link rel=”stylesheet” href=”/templates/ja_community_plus/css/menu/mega.css” type=”text/css” />

For example it is not /XXXX.com/templates/ja_community_plus/core/etc/layouts/default.xml but some other file? Which one

Thank you for your patience and answers 🙂

[taimurian Friend taimurianJoin date: July 2010Posts: 3Downloads:3Uploads:0 Thanks: 3 Thanked: 4 times in 3 posts]

#362821

Hello,
If you want to manually add external JS files then you have to override the core head.php . Go to
<blockquote>yoursite/plugins/system/jat3/base-themes/default/blocks/</blockquote>
And copy the head.php file and then paste it in the blocks folder of your template
<blockquote>yoursite/templates/your_template/blocks/</blockquote>
Then modify it as you want. I don’t know if this is the valid way or not. but I’m usually using it.

[Phill Moderator PhillJoin date: February 2014Posts: 7013Downloads:40Uploads:77 Thanks: 917 Thanked: 2206 times in 1818 posts]

#362824

Yep, that is fine.

[gray Friend grayJoin date: October 2009Posts: 957Downloads:0Uploads:17 Thanks: 28 Thanked: 292 times in 230 posts]

#374366

<em>@taimurian 202666 wrote:</em><blockquote>Hello,

To add new CSS & JS files you have to edit the default layout of your template (default.xml) and add the following code just after the layout opening tag <layout>


<!--Extra css load for this layout-->
<stylesheets>
<file>css/style.css</file>
</stylesheets>

<!--Extra JS load for this layout -->
<scripts>
<file>js/script.js</file>
</scripts>

</blockquote>

Thanks! Just a small clarification for others.
1. Layout editing is done from template’s back-end
Tab “Layouts” – “Layouts Management” – edit the layout set in “Profile Override Settings” of the first tab “Global”
2. Files (in my case a JS) are to be put in /templates/ja_teline_iii_v2/js/ folder or /templates/ja_teline_iii_v2/css/ for a CSS (instead of /ja_teline_iii_v2/ your template’s name should be)

[bkmja Friend bkmjaJoin date: June 2010Posts: 96Downloads:0Uploads:3 Thanks: 25 Thanked: 1 times in 1 posts]

#400397

<em>@taimurian 202883 wrote:</em><blockquote>
The second set of files to be loaded are the files in the root directory of the template
yoursite/templates/your_template/

The last and the highest priority files to be loaded is the template’s theme files
yoursite/templates/your_template/core/themes/your_theme/

More info can be found here http://wiki.joomlart.com/wiki/JA_T3_Framework_2/Guides</blockquote>

This a little off topic, but tied into your statement. Looking at the wiki, it shows four levels of loading, the last being local files. Is this still valid?

[pmichael Friend pmichaelJoin date: February 2011Posts: 10Downloads:0Uploads:1 Thanks: 7]

#405434

<em>@taimurian 203491 wrote:</em><blockquote>Hello,
If you want to manually add external JS files then you have to override the core head.php . Go to

And copy the head.php file and then paste it in the blocks folder of your template

Then modify it as you want. I don’t know if this is the valid way or not. but I’m usually using it.</blockquote>

I added jquery.js and jquery.validate.js into head.php after I copied head.php from ja_travel/plugins/system/jat3/base-themes/default/blocks/ . And then pasted on yoursite/templates/ja_travel/blocks/ . After that slideshow on home page disappeared and jquery.validate.js doesn’t work also. Anyone help me. thanks in advance.

[chavan Friend chavanJoin date: October 2014Posts: 4612Downloads:0Uploads:110 Thanked: 1440 times in 1290 posts]

#405901

Hi pmichael

Could you provide me ftp & admin account of your site? I will help you check it.

1 user says Thank You to chavan for this useful post

1. pmichael

[pmichael Friend pmichaelJoin date: February 2011Posts: 10Downloads:0Uploads:1 Thanks: 7]

#405935

<em>@Do Ha 259294 wrote:</em><blockquote>Hi pmichael

Could you provide me ftp & admin account of your site? I will help you check it.</blockquote>

I am testing on localhost right now and try to use mootools to avoid any conflict issue as someone advised me. Let me try first. Thanks anyway.

[jooservices Friend jooservicesJoin date: October 2014Posts: 8556Downloads:0Uploads:130 Thanked: 1245 times in 1121 posts]

#405938

<em>@pmichael 259335 wrote:</em><blockquote>I am testing on localhost right now and try to use mootools to avoid any conflict issue as someone advised me. Let me try first. Thanks anyway.</blockquote>

By adding css / js i suggest to use Joomla API instead hard code into <head>

http://docs.joomla.org/JDocument/addStyleSheet
http://docs.joomla.org/JDocument/addScript

Thank you
Viet Vu

[Author]

Posts