Opencart stylesheet.css not updating - .htaccess

I am using Opencart porto theme. But i am facing issue when i am updating stylesheet.css. Stylesheet.css effect appear on front end after an hour and more then an hour. That is too much frustrating for me. I have disable .htaccess file. disable vqmod. Clear browsers cache as well as cache in opencart. but not any effect. I have also checked extension there are no any cache extension found. Also i have checked path of stylesheet that is also fine because that effected after an hour.
Any help please?

On a single System
CSS and JS files cache are saved in browser cache. You can force browser to reload all CSS and JS cache by pressing "CTRL + F5". By pressing this, all CSS and JS files reloaded again on browser and it takes more time to load.
On all customer's System
If you have a website that customers are using and you want to change the CSS in all customer's end. You can pass parameter in your CSS file.
Ex. Suppose you are using stylesheet.css in your header file, it should be included in header.tpl in common folder in your theme template folder as
<link href="catalog/view/theme/default/stylesheet/stylesheet.css" rel="stylesheet">
Whenever you make some changes in your CSS files, just change the parameter in header.tpl as
<link href="catalog/view/theme/default/stylesheet/stylesheet.css?version=1" rel="stylesheet">
since the file URL is changed, browser will have to reload this file on all customer's system. So your changes will appear on simple reload of web page.
Next time you change the stylesheet.css file, just modify header.tpl to
and so on.
Hope, it helps.

You want to clear vqcahche in vqmod folder on root.

Are you sure that your file is saving properly after you upload it?
If you are using FileZilla there is a log on the top that says what is happening, check if you have an error for permission.
To debug it even further that you have the right stylesheet, make a backup and delete it, if nothing happens than this stylesheet is not the one you are looking for.
Also for further testing try putting some random CSS code in your header.tpl file to see if the issue is from caching or FTP access

Related

Changes not showing in front end when modifying .twig file?

I am trying to stop the auto-scrolling of the carousel on my page. I navigated to /catalog/view/theme/default/template/extension/module and deleted the autoPlay function off of carousel.twig. However, when I go to my website, the carousel still moves as usual.
I've tried resetting my cache, and even visited the website with other devices.
My host doesn't seem to use any sort of caching. And I doubt it's because of that as all other changes usually show instantly.
I also have the same problem with the stylesheet.css; when I change the .body color attribute, the background color of the site doesn't change from white.
Can someone tell me what I'm doing wrong?
Thank you!
I got same issue. Please check your storage folder path and ensure storage folder path is correctly define in upload->config.php and upload->admin->config.php. Then disable cache using admin dashboard controls..
The reason could be from twig caching
system/library/template/Twig/Environment.php
set this value $this->debug to (bool) true
$this->debug = (bool) true;
it will disable caching during development
this helped me solve caching problem,
https://twig.symfony.com/doc/2.x/api.html#environment-options
I assume that your carousel is made by javascript code (and the mention about the css file supports my assumption) and both of there files are cached in your browser for sure. If you're using Chrome then you can disable caching in developer console (F12) -> Network tab -> Disable cache checkbox.
Try deleting everything in system/storage/cache/ to clear the cache. That is what worked for me.
you must disable caching theme
]1

why is the javascript and css unaltered on the web browser?

I just ran into a problem, While I was updating the js and css files for my website on a server, I do not see the immediate change. However, if I were to edit these files on a local computer or go on incognito mode on chrome, I see the change right away.
let's say I have:
div{width:100px}
after I change it to div{width:200px}, when I pop open the developer tool, it still reads div{width:100px}.
I feel like I need to clear something for the broswer, any explanation for this?
Check the caching headers you are using for static resources. The browser is likely using a cached version.

How do I get my google chrome extension to interact with pages outside the extension?

So I've built the main functionality for an extension already, and have it uploaded as a web page on my server. I'd like to have it interact with any page a visitor goes to though and not just my page on the server. It's just the HTML/CSS/Javascript and jQuery.
I've been reading the documentation, and it says/implies I need to use a content script. I do have this script included as a content script as well though, however I'm probably doing it wrong. Mainly looking for some guidance/direction as to where to go on this.
The extension is to be one that removes all images from a page.
The site is http://199.127.226.221/testsites/chromeapp/
This is the manifest file: http://199.127.226.221/testsites/chromeapp/manifest.json
This is the .crx file: http://199.127.226.221/testsites/chromeapp/chromeapp3.crx
You should supply the extension as a .crx file.
Also it seems you should specify desired urls for content scripts in permissions of manifest

OpenLayers's CSS breaks after publishing to Azure Web Site

I've created a very simple ASP.NET 4.5 MVC4 web site which uses OpenLayers 2.12. It's got only one page that shows a map with a few points and lines on it. If I run it locally, it runs fine, but after publishing to my Azure Web Site, the OpenLayers' CSS files won't load. I have now added the OpenLayers CSS hard coded in my bundleConfig, and now it works fine. But of course, this is not what I want, because OpenLayers has specific CSS files for other platforms and browser versions etc.
Locally, I just have to include openlayers.js and OpenLayers then adds the right css files. Does anybody know why this doesn't work after publishing to Azure?
From the docs in openlayers.js:
Please remember that when your OpenLayers script is not named
"OpenLayers.js" you will have to make sure that the default theme is
loaded into the page by including an appropriate <link>-tag,
e.g.:
(code)
<link rel="stylesheet" href="/path/to/default/style.css" type="text/css">
(end code)
Because Azure changes the file names that are included, I indeed should be adding the reference to the default style myself. Also, I can just link to style.css, the other css files for e.g. IE6 or Mobile won't be uses automatically, these are just there for yourself to use it when appropriate.

How to detect in advance if a browser will download a file instead of viewing it?

Sometimes when you view a file on a page on its own, the browser has some default way of viewing it, like to place it in an image or video tag, or invoke some plugin. Other times, it just downloads the file.
Sometimes this is because of headers set by the server, but lets ignore that for now. For some file types, it doesn't matter what headers were set -- the browser will try to download them regardless.
Some of the types that the browser will view are listed in navigator.mimeTypes. However, this is not authoritative. The iPad can view Microsoft Office files but it does not report this.
Is there any simple way to figure out what the browser is going to do with a file before it does it?

Resources