[FIX] Use VirtueMart CSS + Bootstrap layouts

[iWim]

I may have found a solution for a bug in VM where the setting for Use the VirtueMart CSS is ignored when selecting any Bootstrap version.

The solution is a small change to a core file. It would be great if someone can check it and than it could be added to core for the next update.

BEFORE THE FIX
1. Go to VirtueMart Configuration > tab Templates
2. Go to section Templates & Layouts
3. At Layout Bootstrap version select None (Use Legacy)

4. Go to section Core Css Styles & Javascripts (only for experts)
5. Set Use the VirtueMart CSS to Yes or No

Check the frontend code:
/components/com_virtuemart/assets/css/vm-ltr-common.css is loaded or not depending on setting Use the VirtueMart CSS to Yes or No.

6. Go back to #3 and select a Bootstrap version

Re-check the frontend code:
The setting for Use the VirtueMart CSS is ignored and
/components/com_virtuemart/assets/css/vm-bs#-common.css is always loaded.

THE FIX
Open the file ~/administrator/components/com_virtuemart/helpers/vmjsapi.php
(Note: this is a core file!)

At line 897 you'll find

Code Select Expand

if (!VmConfig::get('css', TRUE)) {
  return FALSE;
}Move these 3 lines up after if ($cssFile) return; on line 879

Code Select Expand

(...)
static $cssSite;
if ($cssSite) return;

  if (!VmConfig::get('css', TRUE)) {
    return FALSE;
  }

  // we load one common css and put styles in there
  (...)
AFTER THE FIX
At Layout Bootstrap version select any option
Set Use the VirtueMart CSS to Yes or No

Re-check the frontend code:
The CSS from any layout is loaded or not depending on the Use the VirtueMart CSS setting.

B/C BREAK
Because before this fix the setting for Use the VirtueMart CSS was ignored, webshops using a Bootstrap layout and have Use the VirtueMart CSS set to No will loose styling after the update.

They will have to set Use the VirtueMart CSS to Yes.

[Milbo]

"and have Use the VirtueMart CSS set to No will loose styling after the update."
I think the other way round, the virtuemart css will be suddenly additionally loaded. sounds good for vm5

[Milbo]

Hmm it makes a lot more sense, just to remove the "false" at the end of the "if bootstrap" part. And it would make more sense to add a new bs-vmsite. So that we can keep the old non bootstrap as legacy and if you select a bs, then it should load the bs vm.
But on the other side? the Bootstrap files are already just the ones for the vm stuff. So actually,... I dont get your idea after trying to implement it.

[iWim]

I create custom templates and write specific CSS for these templates.
When VirtueMart loads its own CSS I have to undo/override these styles to fit my design.

I.e. vm-bs5-common.css sets specific colors and sizes for fonts, margins etc.
Also I see some !importants...

I prefer not to deal with that.

Previously I used the Legacy layout. Now I would like to use the BS5 layout, as it's closer in line with current Joomla, but not load VirtueMart's Bootstrap CSS.

Currently disabling VirtueMart CSS only works for Legacy layout. Not for any Bootstrap layout.
For BS layouts the option Use VirtueMart CSS is ignored.
My suggestion allows this option to work for Bootstrap CSS too.

You know VirtueMart better than me. You may have a better solution.

[Milbo]

You can just override the css with the default joomla override system.