Search the Community
Showing results for tags 'transparency'.
Found 34 results
-
Site URL: https://bulldog-perch-zdly.squarespace.com Hi! I'm trying to customize my dropdown menu in the 7.1 template Matsuya, and have combined various bits of coding that I found online - but am getting syntax error messages in the Custom CSS. What I would like is for my site header dropdown menus to: have all folder items adhere to a LEFT alignment on the dropdown menu (I think the default is right when you have a right header item alignment) have a colour selection on hovering on a menu item be half transparent, at least in terms of the menu background I've included the code bits here. I suspect that some of the code is specific, while some parts of it is not specific enough, and that's the reason it's not working. Supergrateful for any help on this! /Vic Password: 2020Go /* Nav item color */ .header-nav-item a { color: #000000 !important; } /* Nav item hover color */ .header-nav-item a:hover { color: #336699 !important; } /* Nav item active color */ .header-nav-item--active a { color: #336699 !important; } //-----dropdown menu alignment----- .header-nav-folder-item { text-align: left !important; } a.header-nav-folder-title:hover + div, .header-nav-folder-content { text-align: center !important; position: absolute; left: 50% !important; right: unset !important; -webkit-transform: translatex(-50%); -o-transform: translatex(-50%); transform: translatex(-50%); background: rgba(76, 175, 80, 0.6); !important; } //-----Dropdown menu styling----- ..header-nav .header-nav.item— folder .header-nav-folder-content { padding: 0; .header-nav-folder-item { padding : .5em 1em: } .header-nav-folder-item:hover { background: 000; a (color: #fff;) }} -
Fixed AND transparent header/menu. How?? (SS 7.1)
peterbjerg posted a question in Coding and Customization
Site URL: https://amal-testsite.squarespace.com Hi all In Squarespace 7.1, there is already build in options to choice both “fixed position” and “transparent” in EDIT SITE HEADER. BUT, it doesn’t work. When header is fixed, then transparency doesn’t work. Instead Is has default or choosen background color. so how do I set or code to get transparent header/navigation menu when it’s also fixed? test site: https://amal-testsite.squarespace.com password is: abcabc -
Site URL: https://www.theduophotography.com Hello, Ive being trying to fix the transparency of my header but i cant find any solution. I want to add in the first section a gallery but then the headers transparency doesnt work. Im not so familiar with coding but ive tried some solutions ive read in the forum here but nothing works. Does anyone know what i can do? Thank you!
-
I'm trying to use image stacks with PNGs, but Squarespace is adding a faint color behind them. I tried testing all of the different image blocks and inline was the only one that didn't put a color behind the images (but it squished them). What is the issue here? Just a bug?
-
Add a transparent gradient overlay to individual sections?
skabir91 posted a question in Coding and Customization
Site URL: https://shuvamkabir.net I'm attempting to add a white gradient above my background images. My first thought is to add an additional element that serves as an intermediate layer. I've tried the following, which I copied from here : [data-section-id="xxxxxxxxxxxxxxx"]{ .section-background::after{ content:""; display:block; position:relative; width:100%; height:100%; /* in hsla color format (below), the last number is between 0 and 1 and changes the opacity */ background-color:hsla(100,20,50,.5) !important; } } And then replace the background-color() with a linear-gradient() instruction. However, the above code doesn't seem to work. I should add that I am also using javascript to create a parallax effect, which I am hoping isn't conflicting. Can anyone walk me through adding an additional element behind my text/image blocks and above my background to which I can add a gradient that shifts from white-to-transparent-to-white? Alternatively, can anyone show me how to make an image block flush with with the top of a section (so I can just stick a small PNG at the top and bottom of my sections and call it good)? -
Site URL: https://smilodon-tulip-mbea.squarespace.com/synopsis-1 Hi, I have background image I would like to run through the footer, however the footer appears as an opaque color. How can I make the footer transparent. I tried inserting this code into the pages advanced settings, but no cannoli. <head footer#footer { display: none; } } </head> And also the header toggles between opaque and transparent, I would like to make it exclusively transparent. Any and all replies much appreciated. thx
-
Site URL: https://kangaroo-polygon-sn6z.squarespace.com/config Hello, I'm trying to do some customization to my pagination. I'd ideally like it to be transparent instead of the automated white block that gets dropped behind it. Additionally, I'd like the right side of the pagination to be white text instead of black text. Lastly, I'd love for the pagination text to scale down for mobile. If anyone can help with this, I'd appreciate it! Thanks!
-
Site URL: https://tarpon-lavender-jbyy.squarespace.com/ Password to the site is: TEMP I'm having problems making the header opacity appear semi-transparent. The options when editing the header are simply solid colour, or fully transparent. What I'm trying to achieve is a semi-transparent header, that has an opacity of 50%. The site is on the Eldridge template, so Squarespace 7.1
-
Site URL: http://www.matteosmozzarella.com When hovering over a product on my shop page, the product dissapears. I suspect it has something to do with the transparency %, but I don't know how to change it. I already tried the default reset, but the problem remains.
-
Site URL: https://grape-plum-jrlb.squarespace.com I'm working with a difficult (busy) logo. I'm trying to find code for a transparent gradient behind the header. I've mocked it up in Illustrator to show what I'm looking for (attached). Has anyone been successful using custom code for this? I'm using the Grape Plum template. Site password is: PreviewER
-
Site URL: https://tuna-raccoon-f8cp.squarespace.com I am looking to make several pages in the main nav with transparent headers. I located the code to make the home page transparent, but how can you code other pages? Specifically I want "solutions," "resources," "partners," "about" to have the transparent headers (and potentially other pages) all so that I can keep the solid blue header on product pages, blog pages and staff/team pages (which is many pages so makes more sense to custom code the transparent headers since there are only 4-5 of them). Thanks for any help!
-
How can I make the site header solid on blog post only?
Mountainmint posted a question in Coding and Customization
Hello, I'm building a site using Bedford. I set the site header to transparent. And I removed the header image on blog pages as I didn't like the design. I used this code for that: /* don't show thumbnail as banner image behind blog post title (hard to read) */ .collection-type-blog .banner-thumbnail-wrapper {display: none !important;} .collection-type-blog .entry-title {display: block !important;} But now I can't see the site header or navigation on a blog post page b/c it's white and the background is transparent. Is there any way to set the background color for the site header for blog posts only (including all future posts)? Or to change the color of the logo and navigation for blog posts only? Thanks! -
Hi All- I'm working to make my image title backgrounds transparent so that I can apply a section background without having a weird box: I'm using an Image Card block and found out how to make the image portion of the block and content section have a transparent background, but cannot figure out how to make the Card title have a transparent background. Happy to provide any additional information. Thank you in advance. Greg
-
Hi All- My images contain transparent backgrounds and I'd like for the background to actually remain transparent on the site. I took a quick screen shot below. The gray area of the image shouldn't be there. It is actually a transparent background. Any way to persist the transparency of the actual image to the image card? Happy to throw some css in there, but not exactly sure what to do. Thanks, Greg
-
Site URL: https://parkerisaacadipress.squarespace.com Hi guys, I'm working on a site (https://parkerisaacadipress.squarespace.com) built on the Stanton Template. I'd like to remove the transparency overlay being applied to the cover page image. I've searched the forums, and found an answer to this same question for someone using the Naomi template. They ended up using custom CSS code that fixed the issue: .homepage .index-image-overlay { background: rgba(28,13,10,0); } However, when I tried this in my template it didn't work. I came across two issues: 1) it didn't seem to "take" - once I pasted the code there wasn't an "apply" or "save" button so nothing changed. 2) there's a "note" explaining "custom CSS does not apply to cover pages - so I imagine since this image overlay exists on the "home" page, the code won't take... Can anyone help to figure this out? Thank you so much in advance. Regards, Kristy
-
Site URL: https://www.assetoutfitters.com/help I cant figure out how to make page content div transparent. Tried setting site style of page content to transparent, also page level css of multiple different div ids/classes, like .index-section-wrapper page-content{background-color:transparent !important}, any ideas?
-
Site URL: https://www.newsights.co/ site password: ns@99200 The background of the text on the poster images became black. It wasn't like that yesterday. I tried doing: h2 { background: none !important; } but then it looks like this:
-
Site URL: https://nectarine-circle-ngf5.squarespace.com/ https://nectarine-circle-ngf5.squarespace.com/ password: apod Here is the site URL, the problem i am facing at the moment is quite an odd one... So first of all Using CSS I changed the header to have an image behind it. .Header--top { display: none; background-image: url("https://static1.squarespace.com/static/5e28e3821bc1146fbddc88f8/t/5e36482d21662377966f68f8/1580615725729/Base.png"); background-size: 100% 100%; } What I am trying to do is make it so that the image goes behind the navigation, however when setting the header z-index to higher values nothing happens. Behind the navigation there is a white background and I am finding out that is the the background color of the whole page. I am really hitting a lot of walls here if anyone could help. -
How to create a transparent header bar on mobile ?
wearesilk posted a question in Coding and Customization
Hey, can anyone of you guys helped me with a transparent mobile bar? I just want to have the black bar transparent: Iam working with a Brine Template ( Cocoa ) Thank you so much 🙂 -
Does anybody know how to turn the drop down menu from te navigation bar into white instead of transparant? It looks awful, because the text of the drop down goes through other text from my website (see example).. Who can help me with this? I'm trying and searching for hours now.... Template: Avenue | website: www.evelienhogers.com -
I am using the Brine template, And I'm not seeing any options to create a transparent navigation header and add a full-size banner image. I am trying to re-create this site, which says uses the Brine template as well. I'm not seeing any styling options to mimic this site header/homepage style. Any help is much appreciated! https://www.usesixty.com/showcase/squarespace-website-examples/7047-fringe -
Hey all, I'm building a site on the Wav template with forced Mobile. I have the menu sliding out so it only covers a small part of the page. But part of page it's not covering is just white. Could someone direct me in having the site visible behind it. https://bell-parrot-x7ly.squarespace.com/ password is password
-
I want to achieve something similar to this website when you scroll https://wearedame.co/In order to do that I need to make a section background transparent, I think... I have Chrome Squarespace block identifier extension but I couldn't achieve what I want still/ the code didn't work. Please help :) -
How can i use the facebook pixel to track service products?
MarybethK posted a question in Coding and Customization
I am trying to set up a Facebook pixel for my site. I am selling services, not physical products. "Creating Facebook ads for your products" page seems to indicate that i can't use the fb pixel for a service product - is this the case? If so, why is this? Can I manually install code to get around this? Can I install the pixel to track other things like traffic to my site and not the product checkout process? Thanks! -
Hi there, I am trying to remove the purple overlay that is on the homepage hero image only. I've tried a few blocks of code I found from here: https://answers.squarespace.com/questions/63465/haydenbedford-remove-the-overlay-on-just-one-banner-image.html https://answers.squarespace.com/questions/75236/hayden-remove-banner-color-overlay-on-one-image-or-on-one-page.html After injecting the code into the Advanced area within the Page Settings, all that happens is the code shows up at the top of the page. Thanks!
