Boxzilla

  • Resolved Fionavar

    (@fionavar)


    8 years ago

    Hi there,

    The CSS code for Boxzilla is being stripped. Currently looking to adding the CSS to the Custom part of my theme, but was wondering if there was a way to not have this happen. Their code goes in the header apparently when generating each page. I can send you the email discussion if that would be helpful?

Viewing 9 replies - 16 through 24 (of 24 total)
  • Thread Starter Fionavar

    (@fionavar)

    The problem is that the theme component of the plugin is not displaying. There should be a coloured border on the left. What occurs now is the same image you shared previously – just the grey semi-transparent box. What I do not understand is that Boxzilla actually gave me the CSS code for the box and it is in the custom CSS file and the border still does not appear:

    .boxzilla-9673.boxzilla-theme a{ color: #448aff; }
    .boxzilla-9673.boxzilla-theme a:hover { color: #2b71e6; }
    .boxzilla-9673.boxzilla-theme input[type=”submit”], .boxzilla-9673.boxzilla-theme input[type=”button”], .boxzilla-9673.boxzilla-theme button { background: #448aff; }
    .boxzilla-9673.boxzilla-theme input[type=”submit”]:hover, .boxzilla-9673.boxzilla-theme input[type=”button”]:hover, .boxzilla-9673.boxzilla-theme button:hover { background: #2b71e6; }
    .boxzilla-9673.boxzilla-theme-left-border { border-left-color: #f2e279; }

    Thread Starter Fionavar

    (@fionavar)

    FYI: I did try disabling CSS and Java a you suggested to see if that would help figure out which one was being blocked. It was less than clear. I thought it was CSS and had entered the CSS exclusion – thought it was good and then today borders were gone. Tried entering JS but that caused the boxes to no longer appear.

    Plugin Author Frank Goossens

    (@futtta)

    well, if I understand correctly; AO is not active and the custom style still does not show, right? so you might as well re-enable AO? ??

    concerning the custom CSS; I can see it being loaded, so the problem is that the styles have no impact. so I had a look at the CSS, specifically your colored button on the left and it works OK if you change the CSS to

    
.boxzilla-8733 { border-style:solid; border-left-color: #e2da31; }

    so maybe you need (to ask Bozilla) to re-evaluate the CSS?

    Thread Starter Fionavar

    (@fionavar)

    Hi Frank,

    Actually AO is live – the efficacy of the plugin is just too valuable not to make use of it. I might follow-up with them about the CSS. Just need to figure out if committing anymore time to this is useful. Please know I am VERY grateful for your time!

    Thread Starter Fionavar

    (@fionavar)

    Hi Frank,

    This just came from Boxzilla:

    _________
    This does affect the box when “Auto Optimize” is disabled. This code is added inside the <head> tag of your website. When AutoOptimize is enabled, it removes this code from the <head> tag and adds it to a CSS file https://adeaconsmusing.ca/wp-content/cache/autoptimize/css/autoptimize_97846175628352d6b55a3cb55a184714.css.

    This is what’s been causing the issue. There might be some CSS error in the generated file which results in the end code not being used.
    _______

    Is this helpful?

    Plugin Author Frank Goossens

    (@futtta)

    as the boxzilla box is also missing the custom style with AO disabled; no ??

    the root problem seems to be (also when AO is disabled) that this block of JS;

    
<script type="text/javascript">var el = document.querySelector('.boxzilla-8733'); el.className = el.className + ' boxzilla-theme boxzilla-theme-left-border';</script>

    results in this JS error:

    07:08:25.040 TypeError: el is null 1 adeaconsmusing.ca:710:52
    https://adeaconsmusing.ca/:710:52

    which means the CSS code provided does not work as the selectors do not match. when you change the CSS code to this however:

    when you change the inline CSS to;

    .boxzilla-8733 a{ color: #448aff; }
.boxzilla-8733 a:hover { color: #2b71e6; } 
.boxzilla-8733 input[type="submit"], .boxzilla-8733.boxzilla-theme input[type="button"], .boxzilla-8733.boxzilla-theme button { background: #448aff; } 
.boxzilla-8733 input[type="submit"]:hover, .boxzilla-8733.boxzilla-theme input[type="button"]:hover, .boxzilla-8733.boxzilla-theme button:hover { background: #2b71e6; }
.boxzilla-8733 { border-style:solid; border-left-color: #e2da31; }

    you’ll see it will work (as the non-existing parts of the selector were removed).

    frank

    Thread Starter Fionavar

    (@fionavar)

    Thanks Frank! I have passed this on to Boxzilla – will get back to you. This is most kind of you! Any thoughts of a Pro version of AO that takes GTMetrix tweaks in their totality as a plugin? No one has done that and I would certainly purchase that from you to have one plugin to tweak performance fwiiw ??

    Plugin Author Frank Goossens

    (@futtta)

    the scope of gtmetrix (and google pagespeed insights) is a lot more broad then AO, so probably not ??

    Thread Starter Fionavar

    (@fionavar)

    Fair enough Frank ??

Viewing 9 replies - 16 through 24 (of 24 total)
  • The topic ‘Boxzilla’ is closed to new replies.