Jose Mortellaro

<p>CSS Classes For WooCommerce adds CSS classes to the body depending on the cart and the customer.<br />
You can then use those classes to customize the checkout and cart pages with your custom CSS.</p>
<h3>CSS classes added to the body if:</h3>
<ul>
<li>The cart is empty or not empty</li>
<li>There is at least a product with a price greater than zero (payment methood needed)</li>
<li>The shipping methods are shown or not needed</li>
<li>If the shipping address is needed or there are only digital products in the cart</li>
<li>The prices are shown including or excluding taxes</li>
<li>All products are sold individually</li>
<li>There are specific products in the cart</li>
<li>The quantity of specific products is a specific number</li>
<li>The billing address of the customer has a specific country</li>
<li>The customer has a specific role on the website</li>
<li>The customer has already bought something</li>
<li>The customer has bought a specific number of time</li>
</ul>
<p>If for example in the cart there are only products that can be sold individually, you can take advantage of the CSS class added by this plugin to hide the column “Qty” .<br />
In this case you will write the CSS</p>
<pre><code>.ccfw-cart-all-sold-individually-true .shop_table .product-quantity {
    display: none;
}
</code></pre>
<h3>How customize the WooCommerce cart and checkout via CSS</h3>
<ul>
<li>The plugin doesn’t provide any option, and you will not see any settings page. Just activate it.</li>
<li>Right-click and click on Inspect on the frontend.</li>
<li>Read the value of the class attribute of the body element.</li>
<li>Use the CSS classes added to the body for your custom CSS</li>
</ul>
<h3>Requirements</h3>
<p>You can take advantage of this plugin only if you have at least basic skills with CSS and are able to add your custom CSS.<br />
In other cases, you will not know what to do with this plugin.</p>
<h3>Backend Speed Optimization</h3>
<p>Is your dashboard slow? We optimize admin performance by improving queries and reducing plugin load.<br />
Read <a href="https://josemortellaro.com/backend-speed-optimization/" rel="nofollow ugc">Backend Speed Optimization Service</a> for more information.</p>


CSS Classes For WooCommerce – customize the WooCommerce cart and checkout via CSS


I love my own plugin because it gives you the possibility to customize the cart and checkout pages depending on the cart situation, only via CSS without touching any line of PHP code :)


Perfect to customize the cart and checkout via CSS

CSS classes depending on the cart to customize the checkout.

mahethekiller

<p><strong>Header Footer Script Adder</strong> is a powerful and user-friendly WordPress plugin that lets you easily insert <strong>custom HTML, CSS, and JavaScript</strong> into your site’s header, body, or footer.</p>
<p>You don’t need to edit theme files or worry about losing your code after updates. This plugin keeps your scripts safe, reusable, and flexible with <strong>conditional loading and per-page overrides</strong>.</p>
<h3>✨ Features</h3>
<ul>
<li>Add scripts to <strong>Header (<code><head></code>), Body (after <code><body></code>), or Footer (before <code></body></code>)</strong></li>
<li><strong>Conditional Loading</strong> – load scripts sitewide, homepage only, posts/pages, or archives</li>
<li><strong>Per-Page Overrides</strong> – add unique code for specific posts and pages</li>
<li><strong>Code Editor with Syntax Highlighting</strong> (CodeMirror)</li>
<li><strong>Safe Input Handling</strong> – sanitization without breaking valid HTML, CSS, or JS</li>
<li><strong>Lightweight and Fast</strong> – minimal database queries</li>
<li><strong>Block Editor & Classic Editor Compatible</strong></li>
<li><strong>Multisite Ready & Translation Ready</strong></li>
</ul>
<h3>✅ Perfect For</h3>
<ul>
<li>Google Analytics / GA4 tracking code</li>
<li>Google Tag Manager</li>
<li>Facebook Pixel and ad tracking</li>
<li>Chat widgets (WhatsApp, Crisp, Tawk.to, etc.)</li>
<li>Custom CSS and JavaScript</li>
<li>SEO and verification meta tags (Google, Bing, Pinterest)</li>
<li>A/B testing scripts</li>
<li>External fonts and resources</li>
</ul>
<h3>⚙️ Conditional Loading Options</h3>
<ul>
<li><strong>Sitewide</strong> (all pages)</li>
<li><strong>Homepage only</strong></li>
<li><strong>Posts & Pages only</strong></li>
<li><strong>Archive pages</strong></li>
</ul>
<h3>🔒 Security & Performance</h3>
<ul>
<li>Sanitized input to prevent malicious injections</li>
<li>Nonce verification for safe form submissions</li>
<li>Admin-only access for configuration</li>
<li>Clean uninstall process (no leftover data)</li>
<li>Minimal performance impact</li>
</ul>
<h3>👨‍💻 Developer Friendly</h3>
<ul>
<li>Extensible, documented code</li>
<li>WordPress coding standards compliant</li>
<li>Translation-ready <code>.pot</code> file included</li>
<li>Works with any theme</li>
</ul>
<h3>Donations</h3>
<p>If you enjoy this plugin and want to support development, you can buy me a coffee:<br />
👉 <a href="https://www.buymeacoffee.com/mahethekiller" rel="nofollow ugc">https://www.buymeacoffee.com/mahethekiller</a></p>
<h3>Support & Documentation</h3>
<p>For support, feature requests, or documentation, please visit the <strong>support forum</strong> on WordPress.org.</p>
<h3>Privacy Policy</h3>
<p>This plugin does not collect or share personal data. It only loads the scripts you provide.<br />
Any data collection depends on the external scripts you choose to add (e.g., Google Analytics, Facebook Pixel, chat widgets).</p>


Header Footer Script Adder – Insert Code in Header, Body & Footer

Easily add custom scripts and code to your WordPress site’s header, body, or footer. Perfect for Google Analytics, Tag Manager, pixels, meta tags, cus …

CSS Classes For WooCommerce – customize the WooCommerce cart and checkout via CSS vs Header Footer Script Adder – Insert Code in Header, Body & Footer