title: How target html and css to a specific page?
body: <p>I am using Squarespace as my website builder. I have added a search icon above my blog feed <a href="https://www.livingwithphotography.co.uk/learn/" rel="nofollow">https://www.livingwithphotography.co.uk/learn/</a> however for some reason the search box also appears on each blog post as well. This is what I don't want, instead I just want it to be shown on this page <a href="https://www.livingwithphotography.co.uk/learn/" rel="nofollow">https://www.livingwithphotography.co.uk/learn/</a>.</p>
  
  <p>In order to code search icon I added this code in the site header</p>
  
  <pre><code>&lt;script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" &gt;&lt;/script&gt;
  </code></pre>
  
  <p>I then added this css code</p>
  
  <pre><code>.myTitle {
  width: 100px;
  padding: 10px;
  border: 1px solid grey;
  margin: 40px; 
  font-size: 22px;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  }
  </code></pre>
  
  <p>Lastly I then added this code to the PAGE HEADER CODE INJECTION</p>
  
  <pre><code>&lt;div class="myTitle"&gt;&lt;a href="/search?q=&amp;f_collectionId=5568d109e4b0cb923356090b"&gt;&lt;img src="https://livingwithphotography.squarespace.com/s/Screen-Shot-2015-06-01-at-120646.png" alt="search icon" style="width:20px"&gt;  &lt;a href="/search?q=&amp;f_collectionId=5568d109e4b0cb923356090b"&gt;Search&lt;/a&gt;&lt;/div&gt;
  &lt;script&gt;
    $(document).ready(function() {
    $(".myTitle").prependTo("#content");
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>I hope there is a way, thanks for your help :)</p>