SwissUpLabs Logo

Argento 1.8.3 - 1.8.4 Manual Upgrade

To switch to new homepage and footer please follow the next steps:

app/design/frontend/argento/pure2/template/page/html/footer.phtml

Cms blocks footer and footer_social were moved to footer_cms and new footer_payments block was added.

Old block footer is not used anymore, so you can copy your custom content from it into new footer_cms block.

Manual homepage code update
  • Slider row:

    old code:

    <div class="jumbotron jumbotron-slider jumbotron-image">
        <div class="container wow fadeIn">
            {{widget type="easyslide/insert" slider_id="argento_pure2"}}
        </div>
    </div>
    

    new code:

    <div class="row jumbotron jumbotron-slider jumbotron-image">
        <div class="container wow fadeIn">
            {{widget type="easyslide/insert" slider_id="argento_pure2"}}
        </div>
    </div>
    
  • Category images row:

    old code:

    <div class="jumbotron">
        <div class="container">
            <div class="block block-dotted">
                <div class="block-title"><span>The Essentials</span></div>
                <div class="block-content">
                    {{widget type="easycatalogimg/widget_list" background_color="255,255,255" category_count="4" subcategory_count="6" column_count="4" show_image="1" image_width="200" image_height="200" template="tm/easycatalogimg/list.phtml"}}
                </div>
            </div>
        </div>
    </div>
    

    new code:

    <div class="row jumbotron">
        <div class="container">
            <div class="block block-dotted">
                <div class="block-title"><span>The Essentials</span></div>
                <div class="block-content">
                    {{widget type="easycatalogimg/widget_list" background_color="255,255,255" category_count="4" subcategory_count="6" column_count="4" show_image="1" image_width="200" image_height="200" template="tm/easycatalogimg/list.phtml"}}
                </div>
            </div>
        </div>
    </div>
    
  • Homepage tabs row:

    old code:

    <div class="jumbotron">
        <div class="container">
            <div class="tab-container">
                {{widget type="highlight/product_special" title="Sale" products_count="6" column_count="3" template="tm/highlight/product/grid.phtml" class_name="highlight-special" show_page_link="1" page_title="Shop Sale"}}
                {{widget type="highlight/product_bestseller" title="Bestsellers" products_count="6" column_count="3" template="tm/highlight/product/grid.phtml" class_name="highlight-bestsellers" show_page_link="1" page_title="Shop Bestsellers"}}
                {{widget type="highlight/product_popular" title="Popular" products_count="6" column_count="3" template="tm/highlight/product/grid.phtml" class_name="highlight-popular" show_page_link="1" page_title="Shop Popular"}}
                {{widget type="highlight/product_attribute_yesno" attribute_code="recommended" title="Editor's Choice" products_count="6" column_count="3" template="tm/highlight/product/grid.phtml" class_name="highlight-attribute-recommended"}}
                {{widget type="highlight/product_new" title="New arrivals" products_count="6" column_count="3" template="tm/highlight/product/grid.phtml" class_name="highlight-new" show_page_link="1" page_title="Shop New"}}
            </div>
            <script type="text/javascript">
                new TabBuilder();
                new IScroll($$('.tab-container .tabs-wrapper')[0], {
                    click: true,
                    tap  : true,
                    bindToWrapper: true,
                    scrollX: true,
                    scrollY: false
                });
            </script>
        </div>
    </div>
    

    new code:

    <div class="row jumbotron">
        <div class="container">
            <div class="tab-container">
                {{widget type="highlight/product_special" title="Sale" products_count="6" column_count="3" template="tm/highlight/product/grid.phtml" class_name="highlight-special" show_page_link="1" page_title="Shop Sale" img_width="315" img_keep_frame="0"}}
                {{widget type="highlight/product_bestseller" title="Bestsellers" products_count="6" column_count="3" template="tm/highlight/product/grid.phtml" class_name="highlight-bestsellers" show_page_link="1" page_title="Shop Bestsellers" img_width="315" img_keep_frame="0"}}
                {{widget type="highlight/product_popular" title="Popular" products_count="6" column_count="3" template="tm/highlight/product/grid.phtml" class_name="highlight-popular" show_page_link="1" page_title="Shop Popular" img_width="315" img_keep_frame="0"}}
                {{widget type="highlight/product_attribute_yesno" attribute_code="recommended" title="Editor's Choice" products_count="6" column_count="3" template="tm/highlight/product/grid.phtml" class_name="highlight-attribute-recommended" img_width="315" img_keep_frame="0"}}
                {{widget type="highlight/product_new" title="New arrivals" products_count="6" column_count="3" template="tm/highlight/product/grid.phtml" class_name="highlight-new" show_page_link="1" page_title="Shop New" img_width="315" img_keep_frame="0"}}
            </div>
            <script type="text/javascript">
                new TabBuilder();
                new IScroll($$('.tab-container .tabs-wrapper')[0], {
                    click: true,
                    tap  : true,
                    bindToWrapper: true,
                    scrollX: true,
                    scrollY: false
                });
            </script>
        </div>
    </div>
    
  • Brands slider row:

    old code:

    <div class="jumbotron">
        <div class="container">
            <div class="block block-brands argento-slider wow fadeIn" data-wow-delay="0.2s">
                <div class="block-title"><span>Our Brands</span></div>
                <div class="block-content">
                    <a href="#" id="left" class="trigger trigger-left"><i class="fa fa-4x fa-angle-right">&#8203;</i></a>
                    <a href="#" id="right" class="trigger trigger-right"><i class="fa fa-4x fa-angle-left">&#8203;</i></a>
                    <div id="slider-brands-container" class="slider-wrapper">
                        <ul class="list-slider" id="slider-brands">
                    <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/gucci.jpg"}}" alt="" width="150" height="80"/></a></li>
                    <li class="item" ><a href="#"><img src="{{skin url="images/catalog/brands/lv.jpg"}}" alt="" width="100" height="80"/></a></li>
                    <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/ck.jpg"}}" alt="" width="130" height="80"/></a></li>
                    <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/chanel.jpg"}}" alt="" width="170" height="80"/></a></li>
                    <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/guess.jpg"}}" alt="" width="130" height="80"/></a></li>
                    <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/versace.jpg"}}" alt="" width="145" height="80"/></a></li>
                    <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/gucci.jpg"}}" alt="" width="150" height="80"/></a></li>
                    <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/lv.jpg"}}" alt="" width="100" height="80"/></a></li>
                    <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/ck.jpg"}}" alt="" width="130" height="80"/></a></li>
                    <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/chanel.jpg"}}" alt="" width="170" height="80"/></a></li>
                    <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/guess.jpg"}}" alt="" width="130" height="80"/></a></li>
                    <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/versace.jpg"}}" alt="" width="145" height="80"/></a></li>
                        </ul>
                    </div>
                    <script type="text/javascript">
                        new Slider("slider-brands-container", "left", "right", {shift: 'auto'});
                    </script>
                </div>
            </div>
        </div>
    </div>
    

    new code:

    <div class="row jumbotron">
        <div class="container">
            <div class="block block-brands argento-slider wow fadeIn" data-wow-delay="0.2s">
                <div class="block-title"><span>Our Brands</span></div>
                <div class="block-content">
                    <a href="#" id="left" class="trigger trigger-left"><i class="fa fa-4x fa-angle-right">&#8203;</i></a>
                    <a href="#" id="right" class="trigger trigger-right"><i class="fa fa-4x fa-angle-left">&#8203;</i></a>
                    <div id="slider-brands-container" class="slider-wrapper">
                        <ul class="list-slider" id="slider-brands">
                    <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/gucci.jpg"}}" alt="" width="150" height="80"/></a></li>
                    <li class="item" ><a href="#"><img src="{{skin url="images/catalog/brands/lv.jpg"}}" alt="" width="100" height="80"/></a></li>
                    <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/ck.jpg"}}" alt="" width="130" height="80"/></a></li>
                    <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/chanel.jpg"}}" alt="" width="170" height="80"/></a></li>
                    <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/guess.jpg"}}" alt="" width="130" height="80"/></a></li>
                    <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/versace.jpg"}}" alt="" width="145" height="80"/></a></li>
                    <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/gucci.jpg"}}" alt="" width="150" height="80"/></a></li>
                    <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/lv.jpg"}}" alt="" width="100" height="80"/></a></li>
                    <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/ck.jpg"}}" alt="" width="130" height="80"/></a></li>
                    <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/chanel.jpg"}}" alt="" width="170" height="80"/></a></li>
                    <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/guess.jpg"}}" alt="" width="130" height="80"/></a></li>
                    <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/versace.jpg"}}" alt="" width="145" height="80"/></a></li>
                        </ul>
                    </div>
                    <script type="text/javascript">
                        new Slider("slider-brands-container", "left", "right", {shift: 'auto'});
                    </script>
                </div>
            </div>
        </div>
    </div>
    
  • Free delivery banner row:

    old code:

    <div class="jumbotron">
        <div class="container block-homepage-banner">
            {{widget type="easybanner/widget_placeholder" placeholder_name="argento-pure2-home"}}
        </div>
    </div>
    

    new code:

    <div class="row jumbotron">
        <div class="container block-homepage-banner">
            {{widget type="easybanner/widget_placeholder" placeholder_name="argento-pure2-home"}}
        </div>
    </div>
    
  • create footer_cms block with the following settings:

    1. Title: footer_cms
    2. Identifier: footer_cms
    3. Status: Enabled
    4. Content:
    
    <div class="footer-cms-container">
        <div class="footer-cms">
            <div class="block block-social">
                    <ul class="icons">
                        <li class="twitter"><a href="twitter.com">Twitter</a></li>
                        <li class="facebook"><a href="facebook.com">Facebook</a></li>
                        <li class="youtube"><a href="youtube.com">YouTube</a></li>
                        <li class="rss"><a href="rss.com">Rss</a></li>
                    </ul>
            </div>
            <div class="row">
                <div class="col-sm-12 col-md-5">
                    <div class="block block-information">
                        <div class="block-title"><span>Company Information</span></div>
                        <div class="block-content">
                            <ul>
                                <li><a href="{{store url='blog'}}">Blog</a></li>
                                <li><a href="{{store url='sales/guest/form'}}">Order Status</a></li>
                                <li><a href="{{store url='storelocator'}}">Store Locator</a></li>
                                <li><a href="{{store url='wishlist'}}">Wishlist</a></li>
                                <li><a href="{{store url='privacy'}}">Privacy Policy</a></li>
                                <li><a href="{{store url='customer/account'}}">Personal Account</a></li>
                                <li><a href="{{store url='terms'}}">Terms of Use</a></li>
                                <li><a href="{{store url='returns'}}">Returns &amp; Exchanges</a></li>
                                <li><a href="{{store url='company'}}">Our Company</a></li>
                                <li><a href="{{store url='careers'}}">Careers</a></li>
                                <li><a href="{{store url='about'}}">About us</a></li>
                                <li><a href="{{store url='shipping'}}">Shipping</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="col-sm-6 col-md-3">
                    <div class="block block-about">
                        <div class="block-title"><span>Call Us</span></div>
                        <div class="block-content">
                            <a class="footer-phone" href="tel:1.800.555.1903">1.800.555.1903</a>
                            <p>
            We're available 24/7. Please note the more accurate the information you can provide us with the quicker we can respond to your query.
                            </p>
                        </div>
                    </div>
                </div>
                <div class="col-sm-6 col-md-4">
                    {{block type="newsletter/subscribe" name="footer.newsletter" template="newsletter/subscribe.phtml"}}
                </div>
            </div>
        </div>
    </div>
    
  • create footer_payments block with the following settings:

    1. Title: footer_payments
    2. Identifier: footer_payments
    3. Status: Enabled
    4. Content:
    
    <img class="payments" src="{{skin url='images/payments.png'}}"
            srcset="{{skin url='images/payments.png'}} 1x, {{skin [email protected]'}} 2x"
            alt="Payment methods"/>
    
Remove compatibility css:
  • open file

    app/design/frontend/argento/pure2/layout/theme.xml
    

    and remove line 12 with code:

    <action method="addItem"><type>skin_css</type><name>css/old-pure2.css</name></action>
    
  • delete css file skin/frontend/argento/pure2/css/old-pure2.css

Edit this Page