Optimize Site Load Time by Putting CSS before Javascript

ThemeBurn SupportForumsOpenCart ThemesShoppica 2 OpenCart ThemeOptimize Site Load Time by Putting CSS before Javascript

This topic has been marked as not a support question.

Hi TB,

Hope all’s well.

Any chance you could help advise how I can put the css listed below in front of the javascript. I tried but brought my site down ! Many thanks… Kevin

http://gtmetrix.com/ listed that I should move the following:

http://www.vintageheirloom.com/catalog/view/theme/shoppica2/stylesheet/screen.css.php?v=2.1.3&is_mobile=0&is_touch=0&language=ltr&price_design=plain&border=0&font_body=Open+Sans&font_navigation=Open+Sans&font_navigation_weight=normal&font_navigation_style=default&font_navigation_size=15&font_intro=Open+Sans&font_intro_weight=normal&font_intro_style=default&font_intro_size=28&font_title=Open+Sans&font_title_weight=normal&font_title_style=default&font_price=Open+Sans&font_price_weight=normal&font_price_style=default&font_button=Open+Sans&font_button_weight=normal&font_button_style=default&font_button_size=12
http://fonts.googleapis.com/css?family=Open%20Sans:regular&subset=latin
http://www.vintageheirloom.com/ZoomB1e_shanDY/controller/module/magictoolbox/magiczoom.css
http://www.vintageheirloom.com/ZoomB1e_shanDY/controller/module/magictoolbox/magicscroll.css

I’m assuming the above is contained in the header.tpl file in catalog/view/theme/shoppica2/images. Here’s mine below:

is_touch || $tbData->do_javascript_detection): ?>

function createCookie(name,value,days) {
if (days) {
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = “; expires=”+date.toGMTString();
}
else var expires = “”;
document.cookie = name+”=”+value+expires+”; path=/”;
}

do_javascript_detection): ?>

if (screen.width < 767) {
createCookie("is_mobile", "1", 7);
createCookie("is_touch", "1", 7);
window.location.reload();
} else {
createCookie("is_mobile", "0", 7);
}

touch_detected): ?>

;window.Modernizr=function(a,b,c){function v(a){i.cssText=a}function w(a,b){return v(l.join(a+”;”)+(b||”"))}function x(a,b){return typeof a===b}function y(a,b){return!!~(“”+a).indexOf(b)}function z(a,b,d){for(var e in a){var f=b[a[e]];if(f!==c)return d===!1?a[e]:x(f,”function”)?f.bind(d||b):f}return!1}var d=”2.5.3″,e={},f=b.documentElement,g=”modernizr”,h=b.createElement(g),i=h.style,j,k={}.toString,l=” -webkit- -moz- -o- -ms- “.split(” “),m={},n={},o={},p=[],q=p.slice,r,s=function(a,c,d,e){var h,i,j,k=b.createElement(“div”),l=b.body,m=l?l:b.createElement(“body”);if(parseInt(d,10))while(d–)j=b.createElement(“div”),j.id=e?e[d]:g+(d+1),k.appendChild(j);return h=["­","",a,""].join(“”),k.id=g,m.innerHTML+=h,m.appendChild(k),l||(m.style.background=”",f.appendChild(m)),i=c(k,a),l?k.parentNode.removeChild(k):m.parentNode.removeChild(m),!!i},t={}.hasOwnProperty,u;!x(t,”undefined”)&&!x(t.call,”undefined”)?u=function(a,b){return t.call(a,b)}:u=function(a,b){return b in a&&x(a.constructor.prototype[b],”undefined”)},Function.prototype.bind||(Function.prototype.bind=function(b){var c=this;if(typeof c!=”function”)throw new TypeError;var d=q.call(arguments,1),e=function(){if(this instanceof e){var a=function(){};a.prototype=c.prototype;var f=new a,g=c.apply(f,d.concat(q.call(arguments)));return Object(g)===g?g:f}return c.apply(b,d.concat(q.call(arguments)))};return e});var A=function(c,d){var f=c.join(“”),g=d.length;s(f,function(c,d){var f=b.styleSheets[b.styleSheets.length-1],h=f?f.cssRules&&f.cssRules[0]?f.cssRules[0].cssText:f.cssText||”":”",i=c.childNodes,j={};while(g–)j[i[g].id]=i[g];e.touch=”ontouchstart”in a||a.DocumentTouch&&b instanceof DocumentTouch||(j.touch&&j.touch.offsetTop)===9},g,d)}([,["@media (",l.join("touch-enabled),("),g,")","{#touch{top:9px;position:absolute}}"].join(“”)],[,"touch"]);m.touch=function(){return e.touch};for(var B in m)u(m,B)&&(r=B.toLowerCase(),e[r]=m[B](),p.push((e[r]?”":”no-”)+r));return v(“”),h=j=null,e._version=d,e._prefixes=l,e.testStyles=s,e}(this,this.document);
if (Modernizr.touch){
createCookie(“is_touch”, “1″, 7);
var head = document.getElementsByTagName(‘head’)[0],
style = document.createElement(‘style’),
rules = document.createTextNode(‘.s_grid_view .s_item .s_actions { display: block !important; }’);
style.type = ‘text/css’;
if(style.styleSheet)
style.styleSheet.cssText = rules.nodeValue;
else style.appendChild(rules);
head.appendChild(style);
} else {
createCookie(“is_touch”, “0″, 7);
}

fbMeta; ?>
<link rel="stylesheet" type="text/css" href="theme_stylesheet_url; ?>screen.css.php?v=theme_version; ?>&css_fontvars, ”, ‘&’); ?>” media=”screen” />

<link rel="stylesheet" type="text/css" href="theme_stylesheet_url; ?>ie.css.php?v=theme_version; ?>&theme=basename; ?>” media=”screen” />

webfonts as $font): ?>
<link href='httpisHTTPS) echo ‘s’?>://fonts.googleapis.com/css?family=&subset=’ rel=’stylesheet’ type=’text/css’>

schemer_css; ?> custom_stylesheet; ?>

<script type="text/javascript" src="httpisHTTPS) echo ‘s’?>://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js”>
<script type="text/javascript" src="httpisHTTPS) echo ‘s’?>://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/jquery-ui.min.js”>

getJavascriptRegistry(); ?>

$(document).ready(function () {
is_mobile && $tbData->route != ‘common/home’): ?>
window.location.hash = ‘intro’;

category_path != ’0′): ?>
$.each($sReg.get(“/tb/category_path”).split(“_”), function(number, id){ $(“#menu_” + id).addClass(“s_selected”); });

});

May 5, 2013 at 9:09 pm #22847

Hi Kevin,

This code is put there with a purpose :)

Website speed tools give nice hints sometimes, but you can’t rely on their analysis only :)

BR,
ThemeBurn team

May 9, 2013 at 5:44 pm #23023

Fair point, I’ve read lots of other blogs about over zealous improvements.

Thanks for confirming.

Kevin

May 13, 2013 at 2:08 pm #23098

You’re welcome, Kev :)

BR,
ThemeBurn team

May 14, 2013 at 3:44 pm #23159
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.