magento使用css移动可配置的产品选项
请访问以下链接：
在可配置产品中，我想移动“颜色”＆amp; charactar到页面顶部。
我想在“检查交付可用性”块上移动它。
意味着我希望旁边的文字“年龄：2岁及以上”。 4行后有差距。我想在那里移动颜色和charactar。
请帮我找到解决方案。
这是view.phtml
<?php
?>
<?php $_helper = $this->helper('catalog/output'); ?>
<?php $pageLayout = str_replace(array('page/','.phtml'),'',Mage::app()->getLayout()->getBlock('root')->getTemplate()); ?>
<?php $_product = $this->getProduct(); ?>
<?php $setting = Mage::helper('em0113settings'); ?>
<script type="text/javascript">
var optionsPrice = new Product.OptionsPrice(<?php echo $this->getJsonConfig() ?>);
</script>
<div class="Individual">
<div id="messages_product_view"><?php echo $this->getMessagesBlock()->getGroupedHtml() ?></div>
<div class="product-view">
<div class="product-essential">
<form action="<?php echo $this->getSubmitUrl($_product) ?>" method="post" id="product_addtocart_form"<?php if($_product->getOptions()): ?> enctype="multipart/form-data"<?php endif; ?>>
<?php echo $this->getBlockHtml('formkey') ?>
<div class="no-display">
<input type="hidden" name="product" value="<?php echo $_product->getId() ?>" />
<input type="hidden" name="related_product" id="related-products-field" value="" />
</div>
<div class="product-img-box" style="width:<?php echo $setting->getImageProduct_BaseImageWidth(390) ?>px;">
<?php echo $this->getChildHtml('media') ?>
</div>
<?php
$related_product_collection = $_product->getRelatedProductCollection();
$related_product_collection->AddStoreFilter();
$count = count($related_product_collection);
?>
<div class="product-shop <?php if($count > 0 && $pageLayout=='1column'): ?>has-related<?php else: ?>no-related<?php endif ?>">
<div class="product-shop-wrapper <?php if($_product->isGrouped()): ?>grouped<?php endif ?>">
<?php list($_prev_prod, $_next_prod) = Mage::helper('em0113settings/product')->getPreviousNextProducts($this->getProduct()); ?>
<!--<?php if($_prev_prod != NULL): ?>
<a href="<?php echo $_prev_prod->getProductUrl(); ?>" title="<?php echo $this->__('Previous') ?>" class="prev"><?php echo $this->__('Previous') ?></a>
<?php endif; ?>
<?php if($_next_prod != NULL): ?>
<a href="<?php echo $_next_prod->getProductUrl(); ?>" title="<?php echo $this->__('Next') ?>" class="next"><?php echo $this->__('Next') ?></a>
<?php endif; ?>-->
<div class="product-name">
<h2><?php echo $_helper->productAttribute($_product, $_product->getName(), 'name') ?></h2>
</div>
<?php echo $this->getReviewsSummaryHtml($_product, false, true)?>
<!--<?php if ($this->canEmailToFriend()): ?>
<p class="email-friend"><a href="<?php echo $this->helper('catalog/product')->getEmailToFriendUrl($_product) ?>"><?php echo $this->__('Email to a Friend') ?></a></p>
<?php endif; ?>-->
<div class="Pro_des">
<?php if ($_product->getShortDescription()):?>
<div class="short-description">
<hr>
<br/>
<!-- <h2><?php echo $this->__('Quick Overview') ?></h2> -->
<div class="std"><?php echo $_helper->productAttribute($_product, nl2br($_product->getShortDescription()), 'short_description') ?></div>
</div>
<?php endif;?>
</div>
<!--
<?php if ($this->displayProductStockStatus()): ?>
<?php if($_product->isSaleable()): ?>
<p class="availability in-of-stock"><span><?php echo $this->__('In of stock') ?></span></p>
<?php else : ?>
<p class="availability out-of-stock"><span><?php echo $this->__('Out of stock') ?></span></p>
<?php endif; ?>
<?php endif; ?>
-->
<hr class="hr">
<?php if ($_product->isSaleable() && $this->hasOptions()):?>
<?php echo $this->getChildChildHtml('container2', '', true, true) ?>
<?php endif;?>
<hr class="hr">
<div class="check_delivery">
<?php echo $this->getLayout()->createBlock('core/template')->setTemplate('checkdelivery/checkdelivery.phtml')->toHtml();?>
</div>
<div class="Quick">
<div class="Quick_1">
<!--<?php if ($_product->getShortDescription()):?>
<div class="short-description">
<h2><?php echo $this->__('Quick Overview') ?></h2>
<div class="std"><?php echo $_helper->productAttribute($_product, nl2br($_product->getShortDescription()), 'short_description') ?></div>
</div>
<?php endif;?>-->
<div class="product-data">
<?php echo $this->getChildHtml('alert_urls') ?>
<?php echo $this->getChildHtml('product_type_data') ?>
<?php echo $this->getChildHtml('extrahint') ?>
<?php echo $this->getTierPriceHtml() ?>
</div>
<?php if (!$this->hasOptions()):?>
<div class="add-to-box">
<?php if($_product->isSaleable()): ?>
<?php echo $this->getChildHtml('addtocart') ?>
<?php else:?>
<?php echo $this->getChildHtml('addto') ?>
<?php endif; ?>
<!-- <?php if ($_product->isAvailable()) {?>
<div><?php //$buttonTitle = $this->__('Add to Cart'); ?>
<button type="button" title="<?php //echo $buttonTitle ?>" id="product-addtocart-button" class="button btn-cart" onclick="productAddToCartForm.submit(this)"><span><span><?php //echo $buttonTitle ?></span></span></button>
</div>
<br/>
<div ><button class="button buy-now" onclick="location.href ='{{config path="web/unsecure/base_url"}}/checkout/cart/add?product=1&qty=1'">
<span><span>Buy Now</span></span></button>
</div>
<?php }?>-->
</div>
<?php echo $this->getChildHtml('extra_buttons') ?>
<?php elseif (!$_product->isSaleable()): ?>
<div class="add-to-box">
<?php echo $this->getChildHtml('addto') ?>
</div>
<?php endif; ?>
</div>
<div class="Quick_2">
<!-- Soled By -->
<div class="soled_by">
<?php
$helper=Mage::helper('marketplace');
$_product=Mage::registry('current_product');
$productowner=Mage::getModel('marketplace/product')->isCustomerProduct($_product['entity_id']);
if($productowner['userid']!=""){
$captchenable = $percent = Mage::getStoreConfig('marketplace/marketplace_options/captcha');
$rowsocial=Mage::getModel('marketplace/userprofile')->getPartnerProfileById($productowner['userid']);
}
?>
<script type="text/javascript">
if (typeof jQuery == 'undefined'){
document.write(unescape("%3Cscript src='//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'%3E%3C/script%3E"));
}
</script>
<div class="soled-by-dealer">
<!--<div class="block-title"><strong><span>
<?php if($rowsocial['shoptitle']!='')
echo $rowsocial['shoptitle'];
else
echo $rowsocial['profileurl']; ?>
</span></strong>
</div>-->
<h5> SOLD BY : </h5>
<span>
<?php if($rowsocial['profileurl'] == "kidsdial2")
{?>
<a href="<?php echo Mage::getUrl('marketplace/seller/collection').$rowsocial['profileurl'] ?>" title="<?php echo "Totaltoys"; ?>" id="siteconnect">
<?php echo "Totaltoys"; ?></a><?php
}
else{?>
<a href="<?php echo Mage::getUrl('marketplace/seller/collection').$rowsocial['profileurl'] ?>" title="<?php echo $rowsocial['profileurl']; ?>" id="siteconnect">
<?php echo $rowsocial['profileurl']; ?></a><?php
}
?>
</span>
</div>
<br/>
<div class="delivery_details">
<div class="COD">
<?php $attribute = $_product->getResource()->getAttribute('cod_available');
$attribute_value = $attribute ->getFrontend()->getValue($_product);
if ($attribute_value == "Yes"){ ?>
<h5> CASH ON DELIVERY </h5>
<div class="Delivery_hover_details">?<p class="killing"><?php echo "Available";?></p></div>
<?php }else{ ?>
<i class="fa fa-times"></i>
<p>
<h5 style="position:relative;bottom: 11px;">CASH ON DELIVERY </h5>
<p class="reduce"><?php echo " Not Available"; ?></p>
</p>
<?php } ?>
<span class="coupontooltip">
<div class="cod_content">
<h5>How do I place a Cash on Delivery (COD) order?</h5>
<p>All items that have the "Cash on Delivery Available" icon are valid for order by Cash on Delivery.</p>
<p>Add the item(s) to your cart and proceed to checkout.When prompted to choose a payment option, select "Cash on Delivery". </p>
<p>Once you place the order you will receive confirmation call from our customer support for validation with in 48 hours. Once verified and confirmed, your order will be processed for shipment in the time specified, from the date of confirmation. You will be required to make a cash-only payment to our courier partner at the time of delivery of your order to complete the payment.</p>
<p>Terms & Conditions</p>
<p>The maximum order value for COD is ₹5000.</p>
<p>e-Gift Vouchers or Store Credit cannot be used for COD orders.</p>
<p>Cash-only payment at the time of delivery.</p>
</div>
</span>
</div>
<div class= "bottom3">
<!-- wholesale available -->
<?php
//$product is your current product
if($_product->getTierPrice()) {
echo "
<div class = 'quickphp'>
<h5>Wholesale</h5>
Available.<br>
Usually Delivered in 10-15 business days.
</div>
";
}
else{
echo "
<div class = 'quickphp'>
<h5>Wholesale</h5>
Not Available.<br>
</div>
";
}
?>
<div class="avail">
<?php if ($this->displayProductStockStatus()): ?>
<?php if($_product->isSaleable()): ?>
<p class="availability in-of-stock"> <h5>Availability</h5> <?php echo $this->__('In Stock') ?></span></p>
<?php else : ?>
<p class="availability out-of-stock"> <h5>Availability</h5> <?php echo $this->__('Out of stock') ?></span></p>
<?php endif; ?>
<?php endif; ?>
</div>
<div class="replace">
<span> <b>7 days</b> Replacement Guarantee</span>
<div class="Delivery_hover_details">?
<span class="coupontooltip">
<h5> How do I return an item purchased on Totaltoys.com</h5>
<p>Conveniently, you can call us at 092-434-22233 and email us at contact@totaltoys.com with order number, invoice number and product name. If you've received an item in a 'Damaged', 'Defective' or 'Not as Described' state.</p>
<h5>Return & Replacement policy:</h5>
<p>Returns or replacement request should be placed within 7 days from the date of delivery.</p>
<p>As we receive your request, our concerned team will contact you to validate the compliant. The validation process may require submitting of product photos. Once the validation process is completed then further action will be taken.
Once the product reaches to us/seller, the replacement will be proceed in 1-2 working days after physical inspection of the goods and shipment will be done simultaneously.</p>
<p>If you've received an item in a 'Damaged', 'Defective' or 'Not as Described' state, all replacements/pickups will be done free of cost.</p>
<p>If the packaging is tampered with or damaged, before accepting delivery of the goods, please refuse to take delivery of the package, and call us on 092-434-22233 or mail us at contact@totaltoys.com , mentioning your order reference number. We shall make our best efforts to ensure that a replacement delivery is made to you at the earliest.</p>
<p>In the rare circumstances where a pickup cannot be done, you can ship the product through any courier. You will be reimbursed the shipping charges against the original receipt.</p>
<p>Replacement is subjected to availability of stock. In case a replacement is not available, the amount will be refunded to your account from which the purchase was made. (Amount includes shipping and gift wrapping charges)</p>
<h5> Return Request is not Accepted If:</h5>
<li>Return request is made outside the specified time period</li>
<li>Missing of tags, labels, original packing, and invoice.</li>
<li>Misused or Mishandle of the product from customer end.</li>
<p>For all refunds we will refund the amount to same mode of payment as used during checkout. Refunds for cash on delivery will be made via online transfer of funds to the customers bank account.</p>
<p>If the customer chooses to cancel the order before the product is shipped, he will be entitled to a 100% refund.
Do I have to return the free gift when I return a product?</p>
<p>Yes. The free gift is included as part of the item order and needs to be returned along with the originally delivered product</p>
<p>Please contact us on contact@totaltoys.com or call us at 092-434-22233 for any doubts and concerns</p>
</span>
</div>
</div>
</div>
</div>
<div class="Delivery">
<h5> Delivered By </h5>
<div class="Delivery_hover_details">?
<span class="coupontooltip">
<div class="delivery_content">
<h5>What is the estimated delivery time?</h5>
<p>Sellers generally procure and ship the items within the time specified on the product page. Business days exclude public holidays and Sundays.</p>
<p>Estimated delivery time depends on the following factors:
<li>Time of the order, usually orders made after 2:00pm can be shipped only on next workingday</li>
<li>The Seller offering the product</li>
<li>Product's availability with the Seller</li>
<li>The destination to which you want the order shipped to and the Seller's location</li></p>
</div>
</span>
</div>
<ul class="fk-ul-disc">
<li>Usually Delivered in 3-5 business days.</li>
<li> Delivery Time may exceed than usual due to Festival Holidays</li>
</ul>
</div>
</div>
</div>
<!--<?php if (!$this->hasOptions()):?>
<div class="add-to-box">
<?php if($_product->isSaleable()): ?>
<?php echo $this->getChildHtml('addtocart') ?>
<?php else:?>
<?php echo $this->getChildHtml('addto') ?>
<?php endif; ?>
</div>
<?php echo $this->getChildHtml('extra_buttons') ?>
<?php elseif (!$_product->isSaleable()): ?>
<div class="add-to-box">
<?php echo $this->getChildHtml('addto') ?>
</div>
<?php endif; ?>-->
<?php echo $this->getChildHtml('other');?>
<?php echo $this->getChildHtml('short_des_after'); ?>
<?php if ($_product->isSaleable() && $this->hasOptions()):?>
<?php echo $this->getChildChildHtml('container1', '', true, true) ?>
<?php endif;?>
<?php echo $this->getChildHtml('shippingreturns') ?>
</div>
</div>
<!--<span class="or_buy_now"> -- OR --</span>-->
<!--<button type="button" title="<?php echo $buttonTitle ?>" id="product-addtocart-button" class="button btn-cart" onclick="productAddToCartForm.submit(this)"><span><span><?php echo $buttonTitle ?></span></span></button>-->
<!--<a href="<?= $this->getAddtoCartUrl($_product, array('qty' => $_price['price_qty'])) ?>"> Buy Now </a>-->
<div class="clearer"></div>
</form>
</div>
<!-- Add button share facebook -->
<?php if ($setting->getImageProduct_ViewSocial()): ?>
<div id="social-share" class="hide-lte0 hide-lte1 hide-lte2"></div>
<script type="text/javascript">
jQuery(document).ready(function($){
jQuery('#social-share').dcSocialShare({
buttons: 'facebook,plusone,twitter,pinterest',
twitterId: 'designchemical',
email: 'moc//niamod/liame',
align: 'right',
floater: false
});
});
</script>
<?php endif; ?>
<script type="text/javascript">
//<![CDATA[
var productAddToCartForm = new VarienForm('product_addtocart_form');
productAddToCartForm.submit = function(button, url) {
if (this.validator.validate()) {
var form = this.form;
var oldUrl = form.action;
if (url) {
form.action = url;
}
var e = null;
try {
this.form.submit();
} catch (e) {
}
this.form.action = oldUrl;
if (e) {
throw e;
}
if (button && button != 'undefined') {
button.disabled = true;
}
}
}.bind(productAddToCartForm);
productAddToCartForm.submitLight = function(button, url){
if(this.validator) {
var nv = Validation.methods;
delete Validation.methods['required-entry'];
delete Validation.methods['validate-one-required'];
delete Validation.methods['validate-one-required-by-name'];
// Remove custom datetime validators
for (var methodName in Validation.methods) {
if (methodName.match(/^validate-datetime-.*/i)) {
delete Validation.methods[methodName];
}
}
if (this.validator.validate()) {
if (url) {
this.form.action = url;
}
this.form.submit();
}
Object.extend(Validation.methods, nv);
}
}.bind(productAddToCartForm);
//]]>
</script>
</div>
<div class="product-collateral">
<?php foreach ($this->getChildGroup('detailed_info', 'getChildHtml') as $alias => $html):?>
<div class="box-collateral <?php echo "box-{$alias}"?>">
<?php if ($title = $this->getChildData($alias, 'title')):?>
<h2><?php echo $this->escapeHtml($title); ?></h2>
<?php endif;?>
<?php echo $html; ?>
</div>
<?php endforeach;?>
<?php echo $this->getChildHtml('product_additional_data') ?>
<?php echo $this->getChildHtml('product_additional_collateral') ?>
</div>
<?php echo $this->getChildHtml('catalog.product.related'); ?>
<?php echo $this->getChildHtml('review_list') ?>
<?php echo $this->getChildHtml('upsell_products') ?>
<?php if (Mage::helper('em0113settings')->getImageProduct_UseTabs()): ?>
<script type="text/javascript">
//<![CDATA[
jQuery(window).ready(function() {
setTimeout(function() {
timeout = null;
EM.tools.decorateProductCollateralTabs();
}, 200);
});
//]]>
</script>
<?php endif ?>
</div>
<!-- mobile -->
<div class="set">
<?php $attributeSetModel = Mage::getModel("eav/entity_attribute_set");
$product=Mage::getModel('catalog/product')->load($_product->getId());
$attributeSetModel->load($product->getAttributeSetId());
$attributeSetName = $attributeSetModel->getAttributeSetName();
if($attributeSetName=='Mobile'){ echo $this->__('color may vary as shown in above image'); } ?>
</div>
<!-- mobile end-->
<style>
.reduce {
clear: both;
float: left;
bottom: 13px;
border-radius: 2px;
color: #666;
display: inline-block;
font-size: 11px;
height: 0px;
line-height: 6px;
position: relative;
text-align: center;
text-decoration: none;
}
.set {
position:relative;
bottom:950px;
}
</style>
1 个答案:
答案 0 :(得分：1)
为什么要使用CSS移动它，当你可以通过phtml文件代码移动它时。
搜索以下代码：
<?php if ($_product->isSaleable() && $this->hasOptions()):?>
<?php echo $this->getChildChildHtml('container2', '', true, true) ?>
<?php endif;?>
移动并放置此项：
<div class="check_delivery">
<?php echo $this->getLayout()->createBlock('core/template')->setTemplate('checkdelivery/checkdelivery.phtml')->toHtml();?>
</div>
所以您的代码现在看起来像是：
<hr class="hr">
<?php if ($_product->isSaleable() && $this->hasOptions()):?>
<?php echo $this->getChildChildHtml('container2', '', true, true) ?>
<?php endif;?>
<hr class="hr">
<div class="check_delivery">
<?php echo $this->getLayout()->createBlock('core/template')->setTemplate('checkdelivery/checkdelivery.phtml')->toHtml();?>
</div>
完成此操作后，清除CACHE - 删除/ var / cache和/ var / full_page_cache（如果适用）文件夹。
关于您的代码的其他输入很少，Magento Standard编码方法必须遵循最佳实践。
<强> 1。例如，您可能想要清理代码。 Magento的建议是在通过phtml文件添加任何内容时使用以下编码方式。
<?php echo $this->__('Your Content'); ?> //this is called TRANSLATION in Magento
这意味着，你应该做这样的事情：
<span class="coupontooltip">
<div class="cod_content">
<h5><?php echo $this->__('How do I place a Cash on Delivery (COD) order?'); ?></h5>
...
...
..
</div>
</span>
当您使用其他语言环境创建网站时，此翻译会有所帮助。
<强> 2。其次，建议注释掉行。
请勿使用HTML评论注释掉代码。使用方法如下：
单行评论
<?php //<b>Strong</b> ?>
多行评论
<?php /*<b>Strong</b>*/ ?>
第3。不要在同一个phtml文件中编写CSS
在/ skin / frontend / yourpackage / youtheme / css文件夹下使用styles.css
[根据所需修改编辑答案]
在/ app / design / frontend / yourpackage / yourtheme / layout文件夹中查找catalog.xml文件，搜索as =“container2”
<catalog_product_view translate="label">
...
...
...
<block type="core/template_facade" name="product.info.container2" as="container2">
<action method="setDataByKey"><key>alias_in_layout</key><value>container2</value></action>
<action method="setDataByKeyFromRegistry"><key>options_container</key><key_in_registry>product</key_in_registry></action>
<action method="append"><block>product.info.options.wrapper</block></action>
<!--action method="append"><block>product.info.options.wrapper.bottom</block></action>
</block--> <!--comment out this line-->
<action method="unsetCallChild"><child>container1</child><call>ifEquals</call><if>0</if><key>alias_in_layout</key><key>options_container</key></action>
<action method="unsetCallChild"><child>container2</child><call>ifEquals</call><if>0</if><key>alias_in_layout</key><key>options_container</key></action>
</block>
...
</catalog_product_view>
要将COLOR和CHARACTER下拉列表/选项彼此相邻移动，请以这种方式更新代码：
<div class="desc-options"> //add new div
<div class="Pro_des">
<?php if ($_product->getShortDescription()):?>
<div class="short-description">
<hr>
<br/>
<div class="std"><?php echo $_helper->productAttribute($_product, nl2br($_product->getShortDescription()), 'short_description') ?>
</div>
</div>
<?php endif;?>
</div>
<?php if ($_product->isSaleable() && $this->hasOptions()):?>
<?php echo $this->getChildChildHtml('container2', '', true, true) ?>
<?php endif;?>
</div>
从“Check Delivery ...”上方删除下面的代码块
<hr class="hr">
<?php if ($_product->isSaleable() && $this->hasOptions()):?>
<?php echo $this->getChildChildHtml('container2', '', true, true) ?>
<?php endif;?>
按以下方式添加CSS
styles.css line no: 1021, search for ".product-options"
Change the width: 100% to width: 50%;
在THEME CSS中执行以下操作：
.product-view .short-description { width: 50%; float:left; }
dl dt {
font-weight: bold;
display: block;
margin: 0 0 .5em;
}
.product-options dd {
margin: 4px 0;
display: inline-block;
}
要将ADD TO CART和现在购买按钮移动为简单产品，请以这种方式更新您的代码：
<div class="Quick_1">
<div class="product-data">
<?php echo $this->getChildHtml('alert_urls') ?>
<?php echo $this->getChildHtml('product_type_data') ?>
<?php echo $this->getChildHtml('extrahint') ?>
<?php echo $this->getTierPriceHtml() ?>
<?php echo $this->getChildHtml('product.info.options.wrapper.bottom') ?> // add this line
</div>
如果有帮助，请告诉我。
快乐编码......
相关问题
最新问题
- 我写了这段代码，但我无法理解我的错误
- 我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？
- 是否有可能使 loadstring 不可能等于打印？卢阿
- java中的random.expovariate()
- Appscript 通过会议在 Google 日历中发送电子邮件和创建活动
- 为什么我的 Onclick 箭头功能在 React 中不起作用？
- 在此代码中是否有使用“this”的替代方法？
- 在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化
- 每千个数字得到
- 更新了城市边界 KML 文件的来源？