jaksdigital

Ok so I think I figured out a way. I'm currently using Squarespace 7.1.

So I went into my edit setting on the map block.
Then I made sure "controls" are turned off in the design tab.
I hovered my mouse over the map and using my middle scroll I zoomed in.
Once I found the distance I wanted. I saved my page and it stay at that zoom level when i checked my page.

You can turn your controls back on if needed.

Let me know if that works for you!
 

Hi Ziggy,
I removed 'img' from the code you sent over and it works perfectly now!
So:
.sqs-gallery-block-grid .slide .margin-wrapper a.image-slide-anchor[href] { border-radius: 20px; } Thanks again!
 

@Jprood
I think I have the answer to your issues.
First remove (make a copy) or comment out any code that you added in previous attempts.
Add the following to Design > Custom CSS.
@media ( hover: none ) {   .cursor {        display: none !important;          }   } * {   cursor: none;      } .cursor {   --size: 10px;      height: var( --size );   width: var( --size );      border-radius: 50%;   pointer-events: none;   position: absolute;   transform: translate( -50%, -50% );   z-index: 99999999999;      } .cursor.cursor-dot {   background: #ffffff; /* This defines the color of the cursor */   mix-blend-mode: difference; /* Delete this line if you dont want the circle to invert */   transition: width 0.6s, height 0.6s, background-color 0.6s;   transition-timing-function: ease-out;      } .cursor-dot.active {   --size: 50px;      background-color: #ffffff;      } Add the following to Settings > Advanced > Code Injection > HEADER. 
<script src="//ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> Add the following to Settings > Advanced > Code Injection > FOOTER. 
 
<script>   $( ( ) => {        $( 'body' ).prepend ( '<div class="cursor cursor-dot" style="left: 0px; top: 0px;">' );        $( window ).mousemove ( function ( e ) {            $( '.cursor' ).css ( {                left: e.pageX,         top: e.pageY                  } );                } );            $( window ).mousemove ( function ( e ) {            $( 'a' ).on ( 'mouseenter', function ( ) {                  $( '.cursor' ).addClass ( 'active' );                  } );                } );            $( window ).mousemove ( function ( e ) {            $( 'a' ).on ( 'mouseleave', function ( ) {                $( '.cursor' ).removeClass ( 'active' );                  } );                } );            } );        </script> You will need to change the colors to match your color scheme.
Let us know how it goes.

This particular bit of code didn't work for me (I'm in the Nolan template) but I was able to make this work:

<style>
  a[href="/portfolio-name/page-url"] { visibility: hidden; }
</style>

Please see the following.
The main portion of the referenced code only needs to be installed once.

TypeWriter Multiple.mp4    

If you want to apply to 2 Code Blocks on same page, & paste same code, they will conflict together
With second Code Block, use this new code
<div class="container"> <h1> typewriter01 | <!-- The words that we want to have typerwriter effect --> <span class="txt-type2" data-wait="3000" data-words='["consultancy", "food", "creative tech", "ranj"]'></span> </h1> </div> <style> /* CSS RESET */ /* ALIGN CONTENT */ .container { display: flex; /* Remove horizontal 'justify-content' center if you want the base text not to move */ justify-content: center; align-items: center; } /* ADD CURSOR */ .txt-type2 > .txt { border-right: 0.08rem solid #fff; padding-right: 2px; /* Animating the cursor */ animation: blink 0.6s infinite; } /* ANIMATION */ @keyframes blink { 0% { border-right: 0.08rem solid rgba(255, 255, 255, 1); } 100% { border-right: 0.08rem solid rgba(255, 255, 255, 0.2); } } </style> <script> class TypeWriter2 { constructor(txtElement, words, wait = 3000) { this.txtElement = txtElement; this.words = words; this.txt = ""; this.wordIndex = 0; this.wait = parseInt(wait, 10); this.type(); this.isDeleting = false; } type() { // Current index of word const current = this.wordIndex % this.words.length; // Get full text of current word const fullTxt = this.words[current]; // Check if deleting if (this.isDeleting) { // Remove characters this.txt = fullTxt.substring(0, this.txt.length - 1); } else { // Add charaters this.txt = fullTxt.substring(0, this.txt.length + 1); } // Insert txt into element this.txtElement.innerHTML = `<span class="txt">${this.txt}</span>`; // Initial Type Speed let typeSpeed = 50; if (this.isDeleting) { // Increase speed by half when deleting typeSpeed /= 2; } // If word is complete if (!this.isDeleting && this.txt === fullTxt) { // Make pause at end typeSpeed = this.wait; // Set delete to true this.isDeleting = true; } else if (this.isDeleting && this.txt === "") { this.isDeleting = false; // Move to next word this.wordIndex++; // Pause before start typing typeSpeed = 500; } setTimeout(() => this.type(), typeSpeed); } } // Init On DOM Load document.addEventListener("DOMContentLoaded", init); // Init App function init() { const txtElement = document.querySelector(".txt-type2"); const words = JSON.parse(txtElement.getAttribute("data-words")); const wait = txtElement.getAttribute("data-wait"); // Init TypeWriter new TypeWriter2(txtElement, words, wait); } </script> (I adjusted some IDs)
If it still doesn't work, please send code in both Code Blocks, I will try test it again on my demo site

You can't edit HTML unless you use Code Block
You can use CSS visibility: hidden to hide current text and CSS :after or :before to insert next text

Thanks very much, yes that did the trick 🙂
 
For others that stumble here, the solution for this specific text replacement case was quite simple:
.sqs-lightbox-meta-trigger {
  visibility: hidden;
}
.sqs-lightbox-meta-trigger:after {
  content:'ⓘ';
  visibility: visible;
}

You can try adding to Home > Design > Custom Css
.user-items-list-item-container .list-item-content__title { font-family: MP-Display; } Let me know how it works on your site
Support me by pressing 👍 if this useful for you

Hover on Blog page name > Click Gear Icon > click "SEO" > Edit SEO Title

@tuanphan this worked perfectly for me thank you!

you may need javascript to do this, add this to Advance-Code Injection
<script> document.addEventListener('DOMContentLoaded', function() { function insertAfter(referenceNode, newNode) { referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling); } insertAfter(document.querySelector(".header-actions-action--cta"), document.querySelector(".header-actions-action--social")); }); </script>  

Looks like they use a background image for the underlines instead of text decoration or borders, so this worked for me in the CSS Editor:
a {background-image:none !important;}  

Thanks! Worked for me. I was going crazy. That is just a stupid CSS decision.