Link your CMSMS cached Stylesheet in external System

Not so long ago there was a question in CMSMS Forums how a cached Stylesheet generated by CMSMS could be included in external system like Wordpress.
In CMSMS pre 1.9.x Versions stylesheets were not cached in cache folder and URL looked like www.yourdomain.com/stylesheet.php?cssid=SOME_ID, in that case it was easy to include your Stylesheets anywhere, simply by linking these, but since change to {cms_stylesheet} Stylesheets are cached in cache folder and name of the file is changing based on Time stamp and MD5 hash value.

As answer in Forum there were two solutions so let's go through steps you need to include your CMSMS Stylesheet in any PHP based System.

Step 1:

First you will need a "dummy" Template in CMSMS. This dummy Template will simply be a blank Template that is used to output URL to desired Stylesheet.

Go to "Layout » Templates" create new Template and add following content. 

{strip}{content assign='foo'}{cms_stylesheet nolinks=1}{/strip}

As you can see we simply assign content tag so we can actually create a page later and add cms_stylesheet tag with nolinks parameter. This will simply output URL to Stylesheet.

Step 2:

As next step you will have to attach desired Stylesheets to newly created Template.  Simply go to "Layout » Templates" and click on "css" icon next to newly created Template.
Add desired Stylesheets and hit "Submit".

Note: Make sure Stylesheets you have attached are of same Media Type or else multiple URL's would be output and this method would fail.

Step 3:

Now you need a dummy page that will use this newly created Template and generate a page with link to Stylesheet.
Go to "Content » Pages" and create new page. From Options tab select your "dummy" Template, give it a "alias" that you will easily remeber and uncheck the  "Show in Menu" option.

Also make sure that this page isn't being indexed by search engines, best by editing robots.txt.

Step 4:

Now go to the System where you intend to use this Stylesheet, let's take as an example Wordpress. 
Go to "Appearance » Editor" and open header.php for editing. 
Find the line with WP Stylesheet. 

<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' ); ?>" />

And add following PHP code after that line:

<?php
$url = file_get_contents('http://www.yourdomain.com/index.php?page=stylesheet'); // url to page to read content from
$data = file_get_contents(trim($url)); // if that page has only one url read that content
$file = md5(serialize($url)) . '.css'; // fielname
$cache_file = './cache/' . $file; // cached file and folder

if (!file_exists($cache_file) || filemtime($cache_file) < (time() - 3600)) {
    if (!file_exists('./cache')) {
        mkdir('./cache', 0777, true);
    }
    file_put_contents($cache_file, $data);
    chmod($cache_file, 0664);
    $html = '<link rel="stylesheet" href="cache/' . $file . '" type="text/css" />';
} else {
    $html = '<link rel="stylesheet" href="cache/' . $file . '" type="text/css" />';
}
echo $html;
?>

What we did here is reading content from url specified in $url variable, then content of the url variable is being read.
After this was processed a file with MD5 hash from URL is created and saved in "cache" folder (you can change Foldername if you prefer to use some other Folder).

When all of this was done file with Stylesheet content is saved and output as Stylesheet link tag.
If MD5 hash doesn't match the URL or file is older then 1 hour, file will be created again.
This way if you change anything in your Stylesheet, these changes will be applied to this cached Stylesheet as well.

In mentioned Forum post and as mentioned here there were two solutions available.
Solution provided by Robert  is cleaner and easier to create, but generated Stylesheet link will link directly to your CMSMS installation, which is good in case CMSMS and other System are on same URL but if for example you are using different URL's this would cause another DNS lookup, means in terms of speed optimisation first method would be of better advantage but you would only be able to use one media type where again Robert's method would be better.

The moral of the story, there are many ways to skin the cat, choose what works best for the situation.

Comments