humxahafeex

Hi Please do share URL of website so we can have a look and yes it's possible with custom code.

Please set password to website it's currently PRIVATE.

Hi , Add following code in Website> Website Tools> Custom CSS

.header-actions-action--social{
    right: unset !important;
}

If it works do mark it as solved.

It seems you already fixed it. As we don't see any Images/text overlapping.

Hi , your script seems fine , Will you please let us know which Squarespace Subscription Plan you are using as to use code injection you need at least Business Plan.

Hi  , there is not a straight way to do it , but you can do it making a blog page then add some intro of project on blog and add redirect of project page on blog. 

Then you can use summary block to show it on different pages 🙂

Hi Yes it's possible , please do share link so we can provide you a code for it. 

Hi It's super easy to get it done, Do let me know if you have a good understanding of css if so I can try to explain , also do share website link where you want to achieve it.

Hi Please do share website link so we can help you out 🙂 

Hi , if you are  talking about slowing down speed like we do in youtube videos then yes we can do it natively within the squarespace by using custom code. Please do share your website link so we can help you out with it. 

Please share your website link so we can have a look and help you out with it.

Hi You can't do it with saquaresapce's own newsletter form directly  but you can use any third party service or your custom form with API call's implemented. Or as you mentioned Zapier can be your best friend to achieve it. 

Hi Add the following Code to Website> Website Tools> Custom Css 

.form-wrapper input[type=submit] {
    background-color: #e4070b !important;
    color:#fff !important;
}

If it solved the issues do mark it as solved.

Hi , Please try adding this Custom Css:

#[data-section-id="658f7d683b38c97cdaa50d03"]{
height:80vh !important;
}

Do let us know if it works , if it does, please mark it as solved 🙂 

Hi It's simple , Go to Website> Under Utilities go to Website Tools> Custom CSS & add the following code:

.gallery-caption-content{
font-weight:800 !important;
}

where "800" is written you can change as per your need , from 100 to 900 , 100 being less bold and 900 being full bold. Please do mark it solved if it works 🙂

On 6/20/2023 at 12:27 PM, tuanphan said:

Add this code to Design > Custom CSS. You can replace whatsapp icon in the code with new url (because we can't use code to change its color, so if you need to change to blue, you can send new icon, I will give new code)

/* Whatsapp */
header#header [href*="whatsapp"] {
    background-image: url(https://i.ibb.co/xKZkYDB/whatsapp-icon.png);
    background-position: center center;
    background-size: contain;
    background-repeat: no-repeat;
}
header#header [href*="whatsapp"] svg {
    display: none;
}

 

Great Solution , If someone needs to get same thing done in footer  you can use this code, just a extension to above one.

footer#footer-sections [href*="wa.me"] {
    background-image: url(https://i.ibb.co/xKZkYDB/whatsapp-icon.png) !important;
    background-position: center center;
    background-size: contain;
    background-repeat: no-repeat;
}
footer#footer-sections [href*="wa.me"] svg {
    display: none;
}

"Whatsapp" is replaced by "wa.me" as per new whatsapp link policy for more check this link How to use click to chat | WhatsApp Help Center

On 3/25/2024 at 11:21 PM, JasonArend said:

Can this be used to show the popup once an hour?

Hi yes you can for that you need to customize it.

Just now, tunglmyrkvi said:

Thank you, but that only changed the look of the active link, the secondary items ("Contact" and "Read me") still look the same.

Oh yeah , sorry just delete that code and replace it with this one:  I have marked for active and inactive links so it would be easy for you to use.

/*For active Links*/
#mobileNav li.active-link a {
    color: grey !important;
    font-size:16px;
}

/*For inactive Links*/
#mobileNav li a {
    color: grey !important;
    font-size:16px;
}

#mobileNav li.active-link a {
    color: grey !important;
    font-size:16px;
}

Please do go the Design >Custom CSS and paste the above code there , to change the color simply replace grey color with the color you want , for font size change the 16 with some big or small value depending upon size you want.

Please let me know if it helps , it it fixes the problem , don't forget to mark it as solved :) 

Just now, tunglmyrkvi said:

I'm no CSS expert. I managed to add more space between the primary and secondary items, but I don't know the right code to change the size and colour of "Contact" and "Read me" for mobile.

No problem at all we are here to help you out , Please wait so we can send you a CSS code to put in the correct place to make things right for mobile and desktop :) 

2 minutes ago, tunglmyrkvi said:

I want the secondary navigation to be visually distinct from the primary navigation. On desktop view, I can change the font, font size and colour for each of them, but on mobile view all navigation items look the same. So I'm looking for a way to change the look of the secondary navigation items (smaller font, different colour) on mobile view.

Hi , Did you tried to use CSS for mobile specifically ? 

Hi , It would be super easy to do it by using JavaScript. Please share the website links so we can have a look.

18 minutes ago, oliviamill said:

Hi! I'm trying to edit the size and color of the days of the week on a calendar block. Can't find the CSS anywhere. Any help appreciated!

Hi Please share the URL of your website calendar page so we can have a look and help you out with this.

On 5/24/2023 at 2:13 AM, Sepia said:

I tried this, it did not seem to work. 😞

Hi Sepia, Please make sure you are pasting the code in the individual page header setting , you can access this setting by hovering on page as you hover gear icon appears , click on that gear icon , pop up will open up , on that pop up click on Advance , then paste the code , it should work , if not let us know we are here to help you out.

Hi Please try to put the following code in Design> Custom Css 

@media screen and (max-width: 640px) { 
    #block-627f0621357b994502063985>div>h3{
        font-size:1.5em;
    }
}

Hope it helps , If it works , Don't forget to mark it as Solved.