colin.irwin

You put the actual pages in the Not Linked section and then add Links to them in the main navigation. 
 

You put the actual pages in the Not Linked section and then add Links to them in the main navigation. 
 

Here's what you need to do. 
First, wrap your code as follows
<script> window.Squarespace.onInitialize(Y, function(){ // Your code here }); </script>  
This will execute the code on each page load. 
Next, you may need to modify the code so that it only runs for the specific page. You do this by testing the body tag for the presence of the specific collection id. 

That's not where you inject it..
Put it in
Design > Custom CSS

Try adding this to the custom css area, after any other code that may be there. Also remove your code.

 
@media only screen and (max-width: 768px) { body { h1,h2,h3,p,li,a,em,i,strong { -webkit-hyphens: none !important; hyphens: none !important; } .page-desc p { -webkit-hyphens: none !important; hyphens: none !important; } } }  

Try adding this to the custom css area, after any other code that may be there. Also remove your code.

 
@media only screen and (max-width: 768px) { body { h1,h2,h3,p,li,a,em,i,strong { -webkit-hyphens: none !important; hyphens: none !important; } .page-desc p { -webkit-hyphens: none !important; hyphens: none !important; } } }  

Try somthing like this in your custom css
@media only screen and (max-width: 640px) { .sqs-slice-group.group-copy { padding-top: 147px; } } Then play with the padding-top value to get something that works well across mobile devices.

Excellent!

As a test I created a gallery called test gallery. 
Then I gave some of the items in the gallery links 

 
I created a summary block on another page that uses the gallery as the source of its images. 
Then I created a css rule to kill pointer events for any summary items whose link is from the original gallery (begins with /test-gallery).
It works as expected. Items with no clickthrough url have a standard cursor and are not clickable but those with a clickthrough work properly. 

Here is the code - insert it at the bottom of your custom css area after any other code that may already be there. You'll need to tweak href ^= "***" to reflect your gallery slug 
.summary-item a[href^="/test-gallery"] { pointer-events: none; }

As a test I created a gallery called test gallery. 
Then I gave some of the items in the gallery links 

 
I created a summary block on another page that uses the gallery as the source of its images. 
Then I created a css rule to kill pointer events for any summary items whose link is from the original gallery (begins with /test-gallery).
It works as expected. Items with no clickthrough url have a standard cursor and are not clickable but those with a clickthrough work properly. 

Here is the code - insert it at the bottom of your custom css area after any other code that may already be there. You'll need to tweak href ^= "***" to reflect your gallery slug 
.summary-item a[href^="/test-gallery"] { pointer-events: none; }

The following css should be added to the Advanced tab of your cover page settings. 
<style> .sqs-slice-buttons { animation: fade-me-in 3s; } @keyframes fade-me-in { 0% {opacity:0;} 80% {opacity:0;} 100% {opacity:1;} } <style>  
There are 2 sections to the code. 
In the first section you set the total length of the fade in, from invisible to fully visible. It is set to 3 seconds above but you can change it. 
In the second section you can define how long the buttons stay invisible before they start to fade in. In the example it is set so that the buttons remain invisible for 80% of the3s animation duration (2.4s invisible) and then fades in over the remaining 0.6s.
 
 

Can you share your modified code?

It looks like the syntax highlighting on this forum also strips the / from tags. 
 I have tweaked the code above, please try again. 

@rdreed Your code
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> <div class="logoload"></div> <style> .logoload { /* SET BACKGROUND COLOR */ background-color: #fff; /* SET BACKGROUND SIZE */ background-size: 90px; position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 9999; background-position: center; background-repeat: no-repeat; background-image: url("https://static1.squarespace.com/static/5d9db9630e0cb109b5331185/t/5db877bc05d8093cb6fbfe15/1572370384602/mrnice-smiley.gif"); } </style> <script type="text/javascript"> $(window).load(function() { $(".logoload").delay(500).fadeOut("slow"); }) </script>  

If it's the team member gallery you want to customise the code would be 
.summary-item a[href^="/en/teamphoto"] { pointer-events: none; }  

Thank you very much!!! It worked great!
Alessandro

Do you have a link to a page with such a summary block?

As a test I created a gallery called test gallery. 
Then I gave some of the items in the gallery links 

 
I created a summary block on another page that uses the gallery as the source of its images. 
Then I created a css rule to kill pointer events for any summary items whose link is from the original gallery (begins with /test-gallery).
It works as expected. Items with no clickthrough url have a standard cursor and are not clickable but those with a clickthrough work properly. 

Here is the code - insert it at the bottom of your custom css area after any other code that may already be there. You'll need to tweak href ^= "***" to reflect your gallery slug 
.summary-item a[href^="/test-gallery"] { pointer-events: none; }

The following css should be added to the Advanced tab of your cover page settings. 
<style> .sqs-slice-buttons { animation: fade-me-in 3s; } @keyframes fade-me-in { 0% {opacity:0;} 80% {opacity:0;} 100% {opacity:1;} } <style>  
There are 2 sections to the code. 
In the first section you set the total length of the fade in, from invisible to fully visible. It is set to 3 seconds above but you can change it. 
In the second section you can define how long the buttons stay invisible before they start to fade in. In the example it is set so that the buttons remain invisible for 80% of the3s animation duration (2.4s invisible) and then fades in over the remaining 0.6s.
 
 

I would lose the graphic text on your banner - it crops off screen on many screen sizes. 

You can’t.  It makes the feature useless for anything other than brand new sites. 

Add the following to your custom css after any other code that may be there. 
.Header-nav--primary .Header-nav-inner { a.Header-nav-item[href="/"]:hover { color: pink !important } a.Header-nav-item[href="/about-jessica-1"]:hover { color: blue !important } a.Header-nav-item[href="/services-1"]:hover { color: green !important } a.Header-nav-item[href="/praise"]:hover { color: blue !important } a.Header-nav-item[href="/portfolio"]:hover { color: blue !important } a.Header-nav-item[href="/blog"]:hover { color: blue !important } a.Header-nav-item[href="/contact"]:hover { color: blue !important } } You should then change the color values to those you want.  NB. I've inserted named colours but you can get more shades using hex or rgb colours.

A few questions / points:
Are you using the Squarespace provided subdomain rather than your own domain name? This could have a negative SEO impact Your name only appears in the site name. That's not a lot for Google to go on when it's working out an authority score.  It seems like you're shying away from providing a lot of content, However, at present you have hardly any content and that's not a good thing.  Links from old sites have a tendency to stick around, especially if they are from large authority sites.  To Google most recent is less important than most relevant.  You should consider creating links from your social site profiles (LinkedIn, Twitter, etc) to your new site. Have you told Google that your site exists? Google can behave strangely for new sites. They may initially be indexed and then suddenly disappear, only to return weeks later once Google has decided on a ranking. Even then, there is no guarantee you will reach the top.   Consider setting up and maintaining a Google My Business profile

Thank you @colin.irwin! That worked perfectly.

This puts a grey 'glow' behind your navigation links. Put it in your custom css. 
nav#main-navigation { text-shadow: 0px 0px 3px #aaa; } The parameters (in order) are
Horizontal shadow offset - currently set to 0px so it sits behind the image) Vertical  shadow offset - currently set to 0px so it sits behind the image) Blur radius - set to 3px so that it casts an omnidirectional shadow. Reduce this value to make the shadow sharper.  Color - currently set to a mid gray