SSong
-
Posts
53 -
Joined
-
Last visited
Content Type
Forums
Gallery
Blogs
Events
Store
Downloads
Profiles
Posts posted by SSong
-
-
Site URL: https://www.fortsferryfarm.com/event-calendar
Since I disabled the day tag on the event page, the distinction between future and past event is not as clear as I would like, so I'd like to be able to use css to change the opacity of past event event thumbnails or overlay a semi-transparent white box over. If anyone can help moi out, it'd be much appreciated!
Thank you 3000!
FYI template is brine
-
11 hours ago, bangank36 said:
Can you share your site with the site-wide password so I can take a look for the issue on mobile?
Here's the link, password is 12345. If you see it in mobile view, you'll see the cutoff I'm talking about
-
Hi @bangank36! How do I change the "Read More" and "Read Less" text to all caps? And also it cuts off weird on mobile, like there's a white block covering the bottom half of a line of text. Any idea how to fix that? Thanks!
-
On 4/10/2022 at 9:00 AM, tuanphan said:
Add to Design > Custom CSS
div.header-nav-item [href="/dreamvs"] {content: ''; background: url(https://content.invisioncic.com/p289038/monthly_2020_11/FreezePeach-ComingSoon.png.ce50920572f09ddd418a10fcdc065c88.png) no-repeat; background-size: cover; height: 100%; color: transparent !important; background-position: center center; }Can you help me as well? I'd like to change the FOR FUN navigation link of this site to this logo here. And f I want it to be a vector svg instead of a png, can I just swap it out after? Thank you!
-
On 4/5/2022 at 7:48 PM, bangank36 said:
When scrolling down, do you mean changing color of this title?
Correct, I'd like to change it to #0033a0. Also how do I get rid of the underline when it's not active? Thank you!
-
@bangank36 Ooh my god Ba, can you help me? I want the active anchor in the left sticky sidebar to change color as you scroll to the anchor point, and I have no clue how to do it. Here's the link to the page. I've attached the question I posted before, it'd be great if you could respond over on that page.
Thank you thank you! 🙏 🙏
-
On 3/22/2022 at 3:57 AM, tuanphan said:
Hi, I mean where did you add, Custom CSS, Code Injectiion, Page Header, Code Block or
Ahh sorry, I added it within the code block.
-
11 hours ago, tuanphan said:
Hi. Have you found a solution yet?
No, I haven't. I don't know how to change the color the titles in the side bar as you scroll past the coordinating section.
-
11 hours ago, tuanphan said:
Where did you add style tag?
I took it off, because if I added it on, it would break the whole thing.
Here's what I added, maybe I didn't have the right target?
<style> .farm-anchor a{ font-size:medium; color:gray !important; border-bottom-style:none !important; border-bottom-width:0px } .farm-anchor a:hover{ color:#404040 !important; } <style>
-
Hello kind people!
I'm trying to implement a sticky side bar inside index sub-page with a jump-links that will be highlighted as you scroll to each section, I'm half way there and did manage to make the side bar sticky with help, but I don't know how to make the jump links change color as you scroll to the perspective section. Here's a perfect example of what I'm trying to do. Can somebody help me with this? Can it be done without javascript? My coding knowledge is pretty rudimental.
Thank you!!
-
1 hour ago, tuanphan said:
I see it still works here
That's because I remove the style tag, would love to know how to make it work with the style tag added on. Thank you!
-
3 hours ago, tuanphan said:
Add to Design > Custom CSS
/* About sticky */ @media screen and (min-width:641px) { section#farm-intro .span-4 { position: sticky; position: -webkit-sticky; top: 0; } section#farm-intro>div { overflow: visible !important; } section#farm-intro { overflow: visible !important; } }Thank you!! It was working, until I turned them into anchor links and somehow broke everything...
I think you still have permission as the website editor, so feel free to dig around in there if it helps.
Below is what I put down anchor link. Maybe there's something obvious that I just can't see as my familiarity of css is pretty limited.
Basically, this is what I'm trying to achieve but I have no idea how to implement this into Squarespace.
<div class="farm-anchor"> <h3><a href="#varieties">Varieties</a></h3> <h3><a href="#practices">Practices</a></h3> <h3><a href="">Compost</a></h3> <h3><a href="">Reduced Till</a></h3> <h3><a href="">Crop Rotation</a></h3> <h3><a href="">Biodiversity</a></h3> </div> <style> .farm-anchor a{ font-size:medium; color:gray !important; border-bottom-style:none !important; border-bottom-width:0px } .farm-anchor a:hover{ color:#404040 !important; } <style>
-
Could you help me? I'm looking to do something similar on an index page sub page #farm-intro, trying to make the the left column (with the FARMING PRACTICES, COMPOST, REDUCED TILL, CROP ROTATION, BIODIVERSITY) sticky within the subpage, and also highlighted somehow (darker color or bigger font size) as one scrolls down past the section on right column.
I tried to do it myself but it's not working... 😥
Thank you!!
-
7 hours ago, tuanphan said:
Sorry about the confusion. I thought we'd launch these listings next week, so just the Microgreens listing please.
Regardless, I would still like to learn how to change the labels of multiple products, so I know how to do this in the future.
Thank you!
-
5 hours ago, tuanphan said:
Which product you want to target?
Vegetable and flower CSA, and the microgreens listings
-
On 1/22/2022 at 7:19 AM, tuanphan said:
Add to Page Header
<style> .view-list .product-mark.sold-out { font-size: 0; } .view-list .product-mark.sold-out:before { content: "Coming soon"; font-size: 10px; background-color: black !important; display: block; color: white; width: 80px; right: 10px; position: absolute; top: 10px; line-height: 20px; } </style>
Thank you! But how do I target just 1 or 2 products? @tuanphan
-
12 hours ago, tuanphan said:
Change circle sold out to coming soon for Vegetable csa product only?
Yes, plus the sold out labels in the related product section as well, which I almost figured out. The only thing I managed to figure out is replacing the "sold out" text in the product description. I'm having a hard time finding exactly how to target a specific product thumbnail on the shop page.
I know "Coming Soon" is not gonna fit in that same circle, so the background could just be a rectangle in a different color so it's more obvious.
Thank you Tuan!!
-
On 10/17/2021 at 8:16 PM, tuanphan said:
Add to Design > Custom CSS
/* Sale out to Coming Soon */ .product-mark.sold-out { visibility: hidden; } .product-mark.sold-out:before { visibility: visible; content: "Coming Soon"; position: absolute; left: 50%; transform: translateX(-50%); }How do I change the label of a single product's thumbnail on my shop page? I'd like to change the Veggie CSA's thumbnail to say coming soon, but I don't want to create a different category for it.
-
On 11/16/2021 at 12:59 PM, creedon said:
I'm not seeing the code installed. If it is not installed please install it so we can see what might be wrong.
So this is what I see on my phone. The two button are in the same row instead of stacked, but I'm actually ok with that. I don't want the row reverse on mobile anymore, it's better if the continue shopping button is on the left on mobile, but something is weird with the padding of the checkout button, and there's also no margin in between for some reason. Would also love bigger margin at the top of the whole thing. Thank you!!
-
On 11/17/2021 at 11:58 PM, tuanphan said:
Add to Design > Custom CSS
@media screen and (max-width:640px) { section#hero-image-1 { min-height: 90vh !important; } }THANK YOU!!!
-
On 11/13/2021 at 12:15 AM, creedon said:
I have updated my code post. Not sure it is 100% what you want but should be closer, hopefully.
Let us know how it goes.
Not sure what I did wrong but the button reversal is not working at all.
-
On 11/14/2021 at 8:57 AM, tuanphan said:
Desktop only or all devices?
just on mobile, thank you!
-
18 hours ago, creedon said:
Add the following to Design > Custom CSS.
/* begin cart checkout buttons change Version : 0.1d0 SS Version : 7.0 v7.0 Templates : Brine ( Aria, Blend, Burke, Cacao, Clay, Fairfield, Feed, Foster, Greenwich, Hatch, Heights, Hunter, Hyde, Impact, Jaunt, Juke, Keene, Kin, Lincoln, Maple, Margot, Marta, Mentor, Mercer, Miller, Mojave, Moksha, Motto, Nueva, Pedro, Pursuit, Rally, Rover, Royce, Sofia, Sonora, Stella, Thorne, Vow, Wav, West ) Dependancies : LESS By : Thomas Creedon < http://www.tomsWeb.consulting/ > */ #cart { .checkout { display : flex; gap : 1.5rem; .checkout-button { margin : unset; } } // .checkout } // #cart @media screen and ( min-width : 640px ) { // desktop #cart .checkout { flex-direction : row-reverse; } } @media screen and ( max-width : 639px ) { // mobile #cart .checkout { justify-content : flex-end; .checkout-button:not( .t-continue ) span { display : inline-block; width : 10rem; } } } // end cart checkout buttons changeLet us know how it goes.
It worked, but I still want the button to be stacked on mobile, which currently, they are not (see pic). Now that I look at it, I would like to replace the Continue Shopping button into just a linked text on mobile with an added arrow, beneath the Check Out button. Thank you thank you!
-
Could anyone help me to make the top banner of my home page taller with custom css? Thank you!
Adding hyperlink to image swap code block
in Customize with code
Posted
Hello! I'd like to get option 1 working, it worked on image for a second and then it didn't work again. Could you help me check (link here) and see what I did wrong? Thank you!