18 Dec 2017 
Support Center » Knowledgebase » Avactis 1.9.1 build 8365 and later » How to translate buttons
 How to translate buttons
Solution NOTE: the first part of the article is for Avactis 1.9.1 with the Multilanguage module installed,  for Avactis 2.0 build less than 9671 and for the stores updated from these versions to the latest one. 
The instruction for clean installations of  Avactis 2.0 build 9671 and later is in the second part of the article.

Part 1

For example, there are default English and additional German languages in your store.

1. Create the additional images for your buttons with the German text and save them in the "avactis-themes/YOUR_THEME/images/buttons" directory.
 
2. Log in to your admin panel, click on the "Store Settings" link and click on the "Label Editor" link.
 
3. Click the "Add custom label" button.
 
4. Type "CL" in the "Label name" field and click "Save". Do note enter anything in the text area.
 
5. Click "Close".
 
6. Select "Custom labels" in the "Label type" field and select the German language in the "Language" drop-down menu in the "Filter" section and click "Filter". You will see two columns for your label. One of them contains the label value for the store default language (it should be empty and not editable) and the other one contains the label value for the selected language (type de in this field).
 
7. Click "Update".
 
Below are the steps describing how to translate the "Add to cart" button to the German language:
 
8. Open the "avactis-themes\YOUR_THEME\css\style.buttons.css" file and add the following style descriptions to the end of the file:
 
input.de.button_add_to_cart {

     background-image: url("../images/buttons/button-add-to-cart-yellow.png");
}
 
replace "button-add-to-cart-yellow.png" with your image for this button.

Below is the list of all styles that have to be added to the style.buttons.css file:

input.de.buttons.button_search {

    background-image: url("../images/buttons/button-search-page-header-de.png");
}
input.de.buttons.button_add_to_cart {

  background: url("../images/buttons/button-add-to-cart-yellow-de.png");
}

input.de.add_to_wishlist.disabled {

    background-image: url("../images/buttons/button-add-to-wishlist-grey-de.png");
}

input.de.buttons.button_add_to_cart {

    background-image: url("../images/buttons/button-add-to-cart-yellow-de.png");
}

input.de.buttons.button_add_to_cart.disabled {

    background-image: url("../images/buttons/button-add-to-cart-grey-de.png");

}

input.de.add_to_wishlist {

    background: url("../images/buttons/button-add-to-wishlist-de.png") no-repeat top left;
}
span.de.button_register {

   background: url("../images/buttons/button-register-de.png") no-repeat top left;
}
input.de.button_register {

    background: url("../images/buttons/button-register-de.png") no-repeat top left;
}

input.de.buttons.button_signin {

    background: url("../images/buttons/button-signin-de.png") no-repeat top left;
}
input.de.buttons.button_save_changes {

    background: url("../images/buttons/button-save-changes-de.png") no-repeat top left;
}
input.de.buttons.button_place_order {

    background: url("../images/buttons/button-place-order-de.png") no-repeat top left;
}
input.de.buttons.button_continue_checkout {

    background: url("../images/buttons/button-continue-checkout-de.png") no-repeat top left;
}
input.de.buttons.button_out_of_stock {

    background-image: url("../images/buttons/button-out-of-stock-de.png");
}

input.de.add_to_wishlist.disabled {

    background-image: url("../images/buttons/button-add-to-wishlist-grey-de.png");
}
input.de.buttons.button_continue {

   background: url("../images/buttons/button-continue-de.png") no-repeat top left;
}

span.de.button_details {

    background: url("../images/buttons/button-details-de.png") no-repeat top left;
}
span.de.button_checkout {

    background: url("../images/buttons/button-checkout-yellow-de.png") no-repeat scroll left top;
}
span.de.button_continue_shopping_back {

    background: url("../images/buttons/button-continue-shopping-back-de.png") no-repeat top left;
}
span.de.button_back {

    background: url("../images/buttons/button-back-de.png") no-repeat top left;
}
span.de.button_proceed_to_checkout {

    background: url("../images/buttons/button-proceed-to-checkout-border-de.png") no-repeat top left;
}


 
9. Open the avactis-themes\system\catalog\product-info\default\product-info.tpl.html file and find the following line:
 
<div class="product_buttons"><input type="submit" value="" class="buttons button_add_to_cart" /></div>
 
 
Replace it with this one:
 
<div class="product_buttons"><input type="submit" value="" class="<?php Label('CUSTOM_CL'); ?> buttons button_add_to_cart " /></div>
 
The same (8 and 9) steps have to be passed for the other buttons.

Below is the list of the templates displaying buttons:

avactis-themes\system\account\change-password\default\change-password-form.tpl.html                       
avactis-themes\system\account\forgot-password\default\forgot-password-form.tpl.html                       
avactis-themes\system\account\home-page\default\container.tpl.html                                  
avactis-themes\system\account\new-password\default\new-password-form.tpl.html                          
avactis-themes\system\account\order-download-links\default\container.tpl.html                                  
avactis-themes\system\account\order-info\default\container.tpl.html                                  
avactis-themes\system\account\orders-history\default\container.tpl.html                                  
avactis-themes\system\account\personal-info\default\container.tpl.html                                  
avactis-themes\system\account\registration-from\default\container.tpl.html                                  
avactis-themes\system\account\sign-in\box \sign-in-form.tpl.html                               
avactis-themes\system\account\sign-in\form\sign-in-form.tpl.html                               
avactis-themes\system\catalog\gift-certificate\default\gift-certificate-add-form.tpl.html                  
avactis-themes\system\catalog\product-info\default\product-info-out-of-stock.tpl.html                  
avactis-themes\system\catalog\product-info\default\product-info.tpl.html                               
avactis-themes\system\catalog\product-list\default\product-list-item-out-of-stock.tpl.html             
avactis-themes\system\catalog\product-list\default\product-list-item.tpl.html                          
avactis-themes\system\catalog\promo-code-form\default\promo-code-form-add-promo-code.tpl.html             
avactis-themes\system\catalog\promo-code-form\default\promo-code-form-remove-promo-code.tpl.html          
avactis-themes\system\catalog\search\search-form\default\search-form-container.tpl.html                      
avactis-themes\system\catalog\shopping-cart\default\shopping-cart-container-empty.tpl.html              
avactis-themes\system\catalog\shopping-cart\default\shopping-cart-container.tpl.html                    
avactis-themes\system\catalog\shopping-cart\minicart \shopping-cart-container.tpl.html                    
avactis-themes\system\checkout\checkout-sequence\default\empty-cart-error.html                               
avactis-themes\system\checkout\checkout-sequence\default\error-cart-min-subtotal.html                        
avactis-themes\system\checkout\checkout-sequence\default\step1-customer.tpl.html                             
avactis-themes\system\checkout\checkout-sequence\default\step2-payment-shipping.tpl.html                     
avactis-themes\system\checkout\checkout-sequence\default\step3-confirmation.tpl.html                         
avactis-themes\system\checkout\checkout-sequence\default\step4-success.tpl.html                              
avactis-themes\system\checkout\checkout-sequence\default\transaction-failed.tpl.html  

the templates added to Avactis version 2.0 and later:

avactis-themes\system\checkout\one-step-checkout\default\step1.tpl.html                                      
avactis-themes\system\checkout\one-step-checkout\default\step2.tpl.html                                      
avactis-themes\system\checkout\one-step-checkout\default\step3.tpl.html



10. To translate the Checkout button located at the top, next to Main menu, open the avactis-themes\YOUR_THEME\pages\templates\page.template.tpl.html file and replace the following line:

<a href="checkout.php"><img src="<?php echo getTemplateFileURL('images/buttons/button-checkout-yellow.png'); ?>" alt="" width="82" height="23" /></a>


with this one:


<a href="checkout.php"><img src="<?php echo getTemplateFileURL('images/buttons/button-checkout-yellow'); Label('CUSTOM_CL'); echo ".png";?>" alt="" width="82" height="23" /></a>

11. Create the "button-checkout-yellowde.png" image in the "avactis-themes/YOUR_THEME/images/buttons" directory.


Part 2

In order to translate the buttons, create the additional buttons for your languages in the avactis-themes/YOUR_THEME/images/buttons directory. See the example below to understand what names must have the image files.

------ Example -----
For example, you add the German language and create new Add to cart button. There is the button-add-to-cart-yellow.png image in the avactis-themes/system/images/buttons directory.

You should save new Add to cart button with the following name:

button-add-to-cart-yellow-de.png

in the same directory.

----- End Example -----


After the buttons are created, open the "style.buttons.css" file located in the "avactis-themes/YOUR_THEME/css" directory and add the following part of code to the end of the file:

input.de.buttons.button_search {

    background-image: url("../images/buttons/button-search-page-header-de.png");
}
input.de.buttons.button_add_to_cart {

    background: url("../images/buttons/button-add-to-cart-yellow-de.png");
}

input.de.add_to_wishlist.disabled {

    background-image: url("../images/buttons/button-add-to-wishlist-grey-de.png");
}

input.de.buttons.button_add_to_cart {

  background-image: url("../images/buttons/button-add-to-cart-yellow-de.png");
}

input.de.buttons.button_add_to_cart.disabled {

    background-image: url("../images/buttons/button-add-to-cart-grey-de.png");

}

input.de.add_to_wishlist {

  background: url("../images/buttons/button-add-to-wishlist-de.png") no-repeat top left;
}
span.de.button_register {

    background: url("../images/buttons/button-register-de.png") no-repeat top left;
}
input.de.button_register {

    background: url("../images/buttons/button-register-de.png") no-repeat top left;
}

input.de.buttons.button_signin {

    background: url("../images/buttons/button-signin-de.png") no-repeat top left;
}
input.de.buttons.button_save_changes {

    background: url("../images/buttons/button-save-changes-de.png") no-repeat top left;
}
input.de.buttons.button_place_order {

    background: url("../images/buttons/button-place-order-de.png") no-repeat top left;
}
input.de.buttons.button_continue_checkout {

    background: url("../images/buttons/button-continue-checkout-de.png") no-repeat top left;
}
input.de.buttons.button_out_of_stock {

    background-image: url("../images/buttons/button-out-of-stock-de.png");
}

input.de.add_to_wishlist.disabled {

  background-image: url("../images/buttons/button-add-to-wishlist-grey-de.png");
}
input.de.buttons.button_continue {

   background: url("../images/buttons/button-continue-de.png") no-repeat top left;
}

span.de.button_details {

    background: url("../images/buttons/button-details-de.png") no-repeat top left;
}
span.de.button_checkout {

    background: url("../images/buttons/button-checkout-yellow-de.png") no-repeat scroll left top;
}
span.de.button_continue_shopping_back {

    background: url("../images/buttons/button-continue-shopping-back-de.png") no-repeat top left;
}
span.de.button_back {

    background: url("../images/buttons/button-back-de.png") no-repeat top left;
}
span.de.button_proceed_to_checkout {

    background: url("../images/buttons/button-proceed-to-checkout-border-de.png") no-repeat top left;
}

Replace  "de" part of code with the necessary language code.


For more information, contact Avactis support team.




Article Details
Article ID: 25
Created On: 30 Dec 2010 12:04 AM

Posted By: Christopher Machine (bigmiba@aol.com) On: 15 Aug 2011 12:36 PM
This post is very useful for me, much appreciated! :)
 Login [Lost Password] 
Email:
Password:
Remember Me:
 
 Search
 Article Options
 Help Desk Menu

Help Desk Software By Kayako eSupport v3.11.01