X-Cart forums

[Cpt.Crashtastic]

Stumped on this one!

Ok so I create a skin module and replicate the directory structure. In this case mine becomes

CorbyWebWorx/CwwSkin/ProductOptions/View

as I want to override the product_options.css

So I create Product.php too look like this

namespace XLite\Module\CorbyWebWorx\CwwSkin\ProductOptions\View;

/**
 * Product widget
 *
 */
abstract class Product extends \XLite\View\Product\Details\Customer\ACustomer implements \XLite\Base\IDecorator
{

    /**
     * Register CSS files
     *
     * @return array
     */
    public function getCSSFiles()
    {
        $list = parent::getCSSFiles();
        $list[] = 'modules/CorbyWebWorx/ProductOptions/cww_product_details.css';

        return $list;
    }
}

Then add the css file as per the $list variable.

The css file is then called BUT the CDev module css still takes precedence over the overiding css. It doesn't matter whether the css file is named identically you still get the same result. Of course you could edit the css file directly, but thats wrong. There is obviously a simple solution to this, but I can't see it.

Any ideas?

[xplorer]

namespace XLite\Module\CorbyWebWorx\CwwSkin\ProductOptions\V iew;

Your developer ID is "CorbyWebWorx", and your module ID is "CwwSkin". Since XCN loads modules in the alphabet order, "CwwSkin" files get loaded before the original files from "ProductOptions" module.

However, you can force your module to be loaded first by adding "ProductOptions" to the list of modules which you module depends on: in your module's "Main.php" file add "getDependencies()" method as follows:

PHP Code:

public static function getDependencies()
{
    return array('CDev\ProductOptions');
} 


Now discard the above because the right way to get what you want is different

If you want to add some custom CSS files to an existing widget, you should find the widget class, "decorate" it in your module and add your custom CSS files by overriding the "getCSSFiles()" method. If you want to drop some existing CSS files, you do the same, but instead of adding new values you look through the array and drop the entries which you don't need anymore.

Does this help?

[Cpt.Crashtastic]

Yes, I can now figure out what to do I think!

When I have I'll post up how to do more fully.

[Cpt.Crashtastic]

Right I figured out how to call the list and created a bit of rough and ready code to remove the item from the list as follows.

  public static function runBuildCacheHandler() {
    $list = \XLite\Module\CDev\ProductOptions\View\Product::getCSSFiles();

    $key = array_search('modules/CDev/ProductOptions/product_details.css', $list);
    
    unset($list[$key]);
    
    return $list;
  }

I followed this code through and it appears to call the getCSSFiles() functions from CDev and CWW for a second time, removes product_details.css from the list as expected.

I don't think I'm doing this in the right place as product_details.css is still being called when the page loads.

Changing the Dev ID would be far easier

Could you give me a clue please xplorer?

[xplorer]

First of all we search throuhg all the files for the widget class that adds the "product_details.css" file.

It is \XLite\Module\CDev\ProductOptions\View\Product. Here is it: https://github.com/litecommerce/core/blob/1.0-master/src/classes/XLite/Module/CDev/ProductOptions/View/Product.php

As you see the class "decorates" \XLite\View\Product\Details\Customer\ACustomer class. "Decoration" means that after the cache rebuild process there will be no ProductOptions\View\Product class anymore, but the changes will be included into the class being decorated. That's why if you want to "decorate" it further, you should extend the base \XLite\View\Product\Details\Customer\ACustomer class, not the ProductOptions\View\Product one.

So, we create a module, specify "Cdev\ProductOptions" in its dependencies, add a new class that decorates the \XLite\View\Product\Details\Customer\ACustomer class and declare getCSSFiles() method that parses the array returned by parent::getCSSFiles() and removes "product_class.css" from the list.

[Cpt.Crashtastic]

Originally Posted by xplorer

Your developer ID is "CorbyWebWorx", and your module ID is "CwwSkin". Since XCN loads modules in the alphabet order, "CwwSkin" files get loaded before the original files from "ProductOptions" module.

However, you can force your module to be loaded first by adding "ProductOptions" to the list of modules which you module depends on: in your module's "Main.php" file add "getDependencies()" method as follows:

PHP Code:

public static function getDependencies()
{
    return array('CDev\ProductOptions');
} 


Now discard the above because the right way to get what you want is different

Thats what threw me. Everything else I had done but I removed the array within the public static function runBuildCacheHandler(). I understand this now

Thankyou very much.

[Cpt.Crashtastic]

I have written this up in what is an easy to understand manner

here

[xplorer]

Originally Posted by Cpt.Crashtastic

I have written this up in what is an easy to understand manner

here

Hm, you can replace a CSS file from your skin module.

1. You want to add your custom CSS file to a widget - you decorate the widget and add your file to getCSSFiles()

2. You want to remove an existing CSS file at all - you decorate the widget and parse the parent::getCSSFiles() result

3. You want to replace an existing CSS file with your custom one - you create a skin module and place your modified version of the file inside your skin directory (just make sure that the relative path to the file is exactly the same that the original file has).

[Cpt.Crashtastic]

Edit : Maybe I didn't understand you correctly. This code was for the skin module.

End Edit

For some reason even though I could get the skin module css to load the CDev was always overiding the ADev modules css. Only way around it I could see as an alternative was to create a tpl with different css id's

3: Do you mean within default/en/modules/ADev

we should have CDev/ProductOptions/product_options.css

I didn't try that. It would be easier. My way worked andI guess it may even have reduced the load as the product_options.css was dropped altogether.

[xplorer]

To completely replace skins/default/en/modules/CDev/ProductOptions/product_details.css file with your custom one, just put your file here: skins/[your-skin-name]/en/modules/CDev/ProductOptions/product_details.css

Just make sure that Product Options module is loaded before yours (add it to your module dependencies).

P.S. although you can replace template files this way, we recommend you to keep as much "default" templates as possible - some of the templates which you replace may be modified in future versions, and the changes won't get into your custom versions of the files during upgrade.