WebsiteBaker Community Forum

WebsiteBaker Support (2.13.x) => General Help & Support => Topic started by: CodeALot on January 31, 2025, 05:41:34 PM

Title: TIP - How to force new stylesheets to website visitors
Post by: CodeALot on January 31, 2025, 05:41:34 PM
When I was working on a website and changed the look of a few modules in their frontend.css files, I got a reaction from the client that "he didn't see the change". This because his browser cache still used the old stylesheets.
There is a way to force a browser to load the new CSS file, by adding a version number to the css call. Like frontend.css?v3
 
So I changed frontend.functions.php in /framework, the function preparelink into this:
Code: [Select]
                      case 'css':
                          $sRetval .= "\t\t".'<link rel="stylesheet" href="'.$oReg->AppUrl.''.$sLinks.'?[[CSSVERSION]]" media="screen">'."\n";
                          break;
Then I made droplet CSSVERSION that reads:

Code: [Select]
$version="v4";
return $version;

Every time I now make changes to frontend.css of ANY module, all I need to do is change the version number in the droplet, and visitors will be served the latest CSS files.
Title: Re: TIP - How to force new stylesheets to website visitors
Post by: dbs on January 31, 2025, 07:32:50 PM
I know it. "Can not see changes, looks like before"  ;D

Before years Stefek had a solution for the style.css.
index.php of the template in <head>  area

Code: [Select]
    // function fresh_file()
    function fresh_file($file){
        $used_file = TEMPLATE_DIR.'/'.$file;
        $fresh_used_file = WB_PATH.'/templates/'.TEMPLATE.'/'.$file;
        echo $used_file.'?'.filemtime ($fresh_used_file);
    }
use it:
    <link rel="stylesheet" href="<?php fresh_file('style.css');?>" media="screen,projection" />

works automatically.
Title: Re: TIP - How to force new stylesheets to website visitors
Post by: CodeALot on January 31, 2025, 08:30:34 PM
That's an option too, but that forces a new download even if the file has not changed because the browser sees a different timestamp on every pageload.
I think my solution may be a bit more work, but scores better in terms of server load and loading times ;-)

Also, this only works nicely for your template CSS files. Not for all the frontend.css files that your site uses for every single module.

I think "my way" is better :-D
Title: Re: TIP - How to force new stylesheets to website visitors
Post by: dbs on January 31, 2025, 08:40:20 PM
filemtime changed only if the file was modified.  ;)
Title: Re: TIP - How to force new stylesheets to website visitors
Post by: CodeALot on January 31, 2025, 09:27:08 PM
Ah, I overlooked that :-)
Still,  the module frontend.css argument stands :-)
Title: Re: TIP - How to force new stylesheets to website visitors
Post by: CodeALot on February 01, 2025, 10:38:05 AM
Ok. I never thought of filemtime :-) (Thanks dbs :-)

So I put 2 and 2 together and now frontend.functions. php has this snippet:

Code: [Select]
                      case 'css':
                          $sRetval .= "\t\t".'<link rel="stylesheet" href="'.$oReg->AppUrl.''.$sLinks.'?'.filemtime($sLinks).'" media="screen">'."\n";
                          break;

forcing the visitor's browser to always read the latest CSS-version of any frontend.css.
Title: Re: TIP - How to force new stylesheets to website visitors
Post by: sternchen8875 on February 01, 2025, 11:12:48 AM
Simple Question: Why is this not the standard in WebsiteBaker?

we found this solution everywhere in the web, its part of the description on php.net, but why is it not part of our code?  :roll:
Title: Re: TIP - How to force new stylesheets to website visitors
Post by: CodeALot on February 01, 2025, 11:38:05 AM
Quote from: sternchen8875 on February 01, 2025, 11:12:48 AM
Simple Question: Why is this not the standard in WebsiteBaker?

we found this solution everywhere in the web, its part of the description on php.net, but why is it not part of our code?  :roll:
Well... Maybe next version? :-)