springerdesign

I tried your solution with the code injection in the footer, but the code still appears in the title (I removed it for now). Here is the post:

https://www.reichmanjorgensen.com/news-events/estremera-lawdragon500-2023

Did anybody find a solution to this? I have the same issue/question.

I have the same issue-- did you ever find a solution?

Thanks for your reply, tuanphan-- the white line artifact I see is on a real device-- browsing using Chrome on my desktop computer (Mac).

Hello,

I am trying to create some custom, irregular borders for my sections in 7.1. I have searched up and down, and have not found a simple solution that currently works. I tried https://schwartz-edmisten.com/blog/custom-section-divider-in-squarespace but the code did not work and in the comments below the article, Chris Schwartz-Edmisten says that his code no longer works with Fluid Engine. I ended up finding this solution by Ryan Dejaegher https://ryandejaegher.com/how-to-make-wavy-section-transitions-in-squarespace-7.1/ using SVGs and CSS clip-paths.

The process of creating the code for the SVG paths is very complicated (you have to insert it into the footer code injection), but it seems to have worked OK. Unfortunately, there are two problems:

1. When changing the size of the browser window (I am using Chrome), there sometimes seems to be a thin white line that separates the aqua background color of the section I am targeting and the irregular SVG shape. Depending on how you re-size the window, the white line appears and disappears. Having the line there really ruins the illusion of the irregular shape. I have attached a screen shot of what it looks like.

2. Inserting these SVG clip-paths seems to have added some unwanted extra white space at the bottom of the page.

Does anyone have any ideas about either a) a simpler approach that works either with SVG or PNG shapes in the current version of 7.1, or b) a way to fix the two problems stated above?

Here is the code:

/* Adds downward facing wave to bottom of aqua section */
[data-section-id="6387b11f2aa80e0cd874d25a"] {
  position:relative;
}
[data-section-id="6387b11f2aa80e0cd874d25a"]:after {
  position: absolute;
  content: '';
  width: 100%;
  height: 100px;
  top: 0;
  left: 0;
  background: #98d4d7	;
  clip-path: url(#wave-bottom);
}
/* Adds upward facing wave to bottom of white section */
[data-section-id="6387b11f2aa80e0cd874d253"]:after {
  position: absolute;
  content: '';
  width: 100%;
  height: 100px;
  bottom: 0;
  left: 0;
  background: #98d4d7	;
  clip-path: url(#wave-top);
}

The website is: https://bell-orange-3fdd.squarespace.com/ and the password is "irregular".

Thank you in advance for your help!

- Jesse

Nevermind! User error!

This didn't work for me. I deleted the original file, saved changes, and then went back in and uploaded the file with the same name, but Squarespace added a little four character hash after the file name, which messes up the links.

2 hours ago, creedon said:

Add the following to Design > Custom CSS.

/* hide cart on all pages */

.Cart {

  display : none;
  
  }

/* show cart on some pages */

.collection-type-products .Cart, /* products page */
#cart .Cart /* cart page */

  {
  
    display : block;
    
    }

This is for v7.0 using the Brine template family.

Let us know how it goes.

Hi creedon, that worked brilliantly, thank you!

-Jesse 

Site URL: https://www.springerdesign.biz/

Hi there,

I have a commerce page on my site that is sort of separate from the purpose of the rest of the site. I would like to keep my commerce page going, but remove the cart icon from all of the other pages of my site. Can someone help me figure out how to do that?

Thanks! -Jesse