I'm looking to add this to my framework to optimise it further. I don't want to use a plugin and I want the code to be as light weight as possible. This is the code I have so far. This works if I only call "style.css" but if I call the other files it doesn't minify the files. I'm getting the same with the js file I have. It removes the white space but it doesn't fully minify the file. Hope someone can help. Thanks
<?php
$dev_master_root = dirname(dirname(dirname(dirname(dirname(__FILE__)))));
if ( file_exists( $dev_master_root.'/wp-load.php' ) ) {
require_once( $dev_master_root.'/wp-load.php' );
} elseif ( file_exists( $dev_master_root.'/wp-config.php' ) ) {
require_once( $dev_master_root.'/wp-config.php' );
}
/* Add your CSS files to this array (THESE ARE ONLY EXAMPLES) */
$cssFiles = array(
"../style.css",
"global.css",
"slicknav.css"
);
$buffer = "";
foreach ($cssFiles as $cssFile) {
$buffer .= file_get_contents($cssFile);
}
// Remove comments
$buffer = preg_replace('!/\*[^*]*\*+([^/][^*]*\*+)*/!', '', $buffer);
// Remove space after colons
$buffer = str_replace(': ', ':', $buffer);
// Remove whitespace
$buffer = str_replace(array("
", "", "
", "\t", ' ', ' ', ' '), '', $buffer);
// Enable GZip encoding.
ob_start("ob_gzhandler");
// Enable caching
header('Cache-Control: public');
// Expire in one day
header('Expires: ' . gmdate('D, d M Y H:i:s', time() + 86400) . ' GMT');
// Set the correct MIME type, because Apache won't set it for us
header("Content-type: text/css");
// Write everything out
echo($buffer);
?>
Section of output with the minify file exactly as above.
body {
color: #2d2e32;
}
h1 {
font-size: 24px;
}
h2 {
font-size: 21px;
}
h3 {
font-size: 18px;
}
h4 {
font-size: 16px;
}
h5 {
font-size: 12px;
}
h6 {
font-size: 11px;
}
h1, h2, h3, h4, h5, h6 {
line-height: 1.618;
margin-bottom: 20px;
}
p {
font-family: 'Domine', serif;
font-size: 12px;
}
#dev-master-main-container {}
#dev-master-header-container {
background: #fff;
}
#dev-master-content-container {}
#dev-master-footer-container {
background: #000026;
}
#dev-master-footer-content {}
@media screen and (max-width :1180px) {}
@media screen and (max-width :960px) {}
@media screen and (max-width :768px) {}
@media screen and (max-width :524px) {}
html {
font-family: sans-serif;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
-webkit-font-smoothing: antialiased;
height: 100%;
}
body {
margin: 0;
height: 100%;
}
article, aside, details, figcaption, figure, footer, header, main, menu,
nav, section, summary {
display: block;
}
audio, canvas, progress, video {
display: inline-block;
vertical-align: baseline;
}
audio:not([controls]) {
display: none;
height: 0;
}
[hidden], template {
display: none;
}
a {
background-color: transparent;
}
a:active, a:hover {
outline: 0;
}
abbr[title] {
border-bottom: 1px dotted;
}
b, strong {
font-weight: 700;
}
dfn {
font-style: italic;
}
h1 {
font-size: 2em;
margin: .67em 0;
}
mark {
background: #ff0;
color: #000;
}
small {
font-size: 80%;
}
sub, sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -.5em;
}
This is the output when only style.css is called using the minify file. i.e when I remove "global.css" and "slicknav.css"
h1,h2,h3,h4,h5,h6 {}p {}#dev-master-main-container {}#dev-master-header-container {background:#fff;}#dev-master-content-container {}#dev-master-footer-container {background:#000026;}#dev-master-footer-content {}@media screen and (max-width :1180px) {}@media screen and (max-width :960px) {}@media screen and (max-width :768px) {}@media screen and (max-width :524px) {}
So in the code above, this is only style.css but you can see all comments etc are being stripped. It's super light weight because all the foundation styles are called from global.css
I have just noticed the spaces in this code which I would also like to remove. I thought the string above would have done that...?
Let me know if you need any more info. Thanks again
Are you referencing the file locations correctly in the array?
Also with the current code you have it is not going to perform a full minification because that involves switching out variable names for shorter ones e.g (someVariableName
would become a
)