Search the Community
Showing results for tags 'css'.
-
I am using the Bedford template and I would like to change the "caption overlay on hover" feature so that the overlay covers the whole image, the whole image is clickable, and I can customize the colors of text and the overlay itself. The default "caption overlay on hover" style is a small transparent gray bar that overlays the very bottom of the image. I searched everywhere for a cohesive snippet of custom CSS code, and while there are several partial answers, I have yet to see something that covers all of my wish list. I'll keep tinkering and report back! -
CSS Media Query not displaying correctly on mobile device
Spence500 posted a question in Coding and Customization
Site URL: https://lmtecdigitalsolutions.com Hey there, I'm having issues with a Custom CSS media query for a mobile breakpoint. I've coded it all correctly (at least I think), and I'm seeing what I edited correctly in the mobile view in 7.1 on my desktop, but as soon as I go check it out on my actual mobile device that I formatted it for, it isn't displaying correctly. My viewport on my Iphone 11 is 414 x 896, I set my max-width to 640px. I will attach the referenced screen shots to what I'm referring too. You'll see the correct spacing of the text "Supporting our clients every step of -
Space between my social icons and inquire button in my header
LField posted a question in Coding and Customization
See below, I want there to be a space or spacer between my social media and inquire button. Squarespace 7.1 Beaumont Starter template. Note that the logo is not a part of header I used custom CSS from a user on here to hide logo on header bar. -
Site URL: https://recorder-jaguar-6lxy.squarespace.com/ I am trying to change the font (a custom font) of the CTA in the header of the site and all of the form buttons. It's the only thing I can't manage to change. PASSWORD: ComeandStay -
Wondering if this is possible in Squarespace: http://jsfiddle.net/edelman/QDb2c/ Unsure how to target specific words. I'm using the Marta template. Thanks!
-
Apply 2 columns in mobile to specific summary
bbarinaga posted a question in Coding and Customization
Site URL: https://www.bbarinaga.com/portadasebooks https://www.bbarinaga.com/portadasebooks password: 1234 Hello, I am on 7.0 and am attempting to simply make one individual summary list switch to 2 columns on mobile. I have used the following code but the change is applied to all summaries and I only need it for this one: https://www.bbarinaga.com/portadasebooks @media screen and (max-width:640px) { .sqs-block-summary-v2 .summary-item.positioned { width: 50% !important; position: static; } .sqs-block-summary-v2 .summary-ite -
Site URL: http://kaytdefever.com/design I'm updating my design portfolio web site and I'm having some problems whipping my quote boxes into shape. I got started with some code I found online, and then went about customizing it. But I'm not super adept at code and I need help. Here's what I have yet to figure out: I want the gray quote box to line up and go the full width of the gallery image below it. When I put 100% in my code, it went wider than the images...?! How do I change the type color? Ideally, I'd like the source (person saying the quote) to flush
-
Site URL: https://www.dreamdescriptions.com/ Hello! I am trying to make my masonry grid ignore captions for spacing the images so that the space between images remain the same regardless of there being a caption to the image or not. The two pictures I have attached show the current irregular spacing that comes when I caption an image and the second picture shows the regular spacing that I hope to achieve. I also want to move the text closer to the image that it is a caption for. I hope someone can help! https://www.dreamdescriptions.com/ password: temp6789
-
Site URL: https://beige-guitar-h4be.squarespace.com/ I am using this CSS: .sqs-gallery-block-slideshow .sqs-gallery-controls .next, .sqs-gallery-block-slideshow .sqs-gallery-controls .previous { background: none; } .sqs-gallery-block-slideshow .sqs-gallery-controls .next::before, .sqs-gallery-block-slideshow .sqs-gallery-controls .previous::before { background: white; color: black; font-size: 1.1em; padding: 13px; border-radius: 50%; but nothing is changing on the arrows. I am unsure what is happening but any edits to my css are not popula
-
Site URL: https://oceanoculus.com Hello I'd love to shrink the font size of the metadata that appears on my blog posts. How could I do this? An example of a blog post on my site showing the metadata (author, categories) is https://www.oceanoculus.com/news-from-the-sea/sea-stories-song-for-the-turtles-in-the-gulf-linda-hogan. Thanks in advance!
-
Site URL: http://a-b-c.org Hi there, On our non-profit's website (www.a-b-c.org), we wanted "donate" and "ABC Store" to appear in blue bubbles on the navigation bar to be more attention-grabbing. I used a custom CSS code I found online #mainNavWrapper .folder-toggle[data-href="/donate-1"] { background: #11a2e3; color: #ffffff; padding: 15px !important; border-radius: 30px; } This works when I have the browser on full size, but it doesn't work when the navigation menu is collapsed under a hamburger/ on mobile view. I'm attaching a screenshot that shows the donate folder d -
Site URL: https://fleapitofficial.com/ Hi, Was just wondering if anyone knows of a plugin or css where i can change my blog list page to look like individual cards. Id like it to have the style of the 7.0 Tudor template but would like to keep it in 7.1. I have a side by side blog layout and would like it to have the 3D style as pictured just in 7.1 instead of 7.0. Thanks.
-
Hi, I am building a website on 7.1. and I have realised that on a Gallery section you cannot set the width (whereas for the normal sections you have S, M, L and custom width). Does anyone have a code for me to reduce the width of the masonery gallery? Or is there an option somewhere that I have not seen yet?
-
I would like to make one of my navigation menu items/titles to look like a button/be highlighted compared to the rest. I am using the om-template. It looks like the attached photo and I would like the DONATE to be in a darker font with a white rectangular background behind it. I would like it to look similarly to the other attached photo where the CONTACT looks like a button. Thank you! -
Timeline from codepen issues in code block
monstermamushka posted a question in Coding and Customization
Hello, I've scrolled through the questions in this community and tried various suggestions and I still end up with an issue around embedding a timeline using either CSS or HTML within a code block. I'm not sure if it's because it's within a blog post or what, but even when the code actually does work (and I mean does straight up show the actual code in the block with all </> and all) the display is completely off. It's not responsive, the format is wrong, the color is wrong, the only thing right, are the actual words. I have a personal account so I know there's limitations, but I do -
Site URL: https://pentagon-dachshund-mefm.squarespace.com/gallery/peaks-pljtx-4fljw Howdy Folks! I like how large my images are in my various projects, but I don't like the spacing between images. I would like people to get a hint that there's more images as you scroll down. Can anyone let me know how to reduce this padding or spacing via custom css? Thanks! -Shaun -
Site URL: https://wisteria-wolf-bl47.squarespace.com/ Password: Test123 I have separate sub navigations for each project page and am looking to make them sticky but can't figure out how. Ideally I would like to have both the header and sub nav sticky, but it's okay if just sub nav is. Any suggestions on how to do this?
- 7 replies
-
- 1
-
-
- navigation
- css
- (and 1 more)
-
Site URL: https://ievaviphoto.com/ Hi, all! Been searching for an answer to this question for a few weeks now and hoping to finally find one here 🙂 Does anyone know how to hide the current post from the summary block? Maybe @bangank36 @tuanphan would have some insight to this? To give you a concrete example, I would like to hide Nyhavn Intimate Wedding w/ C + C from the summary block and, instead, display the other post with the relevant category / tag. The link: https://ievaviphoto.com/stories/nyhavn-alternative-wedding *P.S. I only found a way to hide a current post but then
-
I'm looking to add the javascript & SVG effects shown in the following tutorials to my Squarespace 7.1 portfolio site: 1. "Making Stagger Reveal Animations for Text": https://tympanus.net/codrops/2020/06/17/making-stagger-reveal-animations-for-text 2. "Ideas for Distorted Link Effects on Menus": https://tympanus.net/Development/DistortedMenuLinkEffects/index5.html 3. "Animated Custom Cursor Effects": https://tympanus.net/Development/AnimatedCustomCursor/index3.html 4. "Text Distortion Effects using Blotter.js": https://tympanus.net/Development/TextDistortionEffects/index.ht -
Setting up snap-scrolling to homepage sections
lynneej posted a question in Coding and Customization
Site URL: https://www.strongcommunitiesfund.org Hello! I have very little coding knowledge, but my client has asked that I set up snap-scrolling for the homepage sections similar to the homepage of this site: https://forterra.org/ My theme doesn't have indexes, but I understand there is a way to set this up with CSS. Hoping someone can help me out with the code needed/ specific instructions for setting it up so that I can snap scroll to specific sections of the page. Site password is: December2020 Thanks! -
Site URL: https://sheep-smilodon-x2a6.squarespace.com I have 2 radio buttons on a Lightbox form and the text is spaced way too far to the right from the radio buttons. Can someone help me with a fix? You can see on the screenshot what's going on. -
Single-line newsletter block with reCAPTCHA checkbox
boldhumansco posted a question in Coding and Customization
Site URL: https://boldhumansco.com/ Hi all! I have a newsletter block at my footer and have added a reCAPTCHA checkbox to it. I'd like it to all be in one line rather than being bulky and the reCAPTCHA checkbox being randomly placed. Pretty much, I'd just like everything, including the reCAPTCHA checkbox to be in a single line. I only have the form title ("Subscribe to our newsletter"), an email textfield/input, submit button (Join Us), and a reCAPTCHA checkbox. If you can provide code that would make it all one line, it would be much appreciated! Thanks in advance! If possible, -
Header Nav Line Under Folders when Active
viccismarshall posted a question in Coding and Customization
Site URL: https://fulcrum-diligence.squarespace.com/ I'm sure this is super simple, but would be very grateful if someone could let me know where I am going wrong please!! I have included this CSS to have both change of colour on hover and a line underneath each nav item when on that page (active). It works for normal page items, but doesn't appear underneath the folder nav items when any of the items under the folders are active. This is what I have: .Header-nav-item:hover { color: #00b5e2 !important; } .header-nav-folder-item--active { border-bottom: 2px -
Site URL: https://nonagon-dahlia-n98k.squarespace.com Hey experts I've had a go at trying to solve this but with no luck. I have a section on the homepage of my site where I have text to the left and an image to the right. They both currently align at the top (Squarepace default I guess) see picture. But I'd really like them to align through the middle vertically. Like the second picture. I know it's only a minimal tweak but it looks so much neater. Please help, I know there's probably some simple CSS and if someone could help with this section, I could probably figure out how to c
-
Site URL: https://ferret-drum-ndgp.squarespace.com/services Password: erika I have an index page where each index section is a different color. It works great when I am viewing them all together, but when I try to view just one part of the index using it's unique slug it the background color disappears. Example: https://ferret-drum-ndgp.squarespace.com/services looks great but https://ferret-drum-ndgp.squarespace.com/pe-class doesn't. I've tried to code in a bunch of different ways but here's where I'm at. I've tried all of the following and none of them worked. #pe-clas
