X-Cart forums

[ARW VISIONS]

I am having a hard time understanding the list structure here.

so we have main.header.tpl
and inside there we have <list name="layout.header" />

Now I would just like to comment out the minicart in the header, or is it a module I can deactivate?

[tony_sologubov]

You have two ways to achieve it:

1) Via template
- Enable Custom Skin module or create your own one (I believe, you already created one) that registers skins
- Create the template main.header.tpl that will replace default one, so its code will be as follows:

<div id="header-area">
{*
commenting out mini-cart widget
  <div class="desctop_header">
    <list name="layout.header" />
  </div>
*}

  <list name="layout.header.mobile" />
</div>

This template will sit in the skins/custom_skin/default/en/layout/ folder if you are using Custom Skin module.

If you are using your own module, it will sit in the <PATH-TO-YOUR-CUSTOMER-SKIN>/en/layout/main.header.tpl

Finally, the whole process is described here:
http://kb.x-cart.com/pages/viewpage.action?pageId=7504837#Webinar2-10Apr2014-DesignchangesinX-Cart5(Custom...stomSkinmodule
http://kb.x-cart.com/pages/viewpage.action?pageId=7504837#Webinar2-10Apr2014-DesignchangesinX-Cart5(Custom...ridingtemplate

2) Via PHP code

This process is described here:
http://kb.x-cart.com/pages/viewpage.action?pageId=7504837#Webinar2-10Apr2014-DesignchangesinX-Cart5(Custom...-2.2.ByPHPcode

In this case, you need to create runBuildCacheHandler() method in your Main.php file and call there something like:

PHP Code:

public static function runBuildCacheHandler()
    {
        parent::runBuildCacheHandler();
 
        \XLite\Core\Layout::getInstance()->removeTemplateFromLists('layout/main.header.tpl');
    } 


Please, let me know if it helps.

[ARW VISIONS]

Honestly Tony it didn't help one bit.
I want to create a custom skin, and write some HTMl /CSS like I have done for 15 years.

I'm a front end developer. I was ok with understanding $smarty.foreach and some basics like that, but from what I have experienced thus far... well x-cart has completely changed. I can't even find any HTML to edit, every file I find has a list.blah.blah... I don't get it.

[xplorer]

Hi!

Think of lists as named placeholders where widgets and templates can insert themselves - this is how modules can insert custom data into existing templates without modifying them.

Let's say you want to see what is actually displayed in the "layout.header" list. You search through all files for list="layout.header.right" string and find several scripts and templates having @ListChild (list="layout.header.right" ...optional extra parameters go there...) directive in them.

Some of the files would be .tpl templates. Some of them would be PHP classes. PHP classes are easy to extend from your custom module, so you can change their behavior without modifying core files.

One of the files would be the \XLite\View\Minicart class (classes/XLite/View/Minicart.php). This is the widget that renders the minicart.

What is a widget: in most cases it is a pair of a PHP class retrieving data and a .tpl template wrapping the data into HTML. Like in Smary, you may use "variables" in your templates. However, in Smary you "push" data to templates from your PHP scripts (with the "assign" function), whilst in X-Cart 5 templates "pull" data by executing methods of the associated widget class. This allows other modules to extend widget classes and customize the way how data is being retrieved without even touching original templates.

Now back to the Minicart widget. If you check the widget class, you'll find this method:

    /**
     * Check if widget is visible
     *
     * @return boolean
     */
    protected function isVisible()
    {
        return parent::isVisible() && !$this->isCheckoutLayout();
    } 

This is the method that X-Cart 5 executes to determine whether the widget should be displayed on the page. So, to hide the minicart forever you should create a custom module that "decorates" the Minicart widget class and overrides the isVisible() method to make it always return "false".

As you see most of the changes (since X-Cart 4) were made with the "easy upgrades" goal in mind: you can customize your website without changing core files. And you don't have to repatch core files every time you upgrade the store to a new XC5 version. There may be changes incompatible with your custom modules, but locating the places and fixing them is much easier than in XC4.

There are other ways to hide the minicart:
- find the template file rendered by the Minicart widget class (usually the path to the template is combined from the getDir() and getDefaultTemplate() methods of the widget class), create a module with a custom skin and let the custom skin replace the minicart template with an empty one
- find the template that inserts the Minicart widget, create a module with a custom skin and let the custom skin replace the "parent" template with a new one that would not insert the widget; in your case this would be removing the <list> tag (but this will remove all widgets in the list, not just the minicart widget) - this is the (1) point in the Tony's message
- create a custom module that postprocesses view lists after widgets inserted themselves into the lists, finds the minicart widget and removes it from the layout.header list - this is the (2) point in the Tony's post

[tony_sologubov]

Originally Posted by ARW VISIONS

Honestly Tony it didn't help one bit.
I want to create a custom skin, and write some HTMl /CSS like I have done for 15 years.

I'm a front end developer. I was ok with understanding $smarty.foreach and some basics like that, but from what I have experienced thus far... well x-cart has completely changed. I can't even find any HTML to edit, every file I find has a list.blah.blah... I don't get it.

OK, in this case the first method I described (via template) should work for you. Did you manage to apply it?

Let me try to explain how view lists work. We have this code

<div id="header-area">
  <div class="desctop_header">
    <list name="layout.header" />
  </div>

  <list name="layout.header.mobile" />
</div>

This code means that this HTML part will be rendered like this

<div id="header-area">
  <div class="desctop_header">
    showing all templates assigned to layout.header view list
  </div>

  showing all templates assigned to layout.header.mobile view list
</div>

There are two typical questions:

1. Q: How to assign a template to view list? A: By specifying directive {* @ListChild (list="view.list.name", weight="10") *}
2. Q: Why do you even need this cumbersome stuff? A: Because it is flexible and easy to add new elements to the current design. It is sort of widget areas in Wordpress, where you can create a widget single time and then put it to any area where widgets are supported.

Please, let me know if it helps. Of course, if there are any questions, please let me know.

I am very interested in communication with storefront developers, so it would allow me to write proper docs for such type of developers + we will be able to improve software for you.

Tony.