Viewing 7 replies - 1 through 7 (of 7 total)
  • Plugin Author Frank Goossens

    (@futtta)

    that’s a huge amount of css you have there allegroclub …

    you could try excluding some of the CSS (a combination of symetrio-theme/assets/css/site.css, symetrio-theme/style-custom-latin-at-allegro.css and/or symetrio-theme/assets/css/responsive.css?ver=4.3)

    additionally you could stop the aggregation of inline CSS by adding something like this (in your child theme’s functions.php or by using code snippets);

    add_filter('autoptimize_css_include_inline','allegro_css_include_inline',10,1);
    function allegro_ao_css_include_inline() {
            return false;
    	}

    hope this helps,
    frank

    Thread Starter allegroclub

    (@allegroclub)

    I am using the premium theme. I submitted a request to the theme support team. They do not want to minify or combine them and suggested me to use w3 total cache to do what you asked..

    I have no choice and decided to use your plugin… I will try to exclude them, but will the plugin allow to pick the files within settings in the future?

    Plugin Author Frank Goossens

    (@futtta)

    but will the plugin allow to pick the files within settings in the future?

    well, the problem is I’m not sure what is going wrong. most likely this is either due to problems in the original CSS or due to problems with the CSS optimizer AO uses. but given the huge amount of CSS (it was over 1Mb of optimized CSS alone if I remember correctly!), this is particularly hard to troubleshoot really.

    frank

    Thread Starter allegroclub

    (@allegroclub)

    I am going through the optimizes CSS. Is there is debug mode I can use?
    I would love to see something like this. Sometimes, incorrect order of the CSS loaded will break the design.

    From: CSS file A link
    [the optimized css of CSS file A]
    From: CSS file B link
    [the optimized css of CSS file B]

    In addition, I notice something gets wrong.

    1.[CSS] This make the image url not working (and longer).
    background: #ffffff url("../img/wtrArrowDown.png") no-repeat 96% 50%;
    =AO=> background:#fff url(//latin.allegro.club/wp-content/themes/symetrio-theme/extensions/woocommerce/assets/css/../img/wtrArrowDown.png) no-repeat 96% 50%

    2. [HTML] Some spaces inside “”/ between element tags/ inside element are not trimmed.
    <header class="wtrHeader wtrAnimate wtrHeaderColor wtrHeaderTransparent wtrHeaderFixed " data-logo-normal="" data-logo-trans="" data-mode="1">
    <div class="wtrSht wtrStandardRow wtrNoAboveMenuRow wtrShtFullWidthSection wtrNoAutoHeightColumns " >

    3. [JS] One JS file is not optimized into the ao js file. I don’t know it is hard-coded.
    http://www.google-analytics.com/plugins/ua/linkid.js

    4. [CSS,JS] Will there an option to remove comment in these files as well?

    Plugin Author Frank Goossens

    (@futtta)

    morning allegroclub;
    A. there’s no debug-mode no. what would you expect to see there, debug-wise?
    B. AO maintains CSS order, but (and that’s an important one) AO also aggregated inline CSS which looses it’s priority in that case. nothing an !important can’t solve (you can also force AO not to aggregate inline CSS, by the way), but something to take into account.

    C.1. http://latin.allegro.club/wp-content/themes/symetrio-theme/extensions/woocommerce/assets/css/../img/wtrArrowDown.png indeed is longer, but it does work, just click the link. AO needs to do that, the original path is relative to the URL of the original CSS, but the original CSS gets aggregated to wp-content/cache/autoptimize/css/autoptimize_xyz.css so the relative path is not correct any more.
    C.2. it’s possible the (HTML) optimizers don’t succeed in squeezing out every last drop. if you want AO has API-hooks (filters) you can invoke to do some additional optimizations. I, personally, would not bother with that though 😉
    C.3. AO only aggregates local JS/CSS, not external one. See this blogpost for an explanation of why it does not do so.
    C.4. AO (or rather the external optimizers) already remove comments, except if they are “important” ones (/!*) which hold the obligatory license information, see e.g. the relevant code in the CSS optimizer. Again you could use the filters to do additional cleaning-up, but apparently legally you would be obliged to in that case provide licensing info of those files elsewhere on your site.

    Hope this clarifies,
    frank

    Thread Starter allegroclub

    (@allegroclub)

    C1. It is possible to use coding to remove unnecessary path on “./” and “../” in the plugin to minimize more characters? Ref. http://www.gambit.ph/converting-relative-urls-to-absolute-urls-in-php/
    C2. Which file I should modify the filter?

    Plugin Author Frank Goossens

    (@futtta)

    C1. would have to look into that, but probably yeah. not to high on my priority list though, I’m afraid.

    C2. you would have to hook into autoptimize_html_after_minify, adding the hook & function either your child theme’s functions.php, to a separate plugin or using the code snippets plugin. the basic code would be something like this;

    add_filter('autoptimize_html_after_minify','allegro_fix_html',10,0);
    function allegro_fix_html($in) {
    	$out=code_to_optimize_HMTL_even_more($in);
    	return $out;
    }

    frank

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Optimize CSS completely break the theme’ is closed to new replies.