通过自定义布局更新隐藏某些类别的“颜色”属性商店
Posted
技术标签:
【中文标题】通过自定义布局更新隐藏某些类别的“颜色”属性商店【英文标题】:Hide Shop By "Color" Attribute on Certain Categories via Custom Layout Update 【发布时间】:2015-08-25 21:47:00 【问题描述】:如何通过自定义布局更新在单个类别中隐藏此属性,我创建了一个新的 css 文件并将下一个代码添加到我想隐藏颜色属性的类别中的自定义布局更新
<reference name="head">
<action method="addCss"><stylesheet>css/custommods.css</stylesheet></action>
</reference>
现在,custommods.css 是
.faq_accordian .arrowlistmenu
visibility: hidden;
但此代码隐藏了所有 Shop By 属性,因为所有属性都具有相同的类。这是styles.css文件的sn-p
/* ======================================================================================= */
/* ===================accordian */
.faq_accordianmargin:0;padding:0;
.faq_right
width:732px;
height:auto;
float:left;
.faq_bannerbackground:url(images/media_banner.png) no-repeat;
height:139px;
width:724px;
border-bottom:3px solid #fec00f;
.faq_banner h1 font-family: 'futura_ltregular'; font-size:32px;color:#fec00f;margin-left:30px;margin-top:0px;padding-top:15px;font-weight:normal;text-transform:uppercase;
.faq_banner p width:330px;margin-left:30px;color:#cccccc;font-weight:bold;
.faq_right h3 padding-left:25px;font-weight:normal;
.col-right
float: right;
.col3-layout .col-main float:right;
.col3-layout .col-wrapper float:left;
.col3-layout .grid_3 margin:0;
.col3-layout .grid_6 width:490px;
/*left menu */
.faq_accordian .arrowlistmenu
.faq_accordian .arrowlistmenu .menuheader /*CSS class for menu headers in general (expanding or not!)*/
background:url(../images/down_arrow.png) no-repeat scroll right 15px !important;
color: #404040;
cursor: pointer;
font-family: "futura_lt_btlight";
margin: 10px 0 0;
padding:5px;
text-transform: none;
border: 1px solid #D5D5D5;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
font-weight:normal;
/*font-size:16px;*/
.faq_accordian .arrowlistmenu ul li:hover,.faq_accordian .arrowlistmenu ul li:hover abackground-color:#181818;color:#FFF !important;
#narrow-by-list .arrowlistmenu .categoryitems li a:hovercolor:#ffffff !important;
/*.faq_accordian .arrowlistmenu h3
margin: 0 !important;
*/
.add-to-cart .button.btn-cart:hover border-bottom: 3px solid #000 !important;
margin-bottom: -3px;
color: #000 !important;
text-decoration: none !important;
/*.faq_accordian:nth-child(2) .arrowlistmenu h3 border: 1px solid transparent !important;
margin: 40px 0 0 !important; */
.arrowlistmenu .menuheader /*CSS class for menu headers in general (expanding or not!)*/
background:url(../images/open_arrow.png) no-repeat scroll right 12px !important;
color: #404040;
cursor: pointer;
font:bold 12px 'futura_ltregular', Helvetica, sans-serif;
margin: 10px 0 0;
padding:8px !important;
text-transform: none;
border: 1px solid #D5D5D5;
-webkit-border-radius: 0px !important;
-moz-border-radius: 0px !important;
border-radius: 0px !important;
.faq_accordian .arrowlistmenu .openheader /*CSS class to apply to expandable header when it's expanded*/
background: url(../images/down_arrow.png) no-repeat scroll right 10px #fafafa;
border:1px solid #eaeaea;
color:#000;
.faq_accordian .arrowlistmenu ul , .faq_accordian .arrowlistmenu ol /*CSS for UL of each sub menu*/
list-style-type: none;
margin: 0;
padding: 0;
margin-bottom: 8px; /*bottom spacing between each UL and rest of content*/
background:#fff;
border:1px solid #eaeaea;
padding:10px;
.faq_accordian .arrowlistmenu ul li , .faq_accordian .arrowlistmenu ol li
color: #404040;
display: block;
font-family: "futura_lt_btlight";
font-size: 12px;
text-decoration: none;
line-height:25px;
padding: 5px;
.faq_accordian .arrowlistmenu ul li p , .faq_accordian .arrowlistmenu ol li p
display: block;
font-family: 'futura_ltregular',Helvetica,sans-serif;
font-size: 14px;
text-decoration: none;
line-height:21px;
.faq_accordian .arrowlistmenu ul li a , .faq_accordian .arrowlistmenu ol li p
color:#666 !important;
.faq_accordian .arrowlistmenu ul li a:visited , .faq_accordian .arrowlistmenu ol li a:visited
color:#cccccc;
.faq_accordian .arrowlistmenu ul li a:hover , .faq_accordian .arrowlistmenu ol li a:visited /*hover state CSS*/
color:#404040;
也许解决方案是为这个单一的“颜色”属性创建一个不同的类并将其可见性设置为隐藏?但是我必须在其中进行 css 修改的文件在哪里?
谢谢。
【问题讨论】:
【参考方案1】:body 标签应该有一个带有类别名称的类,例如category-nails
,所以你应该像这样编辑你的css:
.category-nails .faq_accordian .arrowlistmenu
visibility: hidden;
只针对该类别。
如果正文没有该类,请确保在您的模板文件中(可能是1column.phtml
)正文是这样的:
<body<?php echo $this->getBodyClass()?' class="'.$this->getBodyClass().'"':'' ?>>
【讨论】:
以上是关于通过自定义布局更新隐藏某些类别的“颜色”属性商店的主要内容,如果未能解决你的问题,请参考以下文章