tuanphan

You have incorrect code. And you need to add it to About Page Header, Not Custom CSS <style> header#header img { content: url("https://static1.squarespace.com/static/616448878db4ba5c32bc74c2/t/63e101ed9e6cd3537d676158/1675690477827/Z_Mark_Logo_v3.png"); } </style>

Hi, Which page are you referring to? I don't see these text on homepage

With input, use this code instead div.form-block input:not([type="submit"]) { height: 40px !important; width: 375px !important; max-width: unset !important; min-width: unset !important; }

Hi, I don't know this You try find free code on Codepen, then we can try convert it to Code Block on Squarespace

Add this to Last Line in Settings > Developer Tools > Code Injection > Footer <script> $(function() { $('[data-section-id="6499dc0f9667031509523420"]').append('<a href="#" class="next-section"></a>'); $('a.next-section').on('click', function(e) { e.preventDefault(); $('html, body').animate({ scrollTop: $('[data-section-id="6499dc0f9667031509523420"]').next().offset().top}, 500, 'linear'); }); }); </script> <style> [data-section-id="6499dc0f9667031509523420"] a.next-section { padding-top: 70px; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); z-index: 2; display: inline-block; color: black; font : normal 400 20px/1 'Josefin Sans', sans-serif; letter-spacing: .1em; text-decoration: none; transition: opacity .3s; animation: fade_move_down 4s ease-in-out infinite; z-index: 999999999999999999999999999; padding: 10px; } [data-section-id="6499dc0f9667031509523420"] a.next-section:before { content: "\e009"; font-family: 'squarespace-ui-font'; font-size: 50px; } /*animated scroll arrow animation*/ @-webkit-keyframes fade_move_down { 0% { -webkit-transform:translate(0,-10px); opacity: 0; } 50% { opacity: 1; } 100% { -webkit-transform:translate(0,10px); opacity: 0; } } @-moz-keyframes fade_move_down { 0% { -moz-transform:translate(0,-10px); opacity: 0; } 50% { opacity: 1; } 100% { -moz-transform:translate(0,10px); opacity: 0; } } @keyframes fade_move_down { 0% { transform:translate(0,-10px); opacity: 0; } 50% { opacity: 1; } 100% { transform:translate(0,10px); opacity: 0; } } </style>

Hi, What is your site url? We can check problem easier

Try new code then save & reload the site /* Mobile Slideshow Gap */ @media screen and (max-width:767px) { .gallery-slideshow { margin: 0 !important; padding-top: 0 !important; } .fe-6490c89f2289d0d04a66ffeb { row-gap: 0 !important; } .gallery-slideshow { height: 30vh !important; } }

Try adding this to Design > Custom CSS to resize this text on mobile @media screen and (max-width:767px) { div#block-1f3126d3c4a9251981b6 h1 { font-size: 30px !important; } }

Use this code instead .fe-649348b948086c7508143792 * { transform: unset !important; transition: unset !important; transition-delay: unset !important; }

Keep above code + add this code under div.header-nav-item a { display: inline-block; }

What is your site url? We can check easier

First, add this to Code Injection > Header <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css" integrity="sha512-KfkfwYDsLkIlwQp6LFnl8zNdLGxu9YAA1QvwINks4PhcElQSvqcyVLLD9aMhXd13uQjoXtEKNosOWaZqXgel0g==" crossorigin="anonymous" referrerpolicy="no-referrer" /> Next, add a Markdown Block in Footer, enter these syntax (See this video) <i class="fa-sharp fa-solid fa-comment"></i> <a href="https://www.tidiochat.com/chat/3uhh5runhddyp8ibkzhuzk1srmzmi53i">Live chat</a> <i class="fa-regular fa-envelope"></i> <a href="mailto:hello@teachingideas4u.com">Email Us</a> <i class="fa-solid fa-lightbulb"></i> <a href="https://teachingideas4u.com/resource-request-form/">Teaching Resource Request</a> <i class="fa-solid fa-location-dot"></i> <a href="https://teachingideas4u.com/contact">Contact Info</a> If you need to reduce space between items, let me know, we can give the code If you need to change size, color, add animation effect, just choose these options

First, use this free tool to find button block id https://chrome.google.com/webstore/detail/squarespace-id-finder/igjamfnifnkmecjidfbdipieoaeghcff Next, add some code like this to Design > Custom CSS to customize button div#block-yui_3_17_2_1_1687881590000_41142 a { color: violet; background-color: #f1f; } div#block-yui_3_17_2_1_1687881590000_50912 a { color: #000; background-color: brown; border-color: red; border-width: 1px !important; }

Did you solve it? It looks fine to me https://trombone-caribou-px88.squarespace.com/?noredirect

Remove that code Add this to Last Line in Settings > Developer Tools > Code Injection > Footer <script> $(document).ready(function() { $('#sqs-member-access-page-root').parents('body').addClass('ss-deny'); }); </script> <style> body.ss-deny header#header { background-color: #f1f !important; } </style>

Hi, Like this popup?

Add to Settings > Developer Tools > Code Injection > Footer <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script> <script> $(function(){ $('.gallery-item img').each(function(){ $el = $(this); var style = $el.attr('style'); $el.attr('style',''); $el.parent().attr('style',style); }); //Moves the inline styles $(".gallery-item img").each(function(){ var title = this.alt; $('<div class="t-caption">'+ title +'</div>').insertAfter($(this).parent()); }); }); </script>

Add to Settings > Developer Tools > Code Injection > Footer <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script> <script> $(document).ready(function() { $('a.header-nav-folder-title[href="/portfolio-1"]').click(function() { var link = $(this).text(), href = "damienbabington.com/portfolio"; window.location.href=href; }); }); </script> I don't see black box. Can you check it again?

#1. Footer on Desktop or Mobile? #2. You used correct code, but it doesn't work on Mobile, because you use incorrect name in font face code Change tuan to 'DMSans-Regular' #3. I sent code in another post. You can check again

Use this CSS code /* Scroll block height mobile */ @media screen and (max-width:767px) { .fe-64a2a4fed52b0a6c56236623 { grid-template-rows: repeat(2,minmax(24px, auto)) !important; } }

Hi, What is your site url?

The site is private now. Can you setup an access password?

You mean border width? Use this code button.lightbox-handle { border-width: 1px !important; }

#1. Hover: Change nav item color or underline color? Same color or different color? #2. Mobile Use this code [data-folder="root"]>div div { background-image: none !important; } [data-folder="root"]>div a { display: inline-block; } [data-folder="root"]>div>div:nth-child(1)>a { border-bottom: 2px solid #e72F80; } [data-folder="root"]>div>div:nth-child(2)>a { border-bottom: 2px solid #9438b9; } [data-folder="root"]>div>div:nth-child(3)>a { border-bottom: 2px solid #00007d; } [data-folder="root"]>div>div:nth-child(4)>a { border-bottom: 2px solid #f7f8; } [data-folder="root"]>div>div:nth-child(5)>a { border-bottom: 2px solid #f6ce53; }

SS doesn't provide backup feature. You can use duplicate site feature instead, or use some cache web to get content.