unavolta
Circle Member-
Posts
45 -
Joined
-
Last visited
Content Type
Forums
Gallery
Blogs
Events
Store
Downloads
Profiles
Everything posted by unavolta
-
How to add divider above footer on blog pages in 7.1 Fluid Engine
unavolta replied to chynna's topic in Customize with code
@tuanphan Any ideas for this one? Thank you for looking- 15 replies
-
How to add divider above footer on blog pages in 7.1 Fluid Engine
unavolta replied to chynna's topic in Customize with code
@tuanphan Slightly more complex - I have a pointed divider that was added with Squarespace's new section divider styling (see screenshots). I have applied it to the bottom section on all pages including the blog list. I also want it to appear on the blog post detail pages but there's no option in the design menu for this (I have already sent a support ticket to Squarespace to add in this feature). I want the pointed edge to appear below pagination on ALL blog post pages and also work with the footer reveal coding added in so the footer reveals behind the divider on scroll (See other pages for proper functionality). I was able to add the design to the bottom of the footer to pull the coding from if needed but there is no option to add the design to the top of the footer. https://housestudios.squarespace.com/ pw: house- 15 replies
-
How to add divider above footer on blog pages in 7.1 Fluid Engine
unavolta replied to chynna's topic in Customize with code
Thanks @tuanphan Would this work with a footer reveal too? How do I add the divider to the top of the footer? I only see how to add to the bottom of a section? I've added to the bottom for testing here: https://housestudios.squarespace.com/ pw: house- 15 replies
-
How to add divider above footer on blog pages in 7.1 Fluid Engine
unavolta replied to chynna's topic in Customize with code
@tuanphan @bryncmorg I am also looking for a similar solution to this - I've utilized Squarespace's new section dividers to create a unique divider at the bottom (before footer reveal) of all pages for a client's site and the exception is that I am unable to get it work on blog post pages because I cannot add a section below the blog post. https://housestudios.squarespace.com/ pw: house- 15 replies
-
@nadiamcleod88 Not yet!
-
@ZiggyWe are using iOS and it's specifically the pagination links to nav between portfolios - requiring a double click when trying to navigate on mobile. Works fine with single-click on desktop. No code for hover effects, although site animations are turned on.
-
Post updated Site: https://ocelot-tomato-8d52.squarespace.com/portfolio1?password=ginger
-
Hello - I am trying to solve for the double-click links on mobile that is happening when trying to navigate portfolios on mobile. The pagination links require clicking twice to actually navigate. This post says it may be the site animation but how can I turn off site navigation for pagination on mobile only? or on the mobile site as a whole on mobile only? Is there a better way to solve for the double-clicking of links on mobile to make it single-click? Site: https://ocelot-tomato-8d52.squarespace.com/portfolio1?password=ginger
-
Ability to Enter Image Captions when Using Fluid Engine?
unavolta replied to LJeff's topic in Images & Videos
@paul2009 Running into this problem too, except I am using Fluid Engine to create an overlapping moodboard with captions, thus unable to go back to classic editor without a bunch of messy CSS to get the images how I like. The caption locations are not resizing appropriately for tablet or mobile or smaller screens (mobile I can adjust manually but not tablet or smaller screen sizes). Has there been an image caption solve for this yet? Site: https://www.alisonspada.com/work-iii-kc-copy/ -
heading Keep Logo Center, Move Navigation to Right in 7.1
unavolta replied to unavolta's topic in Customize with code
Logo placement looks good now but when you scroll down, the header still cuts the bottom of the logo above the tagline "Creative Direction + Brand Strategy" which in this case is embedded in the logo file. See screenshot. I want the header to cut below the logo tagline so you can still read it while scrolling (ie. more bottom padding).- 19 replies
-
- logo
- navigation
-
(and 2 more)
Tagged with:
-
heading Keep Logo Center, Move Navigation to Right in 7.1
unavolta replied to unavolta's topic in Customize with code
@tuanphan It is working but slightly buggy and the logo is not appearing at first when I load the site, only after I downsize the window and then make it larger again. and then when it is appearing, it cuts it horizontally when it scrolls down. Can you take a look? Screenshots: Thank you,- 19 replies
-
- logo
- navigation
-
(and 2 more)
Tagged with:
-
heading Keep Logo Center, Move Navigation to Right in 7.1
unavolta replied to unavolta's topic in Customize with code
@tuanphanDone, thank you. https://alisonspada.com/- 19 replies
-
- logo
- navigation
-
(and 2 more)
Tagged with:
-
heading Keep Logo Center, Move Navigation to Right in 7.1
unavolta replied to unavolta's topic in Customize with code
@tuanphan Any luck here? Running into the same issue on another site. I added the above code but the logo is off-center https://www.alisonspada.com/ Looking for Logo (Center) and Navigation (Right)- 19 replies
-
- logo
- navigation
-
(and 2 more)
Tagged with:
-
Show a custom icon color based on light/dark theme
unavolta replied to gb-photo's topic in Customize with code
@tuanphanI figured it out 🙂 and got it to work in header on the specific pages I wanted with this code in the page header code injection: <style> .header-actions-action a[href*="substack"] { background-image: url(https://static1.squarespace.com/static/61e7443d8270c01ce2239916/t/6240b25db51f1159dbbe011b/1648407133383/substack2_blue.png); } </style> and on the social icon list in a specific block with this code in custom CSS: div #block-bf044cab69af258d3349 { .sqs-svg-icon--list a:nth-of-type(3){ background-image: url(https://static1.squarespace.com/static/61e7443d8270c01ce2239916/t/6240b25db51f1159dbbe011b/1648407133383/substack2_blue.png); } } -
@tuanphan Close here - this code stacks the full event info into two columns like this: This code also only works on true mobile, not when I size my screen down to mobile on desktop - I'd like to see this here too. but i want to achieve different pairings side by side so it's: column one next to column two then column three next to column four + decrease spacing between these two rows so they look like they belong together then the next row (leave larger padding here to distinguish the next event) column one next to column two then column three next to column four and so on
- 63 replies
-
- squarespace-7.1
- css
-
(and 1 more)
Tagged with:
-
Show a custom icon color based on light/dark theme
unavolta replied to gb-photo's topic in Customize with code
@tuanphanThanks! Close - Part 1) I got it to work to #15284C on the mobile menu by removing the body.header section and changing the URL to a new .PNG of the #15284C file Code: //substack color on mobile menu only// @media screen and (max-width:767px) { header#header a.icon[href*="substack"] svg { display: none; } header#header a.icon[href*="substack"] { background-image: url(https://static1.squarespace.com/static/61e7443d8270c01ce2239916/t/6240b25db51f1159dbbe011b/1648407133383/substack2_blue.png); background-size: 100%; background-repeat: no-repeat; }} Part 2) but in the header on light mode on certain pages like Book I want it to be the color #15284C, not black. I tried adjusting a few filters but can't get the right color or change the direct URL of the icon like for the mobile menu. #15284C URL: https://static1.squarespace.com/static/61e7443d8270c01ce2239916/t/6240b25db51f1159dbbe011b/1648407133383/substack2_blue.png -
Show a custom icon color based on light/dark theme
unavolta replied to gb-photo's topic in Customize with code
@tuanphan Also looking to do this for adding a Substack logo the social icons. I have been able to add it in in one color but I want it to shift from white to blue based on light or dark setting. & in mobile popup menu dark theme: https://www.melinahammer.com/ light theme: https://www.melinahammer.com/book pw: melina Want it as-is (White) here: Want it to be blue here: -
@tuanphan Done. https://www.melinahammer.com/book pw: melina Thank you for looking!
- 63 replies
-
- squarespace-7.1
- css
-
(and 1 more)
Tagged with:
-
@tuanphan Thank you for this thread! I have a similar request here. I am close but just need help with the text alignment and padding between rows on mobile. melinahammer.com/book pw: melina In the Upcoming Events section, I am looking to keep it as-is on desktop and pair two text blocks next to each other in mobile view. I'd like to align "Date" and "Event Title" next to each other and then "Location" and "TBD/Get Tickets" Section on the next row and next to each other. I also want the text to appear all center aligned - some is a bit wonky if the title is longer. See below "Now Serving LA - In Conversation with Julia Turshen" is misaligned I'd also like to decrease spacing between these two rows on mobile so it's clearer which info goes together and leave a bigger gap before the next listed event. Mobile View: My code so far: @media screen and (max-width:767px) { div#page-section-61f08b5a70fb144f88181a2b .sqs-col-1.span-1 { width: 40% !important; float: left !important; align: center !important; } .sqs-col-2.span-2 { width: 50% !important; float: left !important; text-align: center !important; } }
- 63 replies
-
- squarespace-7.1
- css
-
(and 1 more)
Tagged with:
-
heading Keep Logo Center, Move Navigation to Right in 7.1
unavolta replied to unavolta's topic in Customize with code
Removed. Thank you for your help here. https://shallot-leopard-twxs.squarespace.com/ pw: carden- 19 replies
-
- logo
- navigation
-
(and 2 more)
Tagged with:
-
heading Keep Logo Center, Move Navigation to Right in 7.1
unavolta replied to unavolta's topic in Customize with code
The site is currently on trial but will be on the Personal plan. Thank you- 19 replies
-
- logo
- navigation
-
(and 2 more)
Tagged with:
-
@Agha_WaqasThat worked thank you!
-
Site URL: https://shallot-leopard-twxs.squarespace.com/ Hello - I am seeking a way to stack my image blocks earlier than mobile. When I size my screen down on desktop, two of my sections look wonky with too much space below the image and text not resizing but on mobile version, they look great. https://shallot-leopard-twxs.squarespace.com/ pw: carden I do not want them to look like this: Instead, I want them to auto adjust to look like the mobile version, stacked and images full width I do have the following CSS to force these two sections full width: // Full Width Image Card - Page Section // [data-section-id="607a55e6300cc60f862fb6d4"] { overflow-x: hidden !important; overflow-y: hidden !important; .content-wrapper { padding: 0px !important; margin: 0px auto; display: contents; } .sqs-layout .sqs-row .sqs-block { padding-bottom: 0px !important; padding-top: 0px !important; }} // Full Width Image Card - Text Padding // .image-card-wrapper .sqs-dynamic-text-container { padding: 40px !important; } // Full Width Image Card - Page Section // [data-section-id="607d9cfc2ad03b5b77542454"] { overflow-x: hidden !important; overflow-y: hidden !important; .content-wrapper { padding: 0px !important; margin: 0px auto; display: contents; } .sqs-layout .sqs-row .sqs-block { padding-bottom: 0px !important; padding-top: 0px !important; }} // Full Width Image Card - Text Padding // .image-card-wrapper .sqs-dynamic-text-container { padding: 40px !important; } Thank you! Kayla
-
heading Keep Logo Center, Move Navigation to Right in 7.1
unavolta replied to unavolta's topic in Customize with code
Hi @tuanphan! Thank you! This worked for me but I am having the same issue as Courtney above with the main logo not being perfectly center. Any workaround? https://shallot-leopard-twxs.squarespace.com/ pw: carden- 19 replies
-
- logo
- navigation
-
(and 2 more)
Tagged with:
-
heading Keep Logo Center, Move Navigation to Right in 7.1
unavolta posted a topic in Customize with code
Site URL: https://shallot-leopard-twxs.squarespace.com/ https://shallot-leopard-twxs.squarespace.com/ pw: carden Hi there - I am looking for help moving my menu navigation to the top right side of the screen and keep the logo in the center. Site header options aren't letting me pair these two options together.- 19 replies
-
- logo
- navigation
-
(and 2 more)
Tagged with: