0

在编码方面，我几乎是一个新手，因此非常感谢您的耐心等待。如果我没有正确表达我的问题，请原谅我。

我正在开发的网站使用 Wordpress；这是一个房地产网站，所以绑定了 IDX Broker（使用的 Wordpress 主题是 SiteOrigin Corp，使用的 Wordpress 插件是 IMPress for IDX Broker）。

IDX Broker 是我遇到 CSS 问题的地方 - 我在 IDX Broker 中创建了一个“测试”代理配置文件，我正在尝试执行以下操作：

1) 将“办公电话：”和“手机：”的标签分别更改为“O：”和“C：”。自定义 CSS 是为显示所有代理的“主”名册页面编写的（https://gatewayrealtynp.idxbroker.com/idx/roster），但我无法让 CSS 在单个代理页面/bios 上工作.

2）删除个人代理页面上的“展开/折叠”选项，以便在您单击个人后立即显示简历中的所有文本。几天前用于此的 CSS 工作，但突然停止工作。Sheri Bourne 就是一个“活”的例子。我的“测试”配置文件是这样的：https ://gatewayrealtynp.idxbroker.com/idx/agent/143971/hope-richardson?agentHeaderID=143971

我想指出，我已经检查了网站的实时页面，并试图确保我使用了正确的类标签/属性。我搜索了 IDX Broker 的知识库和他们的教程，但没有运气，因为他们没有对自定义 CSS 做任何事情。此外，我花了几天时间搜索互联网，寻找解决方案，包括 W3schools。

这是名册页面上使用的自定义 CSS，关于上面的 #1：

/* Remove Blank Left Column */
.site-main {
  margin: 0px !important;
}
/* Change "Cell Phone: " */
.IDX-roster-agentCellPhone .IDX-rosterLabel {
  display: none;
}
.IDX-roster-agentCellPhone::before {
  content: "C: ";
}
/* Change "Office Phone: " */
.IDX-roster-agentOfficePhone .IDX-rosterLabel {
  display: none;
}
.IDX-roster-agentOfficePhone::before {
  content: "O: ";
}
/* Smaller Display Name */
.IDX-rosterDisplayName {
  font-size: 0.8em;
}
/* Smaller Email or wrap if needed */
.IDX-rosterAgentEmailLink {
  word-wrap: break-word;
}
.IDX-rosterAgentEmailLink a,
.IDX-rosterStaffEmailLink a {
  font-size: 0.7em;
}
/* Less padding around Agents */
.IDX-rosterAgentWrap {
  padding-left: 5px !important;
  padding-right: 5px !important;
}
/* Less padding for agent's text */
.IDX-row ul {
  margin: 0 0 27px 0px;
}
.IDX-wrapper-standard .IDX-nav > li > a {
  padding: 0 !important;
}
.IDX-wrapper-standard .IDX-actionLinks > li > a > i {
  margin-right: 0;
}

这是我写的 CSS 和 HTML 来尝试解决上面的 1 和 2：

<style>
}
div#IDX-bio-collapse {
    display: none !important;
}
}
div#IDX-bioExpand {
    display: none !important;
}
/* Change "Cell Phone: " */
.IDX-agentCellPhone .IDX-agentInfo {
  display: none;
}
.IDX-agentCellPhone::before {
  content: "C: ";
}
/* Change "Office Phone: " */
.IDX-agentOfficePhone .IDX-agentInfo {
  display: none;
}
.IDX-agentOfficePhone::before {
  content: "O: ";
}
ul.bottomnav {
    display: flex;
    list-style-type: none;
    margin: 0;
    padding: 0;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background-color: #ffffff;
}
ul.bottomnav li a {
    float: left;
    position: relative;
    display: inline-block;
    width: fit-content;
    color: #000000;
    font-family: Verdana, Arial, sans-serif;
    font-size: 16px;
    font-style: bold;
    margin: 0;
    padding: 20px 20px;
    text-decoration: none;
}
ul.bottomnav li a:hover:not(.active) {background-color: #ffe4e1;}
ul.bottomnav li a.active {background-color: #ffffff;}
ul.bottomnav li.center {float: center;}
@media screen and (max-width: 600px){
    ul.bottomnav li.left,
    ul.bottomnav li {float: none;}
</style>
<body>
<p style="text-align: left;">This is a test profile. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Nulla pharetra diam sit amet nisl suscipit adipiscing bibendum.</p>
<p style="text-align: left;">Sit amet purus gravida quis blandit turpis cursus in hac. Scelerisque eu ultrices vitae auctor. Sem fringilla ut morbi tincidunt augue interdum velit euismod. Sed libero enim sed faucibus. Nulla aliquet enim tortor at auctor urna nunc. Varius vel pharetra vel turpis nunc eget lorem dolor sed. Et netus et malesuada fames. Sed enim ut sem viverra aliquet eget sit. Sollicitudin ac orci phasellus egestas tellus rutrum tellus pellentesque eu. Lobortis scelerisque fermentum dui faucibus in.</p>
<ul class="bottomnav">
<li><a href="https://gatewayrealtynp.com/buy//">Buy Your Dream Home</a></li>
<li><a href="https://gatewayrealtynp.com/sell/">Sell Your Home</a></li>
<li><a href="https://visitnorthplatte.com/" target="_blank">About North Platte</a></li>
</ul>
<p style="text-align: left; font-family: Verdana, Arial, sans-serif; font-style: italic; font-size: 12px;">When we decided to move to North Platte, we didn't have a Realtor, so we just picked JoAnn out of the clear blue sky. She was a great find! We were very pleased with the service we received from JoAnn. We found our retirement home in a fantastic neighborhood where we have such good neighbors. I would recommend JoAnn to anyone needing any Real Estate assistance, she will go the distance for you.<p/>
<p style="text-align: left; font-family: Verdana, Arial, sans-serif; font-style: bold; font-size: 12px;">- Tim & Cindy Bundy</p>
<p style="text-align: left; font-family: Verdana, Arial, sans-serif; font-style: italic; font-size: 12px;">Jodi is a true rockstar at her job with a genuine passion for helping people find the home of their dreams! She has helped us find 2 homes now with zero hassle. Jodi makes buying a house easier than buying a gallon of milk from Walmart.</p>
<p style="text-align: left; font-family: Verdana, Arial, sans-serif; font-style: bold; font-size: 12px;">- Eric Moeller</p>
</body>

任何帮助/方向将不胜感激！

4

1 回答 1

0

Looks like you might need

span.IDX-agentInfo__title { display: none; }

To remove the Cell Phone: and Office Phone:.

For expanding I would just add some JS to remove the class.

var element = document.getElementById("IDX-agentbio"); element.classList.remove("IDX-agentbio__collapse");

Since it's IDX pages I would add these in the account in the Custom CSS and Sub header respectively.

于 2018-11-06T22:24:01.863 回答