Question

我使用Squarespace作为我的网站建设者。我在博客Feed https://www.livingwithphotography.co.uk/learn/上方添加了一个搜索图标，但出于某种原因，搜索框也会出现在每篇博客文章中。这是我不想要的，而我只是希望它显示在此页https://www.livingwithphotography.co.uk/learn/上。

为了编码搜索图标，我在网站标题中添加了此代码

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script>

然后我添加了这个css代码

.myTitle {
width: 100px;
padding: 10px;
border: 1px solid grey;
margin: 40px; 
font-size: 22px;
text-align: center;
margin-left: auto;
margin-right: auto;
}

最后，我将此代码添加到PAGE HEADER CODE INJECTION

<div class="myTitle"><a href="/search?q=&f_collectionId=5568d109e4b0cb923356090b"><img src="https://livingwithphotography.squarespace.com/s/Screen-Shot-2015-06-01-at-120646.png" alt="search icon" style="width:20px">  <a href="/search?q=&f_collectionId=5568d109e4b0cb923356090b">Search</a></div>
<script>
  $(document).ready(function() {
  $(".myTitle").prependTo("#content");
});
</script>

我希望有办法，谢谢你的帮助:)。

Answer 1

这有点hacky，但它应该工作。将代码包装在此前面的代码中。

$(document).ready(function() {
    if(window.location.pathname == "/learn") {
        $(".myTitle").prependTo("#content");
    }
});

Answer 2

劳伦斯，

在您的CMS（SQ）中，您想要的mod类型实际上最好在＆＃39;开发者＆＃39;模式。从本质上讲，只有一个集合ID分配给博客本身，这就是为什么当你注入主页面/内容区域时，它会像你注意到的那样全面出现。唯一的区别因素是博客概述页面添加了＆＃34; blog-list＆＃34;的类，而博客条目页面添加了类＆＃34;博客项目＆＃34; （同样，两者仍然包含在同一个集合中）。

所有人都说，如果您正在尝试使用Jquery在博客模块上的现有模板中执行此操作（并且您不切换到开发人员），那么解决方法之一是针对＆＃34; .entry-header＆＃34;的第一个实例。博客上的课程[而不是使用＆＃39; prependTo＆＃39; ＃内容]。

在定位条目标题的第一个实例后，您还需要隐藏＆＃39; .blog-items＆＃39;页面也是（这些是实际的条目本身）。通过这种方法，您的新班级＆＃34; myTitle＆＃34;应该在博客概述页面上显示 only （在您的情况下：/ learn /），但将其隐藏在实际的文章条目视图中。

所以不要使用现有的，而是尝试使用：

$(document).ready(function() {
 $('.myTitle').insertBefore('.entry-header:first');
});

然后在Custom CSS put：

.myTitle {
    font-size: 30px;
    margin: 40px auto;
    padding: 10px;
    text-align: center;
    width: 201px;
}
.blog-item .myTitle {
    display: none;
}

作为一个说明，虽然它不完全＆＃34;正确＆＃34;表单，许多只是将整个shebang直接放入博客模块标题，因为它的页面具体并且不会全局运行。

在这种情况下，您只需将所有代码直接输入：＆gt;配置博客＆gt;高级。这是一个截图示例（注意：直接从他们的UI拍摄，以及为什么线条看起来很时髦）：

enter image description here

最后注意：此方法确实有效，但请记住，如果您操纵了网站中的其他元素（如果您这样做我也不知道），那么其他更改也可能影响。

希望这会有所帮助。

Answer 3

您可以使用Squarespace搜索块和汇总块来执行此操作而无需任何编码：

只需创建一个新页面。
插入＆＃34;搜索＆＃34;阻止并限制它仅搜索您的博客集合。
插入＆＃34;摘要＆＃34;阻止并将其设置为显示现有博客。

以下是我在网站上设置的示例：method set

如何将html和css定位到特定页面？

3 个答案: