2016-03-24 4 views
4

Как вы знаете, на странице продукта Magento 2 есть фотогалерея и лупы fotorama. Мне нужно знать, как я должен удалить ее с моей страницы с продуктом. Мне просто нужен только образ продукта.Удалить галерею продуктов по умолчанию в Magento 2

В моем app\design\frontend\Mypackage\mytheme\Magento_Catalog\templates\product\view\gallery.phtml файл я удалил:

<script type="text/x-magento-init"> 
{ 
    "[data-gallery-role=gallery-placeholder]": { 
     "mage/gallery/gallery": { 
      "mixins":["magnifier/magnify"], 
      "magnifierOpts": <?php /* @escapeNotVerified */ 
echo $block->getMagnifier(); ?>, 
      "data": <?php /* @escapeNotVerified */ 
echo $block->getGalleryImagesJson(); ?>, 
      "options": { 
       "nav": "<?php /* @escapeNotVerified */ 
echo $block->getVar("gallery/nav"); ?>", 
       "loop": <?php /* @escapeNotVerified */ 
echo $block->getVar("gallery/loop"); ?>, 
       "keyboard": <?php /* @escapeNotVerified */ 
echo $block->getVar("gallery/keyboard"); ?>, 
       "arrows": <?php /* @escapeNotVerified */ 
echo $block->getVar("gallery/arrows"); ?>, 
       "allowfullscreen": <?php /* @escapeNotVerified */ 
echo $block->getVar("gallery/allowfullscreen"); ?>, 
       "showCaption": <?php /* @escapeNotVerified */ 
echo $block->getVar("gallery/caption"); ?>, 
       "width": <?php /* @escapeNotVerified */ 
echo $block->getImageAttribute('product_page_image_medium', 'width'); ?>, 
       "thumbwidth": <?php /* @escapeNotVerified */ 
echo $block->getImageAttribute('product_page_image_small', 'width'); ?>, 
       "thumbheight": <?php /* @escapeNotVerified */ 
echo $block->getImageAttribute('product_page_image_small', 'height') 
    ?: $block->getImageAttribute('product_page_image_small', 'width'); ?>, 
       "height": <?php /* @escapeNotVerified */ 
echo $block->getImageAttribute('product_page_image_medium', 'height') 
    ?: $block->getImageAttribute('product_page_image_medium', 'width'); ?>, 
       "transitionduration": <?php /* @escapeNotVerified */ 
echo $block->getVar("gallery/transition/duration"); ?>, 
       "transition": "<?php /* @escapeNotVerified */ 
echo $block->getVar("gallery/transition/effect"); ?>", 
       "navarrows": <?php /* @escapeNotVerified */ 
echo $block->getVar("gallery/navarrows"); ?>, 
       "navtype": "<?php /* @escapeNotVerified */ 
echo $block->getVar("gallery/navtype"); ?>", 
       "navdir": "<?php /* @escapeNotVerified */ 
echo $block->getVar("gallery/navdir"); ?>" 
      }, 
      "fullscreen": { 
       "nav": "<?php /* @escapeNotVerified */ 
echo $block->getVar("gallery/fullscreen/nav"); ?>", 
       "loop": <?php /* @escapeNotVerified */ 
echo $block->getVar("gallery/fullscreen/loop"); ?>, 
       "navdir": "<?php /* @escapeNotVerified */ 
echo $block->getVar("gallery/fullscreen/navdir"); ?>", 
       "arrows": <?php /* @escapeNotVerified */ 
echo $block->getVar("gallery/fullscreen/arrows"); ?>, 
       "showCaption": <?php /* @escapeNotVerified */ 
echo $block->getVar("gallery/fullscreen/caption"); ?>, 
       "transitionduration": <?php /* @escapeNotVerified */ 
echo $block->getVar("gallery/fullscreen/transition/duration"); ?>, 
       "transition": "<?php /* @escapeNotVerified */ 
echo $block->getVar("gallery/fullscreen/transition/effect"); ?>" 
      }, 
      "breakpoints": <?php /* @escapeNotVerified */ 
echo $block->getBreakpoints(); ?> 
     } 
    } 
} 

И в моем app\design\frontend\Mypackage\mytheme\etc\view.xml файл я удалил:

<!-- Gallery and magnifier theme settings. Start --> 
    <var name="gallery"> 
     <var name="nav">thumbs</var> <!-- Gallery navigation style (false/thumbs/dots) --> 
     <var name="loop">true</var> <!-- Gallery navigation loop (true/false) --> 
     <var name="keyboard">true</var> <!-- Turn on/off keyboard arrows navigation (true/false) --> 
     <var name="arrows">true</var> <!-- Turn on/off arrows on the sides preview (true/false) --> 
     <var name="caption">false</var> <!-- Display alt text as image title (true/false) --> 
     <var name="allowfullscreen">true</var> <!-- Turn on/off fullscreen (true/false) --> 
     <var name="navdir">horizontal</var> <!-- Sliding direction of thumbnails (horizontal/vertical) --> 
     <var name="navarrows">true</var> <!-- Turn on/off on the thumbs navigation sides (true/false) --> 
     <var name="navtype">slides</var> <!-- Sliding type of thumbnails (slides/thumbs) --> 
     <var name="transition"> 
      <var name="effect">slide</var> <!-- Sets transition effect for slides changing (slide/crossfade/dissolve) --> 
      <var name="duration">500</var> <!-- Sets transition duration in ms --> 
     </var> 
     <var name="fullscreen"> 
      <var name="nav">thumbs</var> <!-- Fullscreen navigation style (false/thumbs/dots) --> 
      <var name="loop">true</var> <!-- Fullscreen navigation loop (true/false/null) --> 
      <var name="keyboard">true</var> <!-- Turn on/off keyboard arrows navigation (true/false/null) --> 
      <var name="arrows">false</var> <!-- Turn on/off arrows on the sides preview (true/false/null) --> 
      <var name="caption">false</var> <!-- Display alt text as image title (true/false) --> 
      <var name="navdir">horizontal</var> <!--Sliding direction of thumbnails in full screen(horizontal/vertical) --> 
      <var name="thumbwidth">150</var> <!-- Width of thumbnails in fullscreen --> 
      <var name="thumbheight">150</var> <!-- Height of thumbnails in fullscreen --> 
      <var name="navigation_carousel">true</var> <!-- Display navigation thumbs as carousel (true/false) --> 
      <var name="transition"> 
       <var name="effect">dissolve</var> <!-- Sets transition effect for slides changing (slide/crossfade/dissolve) --> 
       <var name="duration">500</var> <!-- Sets transition duration in ms --> 
       <var name="carousel">true</var> <!-- Display navigation thumbs as carousel (true/false) --> 
      </var> 
     </var> 
    </var> 

    <var name="magnifier"> 
     <var name="fullscreenzoom">5</var> <!-- Zoom for fullscreen (integer)--> 
     <var name="top"></var> <!-- Top position of magnifier --> 
     <var name="left"></var> <!-- Left position of magnifier --> 
     <var name="width"></var> <!-- Width of magnifier block --> 
     <var name="height"></var> <!-- Height of magnifier block --> 
     <var name="eventType">hover</var> <!-- Action that atcivates zoom (hover/click) --> 
     <var name="enabled">false</var> <!-- Turn on/off magnifier (true/false) --> 
    </var> 

    <var name="breakpoints"> 
     <var name="mobile"> 
      <var name="conditions"> 
       <var name="max-width">767px</var> 
      </var> 
      <var name="options"> 
       <var name="options"> 
        <var name="navigation">dots</var> 
       </var> 
      </var> 
     </var> 
    </var> 
    <!-- end. Gallery and magnifier theme settings --> 

, но не повезло. Удаление выше кода приводило к удалению образа продукта и возможностей его отображения. Кто-нибудь может мне с этим помочь? Есть ли какой-либо метод, который позволит мне удалить галерею продуктов и увеличить масштаб, сохраняя функцию swatch? Любая помощь приветствуется. Спасибо.

ответ

5

Если вы хотите отображать основное изображение продуктов, нет необходимости снимать галерею.

Вы можете отключить лупу и полноэкранные функции в вашем файле view.xml.

... 
<var name="gallery"> 
    ... 
    <var name="allowfullscreen">false</var> <!-- Turn on/off fullscreen (true/false) --> 
    ... 
</var> 
... 
<var name="magnifier"> 
    ... 
    <var name="enabled">false</var> <!-- Turn on/off magnifier (true/false) --> 
    ... 
</var> 
... 

И используйте этот простой модуль, который позволяет отображать в галерее только основное изображение.

Базовая папка: приложение \ Код

Файл: Пример/OneImage/composer.json

{ 
    "name": "example/oneimage", 
    "description": "OneImage module for Magento 2", 
    "type": "magento2-module", 
    "version": "1.0.0", 
    "license": [ 
     "OSL-3.0", 
     "AFL-3.0" 
    ], 
    "require": { 
     "php": "~5.5.0|~5.6.0|~7.0.0", 
     "magento/module-catalog": "~100.0" 
    }, 
    "autoload": { 
     "files": [ 
      "registration.php" 
     ], 
     "psr-4": { 
      "Example\\OneImage\\": "" 
     } 
    } 
} 

Файл: Пример/OneImage/registration.php

<?php 

use \Magento\Framework\Component\ComponentRegistrar; 

ComponentRegistrar::register(ComponentRegistrar::MODULE, 'Example_OneImage', __DIR__); 

Файл: Пример/OneImage/etc/module.xml

<?xml version="1.0"?> 
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd"> 
    <module name="Example_OneImage" setup_version="1.0.0"> 
     <sequence> 
      <module name="Magento_Catalog"/> 
     </sequence> 
    </module> 
</config> 

Файл: Пример/OneImage/и т.д./интерфейс/di.xml

<?xml version="1.0"?> 
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd"> 
    <type name="Magento\Catalog\Model\Product"> 
     <plugin name="ExampleOneImagePlugin" type="Example\OneImage\Plugin\Model\Product" sortOrder="1" /> 
    </type> 
</config> 

Файл: Пример/OneImage/Plugin/Модель/product.php

<?php 

namespace Example\OneImage\Plugin\Model; 

/** 
* Plugin for \Magento\Catalog\Model\Product 
*/ 
class Product 
{ 
    /** 
    * Retrieve media gallery images 
    * 
    * @return \Magento\Framework\Data\Collection 
    */ 
    public function afterGetMediaGalleryImages(\Magento\Catalog\Model\Product $product, $images) 
    { 
     $mainImage = null; 
     foreach ($images as $key => $image) { 
      if ($product->getImage() == $image->getFile()) { 
       $mainImage = $image; 
       break; 
      } 
     } 
     $images->clear(); 
     if ($mainImage) { 
      $images->addItem($mainImage); 
     } 
     return $images; 
    } 
} 
+0

PERFECT! спасибо, отредактируйте view.xml - пурпурный способ изменения значений внутри gallery.phtml – Goldy

2

Если вам нужен основной продукт только изображение, заменить содержимое шаблона gallery.phtml с этим кодом:

<?php 

$product = $block->getProduct(); 
$imageHelper = $this->helper('Magento\Catalog\Helper\Image'); 

if (!$product->getImage() || $product->getImage() == 'no_selection') { 
    $image = $imageHelper->getDefaultPlaceholderUrl('image'); 
} else { 
    $image = $imageHelper->init($product, 'product_page_image_medium') 
      ->constrainOnly(true)->keepAspectRatio(true)->keepFrame(false) 
      ->setImageFile($product->getImage()) 
      ->getUrl(); 
} 
?> 
<div class="gallery-placeholder"> 
    <img src="<?php echo $image; ?>" > 
</div> 

Но имейте в виду, что вы потеряете некоторые из Magento 2 функциональных возможностей (как переключение между изображения связанных продуктов при выборе опций).

+0

Спасибо. Но я хочу сохранить функциональность образца. Удаление исходной структуры классов HTML и идентификаторов удаляет функциональность swatch, как вы сказали. Я отредактировал мой вопрос относительно этого. –

 Смежные вопросы

  • Нет связанных вопросов^_^