SwissUpLabs Logo

Argento 1.8.1 - 1.8.2 Manual Upgrade

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

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

Cms block footer was renamed 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="cover cover-pastel">
            <div class="left triangle"></div>
            <div class="right triangle"></div>
        </div>
        <div class="container wow fadeIn">
            {{widget type="easyslide/insert" slider_id="argento_flat"}}
        </div>
    </div>
    

    new code:

    <div class="row jumbotron jumbotron-slider jumbotron-image">
        <div class="col-md-12">
            <div class="cover cover-pastel">
                <div class="left triangle"></div>
                <div class="right triangle"></div>
            </div>
            <div class="container wow fadeIn">
                {{widget type="easyslide/insert" slider_id="argento_flat"}}
            </div>
        </div>
    </div>
    
  • Category images row:

    old code:

    <div class="jumbotron jumbotron-pastel jumbotron-inverse">
        <div class="container">
            <div class="hero block block-categories">
                <div class="block-title"><span>Shop Our Store for</span><p class="subtitle no-margin">more than 25,000 health products including vitamins, herbs, sport supplements, diet and much more!</p></div>
                <div class="block-content">
                    {{widget type="easycatalogimg/widget_list" background_color="34,147,146" category_count="4" subcategory_count="2" 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 jumbotron-pastel jumbotron-inverse">
        <div class="col-md-12">
            <div class="container">
                <div class="hero block block-categories">
                    <div class="block-title"><span>Shop Our Store for</span><p class="subtitle no-margin">more than 25,000 health products including vitamins, herbs, sport supplements, diet and much more!</p></div>
                    <div class="block-content">
                        {{widget type="easycatalogimg/widget_list" background_color="34,147,146" category_count="4" subcategory_count="2" column_count="4" show_image="1" image_width="200" image_height="200" template="tm/easycatalogimg/list.phtml"}}
                    </div>
                </div>
            </div>
        </div>
    </div>
    
  • Wide banner:

    old code:

    <div class="jumbotron jumbotron-pastel-alt no-padding">
        <div class="container hero block-homepage-banner">
            {{widget type="easybanner/widget_placeholder" placeholder_name="argento-flat-home"}}
        </div>
    </div>
    

    new code:

    <div class="row jumbotron jumbotron-pastel-alt no-padding">
        <div class="col-md-12">
            <div class="container hero block-homepage-banner">
                {{widget type="easybanner/widget_placeholder" placeholder_name="argento-flat-home"}}
            </div>
        </div>
    </div>
    
  • New, Special and Bestselling Products:

    old code:

    <div class="jumbotron">
        <div class="container hero">
            {{widget type="highlight/product_new" title="New Arrivals" show_page_link="1" page_title="Browse all new products at our store &raquo;" products_count="4" column_count="4" template="tm/highlight/product/grid.phtml" class_name="highlight-content-new"}}
        </div>
    </div>
    <div class="jumbotron jumbotron-pattern">
        <div class="cover">
            <div class="left triangle"></div>
            <div class="right triangle"></div>
        </div>
        <div class="stub"></div>
        <div class="container hero">
            {{widget type="highlight/product_special" title="Special Offer" show_page_link="1" page_title="Browse all products on sale at our store &raquo;" products_count="4" column_count="4" template="tm/highlight/product/grid.phtml" class_name="highlight-content-special"}}
        </div>
    </div>
    <div class="jumbotron">
        <div class="container hero">
            {{widget type="highlight/product_bestseller" title="Our Bestsellers" show_page_link="1" page_title="Browse all bestseller products at our store &raquo;" products_count="4" column_count="4" template="tm/highlight/product/grid.phtml" class_name="highlight-content-bestsellers"}}
        </div>
    </div>
    

    new code:

    <div class="row jumbotron">
        <div class="col-md-12">
            <div class="container hero">
                {{widget type="highlight/product_new" title="New Arrivals" show_page_link="1" page_title="Browse all new products at our store &raquo;" products_count="4" column_count="4" template="tm/highlight/product/grid.phtml" class_name="highlight-content-new" img_width="200" img_height="200"}}
            </div>
        </div>
    </div>
    <div class="row jumbotron jumbotron-pattern">
        <div class="cover">
            <div class="left triangle"></div>
            <div class="right triangle"></div>
        </div>
        <div class="stub"></div>
        <div class="col-md-12 container-wrapper">
            <div class="container hero">
                {{widget type="highlight/product_special" title="Special Offer" show_page_link="1" page_title="Browse all products on sale at our store &raquo;" products_count="4" column_count="4" template="tm/highlight/product/grid.phtml" class_name="highlight-content-special" img_width="200" img_height="200"}}
            </div>
        </div>
    </div>
    <div class="row jumbotron">
        <div class="col-md-12">
            <div class="container hero">
                {{widget type="highlight/product_bestseller" title="Our Bestsellers" show_page_link="1" page_title="Browse all bestseller products at our store &raquo;" products_count="4" column_count="4" template="tm/highlight/product/grid.phtml" class_name="highlight-content-bestsellers" img_width="200" img_height="200"}}
            </div>
        </div>
    </div>
    
  • Why choose us

    old code:

    <div class="jumbotron">
        <div class="stub"></div>
        <div class="container hero">
            <div class="hero block block-benefits">
                <div class="block-title wow fadeInDown" data-wow-duration="0.5s"><span>Why choose us</span></div>
                <div class="block-content">
                    <div class="col4-set">
                        <div class="col-1 wow bounceInLeft" data-wow-delay="0.2s">
                            <span class="fa-stack fa-4x"><i class="fa fa-circle fa-stack-2x"></i><i class="fa fa-tags fa-stack-1x fa-inverse"></i></span>
                            <h3>Low Pricing</h3>
                            <p>Meet all types for your body's needs, that are healthy for you and for your pocket. Click for big savings.</p>
                        </div>
                        <div class="col-2 wow bounceInLeft">
                            <span class="fa-stack fa-4x"><i class="fa fa-circle fa-stack-2x"></i><i class="fa fa-cubes fa-stack-1x fa-inverse"></i></span>
                            <h3>Huge Selection</h3>
                            <p>Make your healthy choice using the huge variety of vitamins and sports nutrition. Let your transformation go on.</p>
                        </div>
                        <div class="col-3 wow bounceInRight">
                            <span class="fa-stack fa-4x"><i class="fa fa-circle fa-stack-2x"></i><i class="fa fa-birthday-cake fa-stack-1x fa-inverse"></i></span>
                            <h3>Reward Points</h3>
                            <p>Get reward points by boosting your healthy activity online. Stay with us and gain more.</p>
                        </div>
                        <div class="col-4 wow bounceInRight" data-wow-delay="0.2s">
                            <span class="fa-stack fa-4x"><i class="fa fa-circle fa-stack-2x"></i><i class="fa fa-comments fa-stack-1x fa-inverse"></i></span>
                            <h3>Ask Experts</h3>
                            <p>Have a question? Ask an expert and get complete online support. We are open for you.</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    

    new code:

    <div class="row jumbotron">
        <div class="stub"></div>
        <div class="col-md-12 container-wrapper">
            <div class="container hero">
                <div class="hero block block-benefits">
                    <div class="block-title wow fadeInDown" data-wow-duration="0.5s"><span>Why choose us</span></div>
                    <div class="block-content">
                        <div class="row">
                            <div class="col-md-3 col-xs-6 wow slideInUp">
                                <span class="fa-stack fa-4x"><i class="fa fa-circle fa-stack-2x"></i><i class="fa fa-tags fa-stack-1x fa-inverse"></i></span>
                                <h3>Low Pricing</h3>
                                <p>Meet all types for your body's needs, that are healthy for you and for your pocket. Click for big savings.</p>
                            </div>
                            <div class="col-md-3 col-xs-6 wow slideInUp">
                                <span class="fa-stack fa-4x"><i class="fa fa-circle fa-stack-2x"></i><i class="fa fa-cubes fa-stack-1x fa-inverse"></i></span>
                                <h3>Huge Selection</h3>
                                <p>Make your healthy choice using the huge variety of vitamins and sports nutrition. Let your transformation go on.</p>
                            </div>
                            <div class="col-md-3 col-xs-6 wow slideInUp">
                                <span class="fa-stack fa-4x"><i class="fa fa-circle fa-stack-2x"></i><i class="fa fa-birthday-cake fa-stack-1x fa-inverse"></i></span>
                                <h3>Reward Points</h3>
                                <p>Get reward points by boosting your healthy activity online. Stay with us and gain more.</p>
                            </div>
                            <div class="col-md-3 col-xs-6 wow slideInUp">
                                <span class="fa-stack fa-4x"><i class="fa fa-circle fa-stack-2x"></i><i class="fa fa-comments fa-stack-1x fa-inverse"></i></span>
                                <h3>Ask Experts</h3>
                                <p>Have a question? Ask an expert and get complete online support. We are open for you.</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    
  • About us

    old code:

    <div class="jumbotron jumbotron-bright jumbotron-inverse">
        <div class="stub"></div>
        <div class="container">
            <div class="hero block block-about wow fadeIn"  data-wow-delay="0.2s">
                <div class="block-title"><span>About us</span></div>
                <div class="block-content">
                    <p>
                        Natural Herbs company was found with idea to ensure users more natural healthy care.
                        The company is making name for itself as an advanced store with reliable service. Our
                        online store works with leaders worldwide producing vitamins, herbs and sport nutrition
                        supplements. We provide high-quality products that suit your needs and fit your budget.
                    </p>
                    <p>
                        Natural Herbs is aiming to become your full-service friend. We focus on keeping you motivated
                        improve your health. Build your own body with us! We'll help you to reach your goal.
                    </p>
                </div>
            </div>
        </div>
    </div>
    

    new code:

    <div class="row jumbotron jumbotron-bright jumbotron-inverse">
        <div class="stub"></div>
        <div class="col-md-12 container-wrapper">
            <div class="container">
                <div class="hero block block-about wow fadeIn"  data-wow-delay="0.2s">
                    <div class="block-title"><span>About us</span></div>
                    <div class="block-content">
                        <p>
                            Natural Herbs company was found with idea to ensure users more natural healthy care.
                            The company is making name for itself as an advanced store with reliable service. Our
                            online store works with leaders worldwide producing vitamins, herbs and sport nutrition
                            supplements. We provide high-quality products that suit your needs and fit your budget.
                        </p>
                        <p>
                            Natural Herbs is aiming to become your full-service friend. We focus on keeping you motivated
                            improve your health. Build your own body with us! We'll help you to reach your goal.
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </div>
    
  • Brands Slider

    old code:

    <div class="jumbotron">
        <div class="stub"></div>
        <div class="cover cover-dark">
            <div class="left triangle"></div>
            <div class="right triangle"></div>
        </div>
        <div class="container hero">
            <div class="hero block block-brands argento-slider wow fadeIn" data-wow-delay="0.2s">
                <div class="block-title"><span>Popular Brands</span><p class="subtitle">check most trusted brands from more then 50 leading manufactures presented at our store.</p></div>
                <div class="block-content">
                    <a href="#" id="left" class="trigger trigger-left"><i class="fa fa-4x fa-angle-right"></i></a>
                    <a href="#" id="right" class="trigger trigger-right"><i class="fa fa-4x fa-angle-left"></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/life_extension.gif"}}" alt="Life Extension"/></a></li>
                            <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/gnc.gif"}}" alt="GNC"/></a></li>
                            <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/mega_food.gif"}}" alt="Mega Food" /></a></li>
                            <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/nordic_naturals.gif"}}" alt="Nordic Naturals"/></a></li>
                            <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/life_extension.gif"}}" alt="Life Extension"/></a></li>
                            <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/gnc.gif"}}" alt="GNC"/></a></li>
                            <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/mega_food.gif"}}" alt="Mega Food"/></a></li>
                            <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/nordic_naturals.gif"}}" alt="Nordic Naturals"/></a></li>
                            <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/life_extension.gif"}}" alt="Life Extension"/></a></li>
                            <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/gnc.gif"}}" alt="GNC"/></a></li>
                            <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/mega_food.gif"}}" alt="Mega Food"/></a></li>
                            <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/nordic_naturals.gif"}}" alt="Nordic Naturals"/></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="stub"></div>
        <div class="cover cover-dark">
            <div class="left triangle"></div>
            <div class="right triangle"></div>
        </div>
        <div class="col-md-12 container-wrapper">
            <div class="container hero">
                <div class="hero block block-brands argento-slider wow fadeIn" data-wow-delay="0.2s">
                    <div class="block-title"><span>Popular Brands</span><p class="subtitle">check most trusted brands from more then 50 leading manufactures presented at our store.</p></div>
                    <div class="block-content">
                        <a href="#" id="left" class="trigger trigger-left"><i class="fa fa-4x fa-angle-right"></i></a>
                        <a href="#" id="right" class="trigger trigger-right"><i class="fa fa-4x fa-angle-left"></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/life_extension.gif"}}" alt="Life Extension"/></a></li>
                                <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/gnc.gif"}}" alt="GNC"/></a></li>
                                <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/mega_food.gif"}}" alt="Mega Food" /></a></li>
                                <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/nordic_naturals.gif"}}" alt="Nordic Naturals"/></a></li>
                                <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/life_extension.gif"}}" alt="Life Extension"/></a></li>
                                <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/gnc.gif"}}" alt="GNC"/></a></li>
                                <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/mega_food.gif"}}" alt="Mega Food"/></a></li>
                                <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/nordic_naturals.gif"}}" alt="Nordic Naturals"/></a></li>
                                <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/life_extension.gif"}}" alt="Life Extension"/></a></li>
                                <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/gnc.gif"}}" alt="GNC"/></a></li>
                                <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/mega_food.gif"}}" alt="Mega Food"/></a></li>
                                <li class="item"><a href="#"><img src="{{skin url="images/catalog/brands/nordic_naturals.gif"}}" alt="Nordic Naturals"/></a></li>
                            </ul>
                        </div>
                        <script type="text/javascript">
                            new Slider("slider-brands-container", "left", "right", {shift: 'auto'});
                        </script>
                    </div>
                </div>
            </div>
        </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 jumbotron jumbotron-dark">
        <div class="footer-cms">
            <div class="row">
                <div class="col-md-4">
                    <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-md-4">
                    <div class="block block-social">
                        <div class="block-title"><span>Get Social</span></div>
                        <div class="block-content">
                            <p>
                                Join our on Facebook and get recent news about our new
                                products and offers.
                            </p>
                            <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>
                    {{block type="newsletter/subscribe" name="footer.newsletter" template="newsletter/subscribe.phtml"}}
                </div>
                <div class="col-md-4">
                    <div class="block block-about">
                        <div class="block-title"><span>About us</span></div>
                        <div class="block-content">
                            <address>
                                2311 North Avenue, Pasadena, California<br/>
                                Phone: 1-888-555-7463<br/>
                                Fax: 1-888-555-2742<br/>
                                Email: <a href="mailto:info@naturalherbs.com" title="Email to info@naturalherbs.com">info@naturalherbs.com</a>
                            </address>
                            <br/>
                            <p>
                                Natural Herbs is truly professional company on vitamine
                                and sport nutrition supplements' marketplace. We sell
                                only the highest-grade substances needed for health
                                and bodily growth. Our web-store offers a huge choice
                                of products for better physical wellbeing. Let's engage
                                people to be healthy!
                            </p>
                        </div>
                    </div>
                </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 url='images/payments@2x.png'}} 2x"
            alt="Payment methods"/>
    
Remove compatibility css:
  • open file

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

    and remove line 12 with code:

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

Edit this Page