7

Tôi đang chuyển cửa hàng Magento 1.9 sang Magento 2.1.

Tôi vẫn còn khá mới trong Magento 2.1 và dường như tôi không thể tìm thấy một số thứ.

Bất kỳ hướng dẫn về cách thay thế trình chuyển đổi cửa hàng văn bản bằng cờ?

12

Tôi đã vật lộn với cùng một vấn đề trong một thời gian và cuối cùng đã xoay sở để giải quyết nó. Có thể bạn đã giải quyết nó bây giờ, nhưng nó chắc chắn có thể hữu ích cho những người khác.

Tóm lược

Mã cần thiết có thể được tìm thấy ở cuối bài này.

tạo tất cả các thư mục bị thiếu trên đường dẫn này: /var/www/magento/app/design/frontend/{namespace}/{name}/Magento_Store/templates/switch
sao chép mã của language.phtmlvà thêm nó vào thư mục này
đi đến tập tin /var/www/magento/app/code/{theme_dir}/Magento_Theme/view/frontend/layout/default_head_blocks.xml.
- Nếu nó không tồn tại, sao chép nó từ/var/www/magento/vendor/magento/module-theme/view/frontend/layout/default_head_blocks.xml
thêm dòng <css src="css/languageSwitcher.css"/>
sao chép mã của languageSwitcher.cssvà thêm nó vào thư mục/var/www/magento/app/design/frontend/{namespace}/{name}/web/css
tạo thư mục /var/www/magento/app/design/frontend/{namespace}/{name}/web/images/flagsvà thêm cờ với quy ước đặt tên, flag_{country_ID}.pngvd flag_en.png. Tất cả các hình ảnh cần phải có cùng độ phân giải.
Biên dịch lại ... chưa tìm ra nếu bạn cũng cần xóa bộ đệm ... chỉ cần dùng thử và lỗi.

Giải thích mở rộng và thông tin thêm

Trước tiên, bạn cần tìm, mẫu nào chịu trách nhiệm cho trình chuyển đổi ngôn ngữ. Do đó, hãy đến trang quản trị cài đặt Magento của bạn, đi đến Store > Configuration > Advanced > Developer > Debug > Enabled Template Path Hints for Storefront > Yes. Bây giờ tải lại trang của cửa hàng của bạn và bạn sẽ thấy rất nhiều hộp màu đỏ có tên trong đó. Hộp chứa trình chuyển đổi ngôn ngữ thả xuống có đường dẫn như:

/var/www/magento/vendor/magento/module-store/view/frontend/templates/switch/languages.phtml.

Những gì bạn muốn làm là tạo mẫu của riêng bạn và thêm những thay đổi bạn muốn. Do đó, KHÔNG BAO GIỜ thay đổi mẫu đã nói ở trên. Nó không an toàn vì mỗi bản cập nhật Magento sẽ ghi đè lên các thay đổi (và có thể một cái gì đó khác cũng sẽ làm như vậy ....). Cách được đề xuất là:

Sao chép mẫu vào đường dẫn:

/var/www/magento/app/design/frontend/{namespace}/{name}/{vendor_name}_{module_name}/templates/{path_to_template}/template.phtml.

{không gian tên} = không gian tên của mô-đun (ví dụ: công ty / tên miền / ...)
{name} = tên của mô-đun
{eller_name} = tên của nhà cung cấp, đã cung cấp mẫu
{module_name} = mô-đun trong đó mẫu dối trá
{path_to_template} = con đường bên phảitemplates

Trong trường hợp của chúng tôi, kết quả này là:

/var/www/magento/app/design/frontend/{namespace}/{name}/Magento_Store/templates/switch/languages.phtml

Bây giờ, điều này đã hoạt động, nếu bạn thực hiện một số thay đổi cho bản sao, chúng sẽ xuất hiện trên trang web.

CSS
Trong giải pháp của tôi, tôi cũng đã sử dụng tệp css để định kiểu mẫu. Vì vậy, chúng ta cần thêm đường dẫn đến default_head_blocks.xml. Các tập tin mặc định nằm trongapp/code/Magento/Theme/view/frontend/layout/default_head_blocks.xml

Để thay đổi tập tin này, sao chép nó vào thư mục tương ứng của bạn và thêm đường dẫn đến tập tin css. Con đường:

/var/www/magento/app/code/{theme_dir}/{Magento_Theme}/view/frontend/layout

Trong đó, bạn cũng có thể thêm các tệp * .js và các nguồn khác .... thêm dòng này vào cuối default_head_blocks.xml (nhưng bên trong các <head>thẻ) : <css src="css/languageSwitcher.css"/>.

Điều hướng đến thư mục /var/www/magento/app/design/frontend/{namespace}/{name}/web/cssvà thêm languageSwitcher.css.

Tiếp theo, đi đến .../web/imagesvà tạo thư mục flags. Thêm hình ảnh vào thư mục với quy ước đặt tên : flag_{country_ID}.png. Ví dụ để sử dụng tiếng Anh flag_en.png. Tất cả đều cần có cùng độ phân giải.

Mã (ngôn ngữ.phtml & ngôn ngữSwitcher.css)

ngôn ngữ

<?php
/**
 * Copyright © 2016 Magento. All rights reserved.
 * See COPYING.txt for license details.
 */

// @codingStandardsIgnoreFile

?>
<?php
/**
 * Language switcher template
 */
?>

<?php if(count($this->getStores())>1): ?>
    <div class="langs-wrapper">
    <?php foreach ($this->getStores() as $_lang): ?>
        <?php if ($_lang->getCode() != 'default'): ?>
        <a class="lang-flag" href="<?php echo $this->getCurrentUrl() . '?___store=' . $_lang->getCode();?>"><img src="<?php echo $this->getViewFileUrl('images/flags/flag_' . $_lang->getCode() . '.png');?>" alt="<?php echo 'could not find image for ' . $_lang->getName() ?>"/></a>
        <?php endif;?>
    <?php endforeach;?>
    </div>
<?php endif;?>

ngôn ngữSwitcher.css

.langs-wrapper {
    height: 15px;
}

.lang-flag {
    width: 55px;
    height: 32.5px;
    float: left;
    margin-left: 10px;
    border: 1px solid transparent;
}

.lang-flag:hover {
    border: 2.5px solid #FFF;
}

— elnecesario
nguồn

1

Tạo một tập tin trong chủ đề của bạn /app/design/frontend/Vendor/Theme/Magento_Store/templates/switch/languages.phtml

<?php
/**
 * Language switcher template
 */
if (count($this->getStores())) { ?>
<div class="langs-wrapper">
    <?php foreach ($this->getStores() as $_lang) { ?>
        <a class="lang-flag" href="#" data-post='<?php echo $block->getTargetStorePostData($_lang); ?>'><img src="<?php echo $this->getViewFileUrl('images/flags/' . $_lang->getCode() . '.png');?>" alt="<?php echo $_lang->getName(); ?>" /></a>
    <?php } ?>
    </div>
<?php
}

Điều này sẽ làm cho việc chuyển đổi ngôn ngữ tiếp tục sử dụng một phiên thay vì chỉ chuyển đổi ngôn ngữ trên trang cụ thể và loại bỏ ngôn ngữ tiếp theo.

— cjohansson
nguồn

Làm cách nào để thay thế trình chuyển đổi ngôn ngữ tiêu chuẩn bằng cờ? Magento 2.1.0

Tóm lược

Giải thích mở rộng và thông tin thêm

Mã (ngôn ngữ.phtml & ngôn ngữSwitcher.css)