X-Cart forums

[tony_sologubov]

Hi guys!

One of our clients asked to give an example of how to change the appearance of Add to cart section in X-Cart Next front-end and I decided to write publicly about how it can be done. I am sure, it will be useful for someone else.

More precisely the task was to:

• Change Add to bag button. Although it should be changed via language variable, you can do it via code.
• Change Buy more button (it appears when you click Add to bag button) and link it to Checkout page.
• Change This product has been added to your bag text (it appears after adding a product to cart)

1. Choose your identifiers
Before you start you need to choose your identifier as a company/developer (Tony in my case) and identifier of your module (CartCorrections in my case)

2. Create basic module file
After the identifiers are chose, you should create Main.php file in the following folder:
<XCN>/classes/XLite/Module/<DEVELOPER-ID>/<MODULE-ID>/

So, I am creating the following file:
<XCN>/classes/XLite/Module/Tony/CartCorrections/Main.php

with the following content:

<?php

// Don't forget to change the IDs here
namespace XLite\Module\Tony\CartCorrections;

abstract class Main extends \XLite\Module\AModule
{
    // Author name
    public static function getAuthorName()
    {
        return 'Tony';
    }
    
    // Module name
    public static function getModuleName()
    {
        return 'Custom corrections of product page';
    }
    
    // Module description
    public static function getDescription()
    {
        return 'Custom corrections of product page';
    }
    
    // Module major version
    public static function getMajorVersion()
    {
        return '1.2';
    }

    // Module minor version
    public static function getMinorVersion()
    {
        return '0';
    }
    
}

After that, this module will appear in your Installed Modules section in Admin area after you rebuild the cache.

3. Change Add to bag button
In order to apply this change we will replace the existing implementation of Add to bag button with the one we want.

For that we are adding the following function into the Main.php file:

    public static function runBuildCacheHandler()
    {
        $layout = \XLite\Core\Layout::getInstance();

        // removing add to cart button from product page
        $layout->removeTemplateFromList(
            'product/details/parts/common.button-add2cart.tpl',
            'product.details.page.info.buttons.cart-buttons'
        );
     
        // removing add to cart button from product quicklook pop-up
        $layout->removeTemplateFromList(
            'product/details/parts/common.button-add2cart.tpl',
            'product.details.quicklook.info.buttons.cart-buttons'
        );
    }

This function removes the current implementation of Add to bag button.

To add new implementation of Add to bag button, we are creating the following template:
<XCN>/skins/default/en/modules/Tony/CartCorrections/product/details/parts/

with the content:

PHP Code:

{**
 * @ListChild (list="product.details.page.info.buttons.cart-buttons", weight="20")
 * @ListChild (list="product.details.quicklook.info.buttons.cart-buttons", weight="20")
 *}

<widget class="\XLite\View\Button\Submit" label="{t(#New add to cart button#)}" style="bright add2cart" /> 


Specifying @ListChild tells X-Cart Next to assign this template to the certain part of product page and product quicklook, so even this assignment is in comments, this is a mandatory part.

4. Change Buy more button and link it to Checkout page.
It's quite similar to the task above.

We are adding couple of function calls into the runBuildCacheHandler method:

PHP Code:

// removing buy more button from product page 
        $layout->removeTemplateFromList(
            'product/details/parts/common.button-buymore.tpl',
            'product.details.page.info.buttons-added.cart-buttons'
        );

        // removing buy more button from product quicklook pop-up
        $layout->removeTemplateFromList(
            'product/details/parts/common.button-buymore.tpl',
            'product.details.quicklook.info.buttons-added.cart-buttons'
        ); 


and adding new template <XCN>/skins/default/en/modules/Tony/CartCorrections/product/details/parts/common.button-buymore.tpl with the following content:

PHP Code:

{**
 * @ListChild (list="product.details.page.info.buttons-added.cart-buttons", weight="30")
 * @ListChild (list="product.details.quicklook.info.buttons-added.cart-buttons", weight="30")
 *}

<a href="{buildURL(#checkout#)}" >{t(#My go to checkout text#)}</a> 


The most interesting part here is how checkout URL is built.

5. Change This product has been added to your bag text
It's really simple, since it almost copies the points above.

We are adding new function calls to runBuildCacheHandler method.

PHP Code:

// removing "product added" message from product page
        $layout->removeTemplateFromList(
            'product/details/parts/common.product-added.tpl',
            'product.details.page.info.buttons-added'
        );

        // removing "product added" message from quicklook product pop-up
        $layout->removeTemplateFromList(
            'product/details/parts/common.product-added.tpl',
            'product.details.quicklook.info.buttons-added'
        ); 


and adding new template <XCN>/skins/default/en/modules/Tony/CartCorrections/product/details/parts/common.product-added.tpl with the following content:

PHP Code:

{**
 *
 * @ListChild (list="product.details.page.info.buttons-added", weight="5")
 * @ListChild (list="product.details.quicklook.info.buttons-added", weight="5")
 *}
<p class="product-added-note">{t(#New message when product is added to cart#)}</p> 


Conclusion

Now, we are all done.

Just in case, I've uploaded the mod to dropbox: https://dl.dropboxusercontent.com/u/23858825/Tony-CartCorrections-v1_2_0.tar

If you have any questions, feel free to pm me or ask in the thread.

Tony.

[cflsystems]

Thank you Tony. XCN is so different that we all need a lesson of the code QT is writing and the way to implement changes....

[tony_sologubov]

Happy to be helpful, Steve.

I am planning to add more examples over time. If you want to see some particular examples, leave the requests here or pm me.

In fact, I want to give the most examples community need, so you can at least assess how to work with X-Cart Next.

[ADDISON]

Do we have a download version for 1.2 to implement by ourselves these examples?

[tony_sologubov]

@ADDISON
Dev version of X-Cart Next is available to all partners via partner area. If you don't have one, email me at developers@x-cart.com and I'll create it for you.

[daboy18]

Tony,
Thank you so much for the above information! Its greatly helpful!

I ran into a quark when rebuilding the cache, its still stuck and has been for 30 mins now. Not sure what to do . It says:



Re-building cache [step 4 of 5], please wait...
Run the "Doctrine_Plugin_UpdateSchema" plugin... [2.14sec, 48.8MB (28.3MB)]
Run the "Doctrine_Plugin_UpdateModules" plugin...

thanks!

[tony_sologubov]

@daboy18 I've answered you via email.

[daboy18]

Thank you again, restoring the Main.php file worked fine. thanks!