-4

送料無料というカスタム属性のMagentoストアがあります。現在、これにより、製品自体の下に送料無料のアイコンが表示されます。

しかし、製品自体の上に新しいボタンを配置することで、より魅力的にしたいと思います。

magentoページのphpコードは次のとおりです。

ページのレンダリング方法のサンプル: http ://www.theprinterdepo.com/lexmark-optra-t640-printer-20g0100

gallery.phtmlのコードを変更して、アイコンを製品の右上、右上隅に配置する必要があります。画像を透明に変更します。

これはgallery.phtmlファイルです:

<?php $_width=$this->getImageWidth() ?>
<div class="product-image-popup" style="width:<?php echo $_width; ?>px;">
    <p class="a-right"><a href="#" onclick="window.close(); return false;"><?php echo $this->__('Close Window') ?></a></p>
    <?php if($this->getPreviusImageUrl() || $this->getNextImageUrl()): ?>
        <div class="nav">
          <?php if($_prevUrl = $this->getPreviusImageUrl()): ?>
              <a href="<?php echo $_prevUrl ?>">&laquo; <?php echo $this->__('Prev') ?></a>
          <?php endif; ?>
          <?php if($_nextUrl = $this->getNextImageUrl()): ?>
              <a href="<?php echo $_nextUrl ?>"><?php echo $this->__('Next') ?> &raquo;</a>
          <?php endif; ?>
        </div>
    <?php endif; ?>
    <?php if($_imageTitle = $this->htmlEscape($this->getCurrentImage()->getLabel())): ?>
        <h1 class="image-label"><?php echo $_imageTitle ?></h1>
    <?php endif; ?>
    <img src="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'image', $this->getImageFile()); ?>"<?php if($_width): ?> width="<?php echo $_width ?>"<?php endif; ?> alt="<?php echo $this->htmlEscape($this->getCurrentImage()->getLabel()) ?>" title="<?php echo $this->htmlEscape($this->getCurrentImage()->getLabel()) ?>" id="product-gallery-image" class="image" />
    <?php if($this->getPreviusImageUrl() || $this->getNextImageUrl()): ?>
        <div class="nav">
          <?php if($_prevUrl = $this->getPreviusImageUrl()): ?>
              <a href="<?php echo $_prevUrl ?>">&laquo; <?php echo $this->__('Prev') ?></a>
          <?php endif; ?>
          <?php if($_nextUrl = $this->getNextImageUrl()): ?>
              <a href="<?php echo $_nextUrl ?>"><?php echo $this->__('Next') ?> &raquo;</a>
          <?php endif; ?>
        </div>
    <?php endif; ?>
    <p class="a-right"><a href="#" onclick="window.close(); return false;"><?php echo $this->__('Close Window') ?></a></p>
</div>
<script type="text/javascript">
//<![CDATA[
Event.observe(window, 'load', function(){
    var demensions = $('product-gallery-image').getDimensions();
    window.resizeTo(demensions.width+90, demensions.height+210);
});
//]]>
</script>

これはview.phtmlです

<?php $Deal = $_product->getResource()->getAttribute('deal')->getFrontend()->getValue($_product);?>
                                                <?php $onSale = $_product->getResource()->getAttribute('on_sale')->getFrontend()->getValue($_product);?>
                                                <?php $hotItem = $_product->getResource()->getAttribute('hot_item')->getFrontend()->getValue($_product);?>
                                                <?php $freeShip = $_product->getResource()->getAttribute('free_shipping')->getFrontend()->getValue($_product);?>
                                                <?php if($Deal == 'Yes'){ ?>
                                                    <img src="<?php echo $this->getSkinUrl('images/depot/icon-deal.gif') ?>" >
                                                <?php } ?>
                                                <?php if($onSale == 'Yes'){ ?>
                                                    <img src="<?php echo $this->getSkinUrl('images/depot/icon-sale.gif') ?>" >
                                                <?php } ?>
                                                <?php if($hotItem == 'Yes'){ ?>
                                                    <img src="<?php echo $this->getSkinUrl('images/depot/icon-hot.gif') ?>" >
                                                <?php } ?>
                                                <?php if($freeShip == 'Yes'){ ?>
                                                    <img src="<?php echo $this->getSkinUrl('images/depot/icon-freeship.gif') ?>" >
                                                <?php }?>
4

1 に答える 1

2

Magentoについてはよくわかりませんが、話している内容には、実際にはPHPではなくCSSコーディングが必要になります。理想的には、両方の画像を同じコンテナDIVに出力する必要があります。

次に、画像をに設定し、 position: absoluteを使用して画像zindexを積み重ねます。コンテナdivは、画像の配置が正しく機能するために、position: absolouteまたはである必要があることに注意してください。position: relative

詳細については、こちらをご覧ください-cssスタイルを使用して2つの画像を重ねるにはどうすればよいですか?

于 2012-06-05T14:55:46.977 に答える