⚠ IMPORTANT CSS UPDATE ⚠ When logging into Squarespace, if you see the word "Website" at the top of your menu, you are using their new internal navigation! To edit the CSS of your Squarespace website, click on the word "Website" and scroll to the bottom of the list of pages. Here you'll see "Website Tools" - click on that option and select "Custom CSS" to open the CSS panel and add your code here. For more information, watch this tutorial: ruclips.net/video/euJqHXs_L1M/видео.html
That bit of code is great! The only change I made is background-size:300px 100px; to center a small image and allow for already existing navigation links on the right and left> THANKS!
Squarespace advert: 'designing a website has never been so easy'.... Me: Pulling my hair out ready to give up'... What size is the banner image meant to be? This very useful element of information is missing from this video!
🙋 Need some help? Visit insidethesquare.co/code-help to see my current support options. ❓ Have questions about what Squarespace can do? Let me know in the comments below! 🤔 Have a tutorial you want to see? Suggest one at insidethesquare.co/suggest-tutorial
Hey I am making a site and I am wondering if it is possible to customize the header colors and background. and maybe divide it in to parts. can you please make a video on this? Love your videos keep it up. ☺
Great tutorial, as always. Becca question, I put this on the page as an advanced code, but it changes the style of both the desk top and mobile versions. All I want is for the header on mobile to be different on all my pages. Am I missing a step?
Added the code to my new site and the image did not show up. I tried with transparency both on and off same result. I just started creating the site today and am on 7.1. Any suggestions?
This was so amazing, easy and helpful, thank you so much!! Now that my image is up, the links in my nav bar are in the way of the center of the image. Is there a way to move the links to the bottom of the nav bar? The best place would be below the button (which is on the far right)
Hello! Thanks so much for these bite size tutorials they're awesome 👌 Could you please do a tutorial of how make the cursor change when it hovers over an image? I've currently got a custom png of a shrimp and I know the css to make the shrimp cursor change to a flower cursor when it hovers over a link BUT how do I make the shrimp cursor change to another custom png cursor when it hovers over an image? Please help!
Hey David! You can install code on a specific page instead of your whole site using the advanced page menu or an on page code block. I have a tutorial on my blog that will walk you through it: insidethesquare.co/singlepage
Hey Rebecca! The mobile header has a different code name (selector) and I’d be happy to help you create the perfect code for it! Send me an email and I’ll help you set his up. support-at-insidethesquare.co
I used the transparent code that was added to an old video of yours then I found this one. I took that code out but my uploaded header is still transparent. Can you help me make this solid? Thank you!
Squarespace made some major changes to the header of 7.1 sites within the last month. Id recommend using the site editor for now. Check out this video for more info: ruclips.net/video/q_6ycyP3mJQ/видео.html
⚠ IMPORTANT CSS UPDATE ⚠ When logging into Squarespace, if you see the word "Website" at the top of your menu, you are using their new internal navigation!
To edit the CSS of your Squarespace website, click on the word "Website" and scroll to the bottom of the list of pages. Here you'll see "Website Tools" - click on that option and select "Custom CSS" to open the CSS panel and add your code here. For more information, watch this tutorial: ruclips.net/video/euJqHXs_L1M/видео.html
Exactly what I was searching the internet for! Thank you for being so clear and easy to follow.
You are so welcome - happy to help! ☺️
That bit of code is great! The only change I made is background-size:300px 100px; to center a small image and allow for already existing navigation links on the right and left> THANKS!
Nice work! 🙌
you are by far the person who has helped me the most throughout this process....so thank you
You are so welcome! Happy to help :)
You seriously have the best squarespace tutorials
Your comment just made my day - thank you so much for letting me know! 🥰
This was so incredibly clear and helpful. Thank you so much!
You're welcome Robby! Glad it was helpful :)
Amazing! Thank you so much for sharing this video - super helpful.
You are so welcome - happy to help!
Awesome and to the point video, thanks!
You're welcome - happy to help! 😁
Squarespace advert: 'designing a website has never been so easy'.... Me: Pulling my hair out ready to give up'... What size is the banner image meant to be? This very useful element of information is missing from this video!
Great! It even works in Germany! You made my day (again!)...❤
Thank you! I've learned so much from your training.
You are so welcome Donna - happy I could help! 😄
🙋 Need some help? Visit insidethesquare.co/code-help to see my current support options.
❓ Have questions about what Squarespace can do? Let me know in the comments below!
🤔 Have a tutorial you want to see? Suggest one at insidethesquare.co/suggest-tutorial
Super awesome and simple! Just what I was looking for! Thank you. :)
You're welcome! 😁
Great and simple tutorial!! Loved it!! Thanks a bunch!
Happy to help Jose! :)
Thank you so much! This is just what I needed.
This was super helpful. Is there a way to place a color overlay w/ opacity over the image?
Hey I am making a site and I am wondering if it is possible to customize the header colors and background. and maybe divide it in to parts. can you please make a video on this?
Love your videos keep it up. ☺
Great tutorial, as always. Becca question, I put this on the page as an advanced code, but it changes the style of both the desk top and mobile versions. All I want is for the header on mobile to be different on all my pages. Am I missing a step?
Check out this tutorial that will teach you how to create an alternate layout for mobile: ruclips.net/video/AQnwhitEqnI/видео.html
do you have a video tutorial on how to add parallax photos on the 7.1 ??
Thank you so much!!
Love your videos! Do you have any fixes on adding a mobile logo in 7.1???
Hi! Thank you so much for this. Is there a way to have a different background image for each page's header?
Great question! Feel free to submit a code help request here: insidethesquare.co/code-help
Added the code to my new site and the image did not show up. I tried with transparency both on and off same result. I just started creating the site today and am on 7.1. Any suggestions?
Hey Richard! Make sure your header isn’t set to transparent- that would overwrite this code.
for me, it did work with the dynamic style! thank you @InsideTheSquare!
This was so amazing, easy and helpful, thank you so much!! Now that my image is up, the links in my nav bar are in the way of the center of the image. Is there a way to move the links to the bottom of the nav bar? The best place would be below the button (which is on the far right)
Thanks for the video, very useful. I do have a question, is there a way to make the mobile site view the same way on a tablet? Using 7.1.
Do you have a fix for adjusting the size for mobile?
Hello! Thanks so much for these bite size tutorials they're awesome 👌
Could you please do a tutorial of how make the cursor change when it hovers over an image?
I've currently got a custom png of a shrimp and I know the css to make the shrimp cursor change to a flower cursor when it hovers over a link BUT how do I make the shrimp cursor change to another custom png cursor when it hovers over an image?
Please help!
Is there a way to do this on the background of the webpage body?
Will it show in mobile?
Can I add a carousel of images to the header using this?
Great question! Feel free to submit a code help request here: insidethesquare.co/code-help
This worked but the photo isn't the height I need it. It is being cut off half way up the background photo. How do I fix that?
You can try to increase the height of the header or choose a different ratio for your photo 👍👍
What if you want a different header image for different pages? Help?
Hey David! You can install code on a specific page instead of your whole site using the advanced page menu or an on page code block. I have a tutorial on my blog that will walk you through it: insidethesquare.co/singlepage
how do I reach you for personal customization?
Hey there! insidethesquare.co/contact
That didn't work for me do you have another video maybe things f=have changed in April 2021?
same here
Hi! Is there a way to tweak this to make the image sit above my header in Squarespace 7.1 instead of it being the background of my header?
I'm looking to do the same thing. Did you have any luck finding a solution for this?
@@denisee6341 I’m looking to do the same thing, did anyone ever find it?
Do you know how to make this code work for mobile? I've been trying and cant figure it out.
Hey Rebecca! The mobile header has a different code name (selector) and I’d be happy to help you create the perfect code for it! Send me an email and I’ll help you set his up. support-at-insidethesquare.co
the code isnt working :(
Hey Ajoulynn! Make sure you are on 7.1 and check out the troubleshooting help available on my site at insidethesquare.co/code-help
I used the transparent code that was added to an old video of yours then I found this one. I took that code out but my uploaded header is still transparent. Can you help me make this solid? Thank you!
Squarespace made some major changes to the header of 7.1 sites within the last month. Id recommend using the site editor for now. Check out this video for more info: ruclips.net/video/q_6ycyP3mJQ/видео.html