Search the Community
Showing results for tags 'css'.
-
Hi, http://pelican-mayflower-36wy.squarespace.com site password: Lincoln22 I am trying to change the color of my text link on hover from red to blue for the individual page navigation: This is the code I'm using: p a { text-decoration: none!important; } p a:hover { font-weight: bold; color: #5fb6e4!important; } It does change to bold when I hover but it does not change to blue. Any recommendations? Thank you!!
-
I'm attempting to customize my site heading and finding some roadblocks. Essentially, I'd like the desktop and mobile site heading to be different. On desktop I'd like to have text that says the business's address and phone number. On mobile, I'd like a button that people can click on to call automatically. I've successfully added both these elements, but haven't been able to customize the view so they aren't competing on desktop view. I'm having an issue with disabling the button from displaying on desktop screens. Is there code I can use to hide the button on displaying on desktop, so that it only displays on mobile and doesn't obstruct the CSS text addition? Thanks! PASSWORD TO VIEW SITE: Maisy
-
I'm trying to add a border between sections on my site. Ideally this would be done with an SVG mask, but I settled for trying with a PNG image instead. This is where I'm at right now: [data-section-id="63deaf31f73bb003a7fce3df"] { overflow: visible; &:before { content: ''; width: 100%; height: 100%; background-image: url(https://static1.squarespace.com/static/63da9ac5c9844e3c54f8abd2/t/63deac4ef73bb003a7fc7b5e/1675537486671/Raven+Flower+Torn+Paper+Up.png); position: relative; background-repeat: no-repeat; background-position: top; top: -20px; margin-top: 1px; pointer-events: none!important; z-index: 101; } } Nothing I do seems to be selecting the section. Even if I just try to set the background color of the section, it's not working. The PNG linked above should be placed before the targeted section, therefore displaying on top of the banner image.
-
I try to use the following code to change the hover profile on my homepage, however every time I refresh the website, the original picture's id continuously changed. Anybody knows how to make this id fixed so that I can make this code work? Many thanks. Here's my website link https://www.shiqius.com/
-
Site URL: https://www.aditya-sinha.com/ Hi anyone, or @tuanphan hopefully, I am trying to add a code on top of the slideshow on my homepage in order for a scroll down indicator to show up. I tried it on a normal section and it worked, code used: <div class="scroll-down"></div> <style> .scroll-down { position: absolute; left: 50%; bottom: 10px; display: block; text-align: center; font-size: 100px; z-index: 100; text-decoration: none; text-shadow: 0; width: 30px; height: 30px; border-bottom: 4px solid white; border-right: 4px solid white; z-index: 9; left: 50%; -webkit-transform: translate(-50%, 0%) rotate(45deg); -moz-transform: translate(-50%, 0%) rotate(45deg); transform: translate(-50%, 0%) rotate(45deg); -webkit-animation: fade_move_down 4s ease-in-out infinite; -moz-animation: fade_move_down 4s ease-in-out infinite; animation: fade_move_down 4s ease-in-out infinite; } /*animated scroll arrow animation*/ @-webkit-keyframes fade_move_down { 0% { -webkit-transform:translate(0,-10px) rotate(45deg); opacity: 0; } 50% { opacity: 1; } 100% { -webkit-transform:translate(0,10px) rotate(45deg); opacity: 0; } } @-moz-keyframes fade_move_down { 0% { -moz-transform:translate(0,-10px) rotate(45deg); opacity: 0; } 50% { opacity: 1; } 100% { -moz-transform:translate(0,10px) rotate(45deg); opacity: 0; } } @keyframes fade_move_down { 0% { transform:translate(0,-10px) rotate(45deg); opacity: 0; } 50% { opacity: 1; } 100% { transform:translate(0,10px) rotate(45deg); opacity: 0; } } </style> But I cannot seem to Insert a code on the slideshow. Any way I can sort this out? Password for access: tester -
if you click on portfolio > portrait, you see the caption under the images on the grid:masonry, I would like the caption to show in the lightbox on a hover. Just like the current site:https://www.kentin.net/portret-portfolio -
On the category drop-down menu, is there any way to change the word “category” to something else?
-
I am having trouble adding font to sections where it is not necessarily allowed. Is there a code I can find for this? I have had to add font to the section above for it to be able to be a matching "header" on the section below. I cannot create a header in the same section in the section I want as I believe the section is a menu. If I add a header(title), it is small and I can't adjust the font. See photo.
-
The website is located here: https://purple-bison-f8wj.squarespace.com password: Qxgr69nGCW9 image attached. needcss for this pls.
-
on the iPad is also shown as a 1 column lay-out. I would like it to be a 3 column lay-out. On the iPad at the bottom of a case > it's now a 2 column summary, i would like to change it to a 3 column summary. Password- Qxgr69nGCW9
-
Hi there, I have made my fonts custom for majority of my store, but I can't seem to find the code to fix the "Size", "Quantity" and "Price" to be the same font. The custom font is labelled at Evgoria Any Clue? (Password is HELPPLZ)
-
Site URL: https://www.huntersgaragepa.com/ Hello, I would like if the padding on the top and bottom of the website header could be changed. I made a visual of what I'm looking for. The red dotted line is where i would like the top and bottom of the header to be. Any help would be great 🙂
-
Site URL: https://frontieras.squarespace.com/clean-technology-v2 Hi, https://frontieras.squarespace.com/clean-technology-v2 How can I embed a video within the accordion menu, I know how to add a link but I would like the actual video to pop up and not just the link. thanks! -
Site URL: http://www.buttercup-chartreuse-ptns.squarespace.com Hello! I am building a site using version 7.1. I finally worked through the desktop navigation menu and now I'm stuck with changing the style of the mobile menu. The spacing and alignment's looks very disorganized. I don't know why the font of third menu item Plans is so much bigger than the other two, and the back button is separated from the arrow into two lines. The first image is what it looks like right now, and the second one is how I want it to look. Having all the menu and submenu items align with the logo to the left, change the spacing and font size. And maybe change the font color of the submenu item when its clicked. It'd be greatly appreciated if anyone can help me with this css. The link to my site is here: buttercup-chartreuse-ptns.squarespace.com
-
Hello there, On my site: https://activestatedesigns.squarespace.com (password: SiteTest) I have my header with custom Mega Menus setup. Can I please get help with my CSS code to change the header div background to blue when anywhere on the div you hover over? Also how do I shift the mega menu down so it's not overlapping with my logo? I appreciate the help! Lorne
-
Hello. How do I change the item height for the mobile version of Jasper Jin. I'm happy with the desktop version but my images are cutting off on mobile. First image is how it looks now. Second image is how I would like it to look. Thanks in advance!
-
Hi, I added some custom code for the gradients on the website www.advancingagency.com and it looks fantastic for mac users in any browser. However, when pc users open it in any browsers, they see the attached image, not the video view I also attached. What could I do to make sure the site has the same view? 1729802831_ScreenRecording2023-02-03at5_35_48PM.mov
-
I added this code to design > custom CSS, from a recommendation on another post on how to add background images to all blog posts. /* Site background image */ body[class*="collection-type-blog"] { .section-background, .page-section { background: transparent !important; opacity: 80% } & { background-image: url(https://static1.squarespace.com/static/600a59513babe51392084795/t/63dd7683ab977736bbd31344/1675458179121/unsplash-image-WsEbnsnKbUE.jpg); background-size: 100% 100%; background-repeat: no-repeat; background-position: center center; background-color: transparent !important; }} If I don't add the line that specifies opacity, I don't see my background image, but when I do, even the pictures I add inside the post are now opaque. I just want my background image to be opaque, not the foreground images. Here is my website with some examples. Any one who can help, I'd greatly appreciate it. Thank you! https://www.electricwellness.com/science/emf-mechanisms-of-action -
Site URL: https://risedigital.tech Hey Squarespacers! I installed a Google Review badge on my site, which presents a problem with the nav button in the mobile menu (7.1). Not sure if the best approach is to try and remove the badge when mobile menu opens, or move the button up so it's not covered by the badge (I think I prefer the latter). Any bright ideas how to fix this with CSS?
-
Hello Everyone, Please help me with CSS code needed to redesign Squarespace's Product Block. This Product Block was added to the page called LOADED under the SHOP navigation folder in the header. Squarespace's standard settings for adjusting the style/design of a Product Block are extremely limited. Website link: https://carrot-disc-nsp7.squarespace.com/loaded Password: peak Please see attached JPG file for what I would like to accomplish. GOALS: STEP #1 Increase Width of Add to Cart Button STEP #2 Change text on button to read: $42 | Add to Cart STEP #3 Delete the Quantity text & box What is the CSS code is need to accomplish these goals? Thanks so much in advance! Freed
-
Hi, How do you adjust spacing / padding between social icons in the footer? Thank you. -
CSS Beginner! I'm trying to customize my embedded Mailchimp form. I was able to change the primary background color to match the website but there is a white strip underneath each input field. Very grateful for any CSS recommendations to solve!
-
Is there a way to stop the repeat or loop of a slideshow in Slideshow Full carousels? I want the slides to play and then not replay. -
I am not sure if this website uses Squarespace, but I am very interested in learning how they create their cover page / landing page effect. I would love to create this effect with: 1. Landing on a color background with logo fading in 2. Color background with logo fades to an image 3. Image faded to the home page of the website (I do not care for the scrolling navigation feature here) Thank you for any insight or tools or CSS you may be able to provide! https://www.lilsemckenna.com/
-
Hey guys, on my site i'm trying to change the navigational links on mobile to look like the enquire button at the top of the burger menu via CSS. Any help is greatly appreciated! site is: https://harpsichord-harmonica-ga8f.squarespace.com/ password: 123
.thumb.jpg.25ab89fb04d772a939a2b8947184215e.jpg)
