creedon

13 hours ago, SarahCashmore said:

Has the twcsl link changed? When I click the link, I get an error message.

My apologies. Please try the link again. It should be working now. Let me know how it goes.

4 hours ago, Aurelia said:

Im using Avenue template & definitely do not get that Design tab

I have the Design tab in my Avenue.

Your CSS has syntax errors starting at the following.

/* Hover images homepage */
@media-screen-only{

53 minutes ago, Aurelia said:

Is there a way to do this w code on older templates that don't show the "design" tab in accordion style popup?

In my v7.0 test site using the Brine template family there is a Design tab for the Accordion block and it have some Divider controls.

37 minutes ago, RickRich said:

I need to reference an image from my asset library in an email signature, how do I get the image URL?

If this an infrequent need you can bring up the context menu for the image.

Then get rid of everything including the ? near the end of the URL.

?content-type=image%2Fpng

Let us know how it goes.

1 hour ago, SarahFrancesBrandCo said:

Can you help me understand HOW to keep the product title and description though?

Please post the URL for a page on your site where we can see your issue. For us to see the URL you need to include the link in the content of your post. The URL field the forum software provides is not shown to us.

A link to the backend of the your site won’t work for us, i.e. a URL that contains /config/.

Please set up a site-wide password, if your site is not public and you've not already done so.

Post the password here.

Adding a site-wide password does not allow anyone to alter your site. It only allows those with the password to see your site.

Please read the site-wide password and how to share a link documentation to understand how they work.

You may find How to post a forum question post useful.

We can then take a look at your issue.

2 hours ago, Jack_Will said:

i need to convert in jpg or png and compress it for better pagespeed  anybody knows the solution!

WebP is not supported on SS and you have to convert to another format like JPEG or PNG.

Other than the content you upload or custom code you install, there is really nothing you can do to fix SS manually. SS is a closed system and you don't have access to the backend where the issues are with SS's speed.

v7.0 sites use a single editor for both desktop and mobile.

Your issue is probably due to unintentional nesting of blocks.

Notice how the two coming soons are not on a row on their own. They are laid out in a column under the videos.

The way columns wrap when viewed on mobile is the ones on the right collapse under columns that precede them.

So on desktop you have...

column 1    column 2

...and on mobile you get...

column 1

column 2

So you can see with thee layout you have you get an interleaving you probably don't want.

To reduce unwanted nesting of blocks I use the technique of using line blocks that span the whole width. Something like the following.

Line block

block    block

Line block

block    block

Line block

block    block

Line block

Then when everything is laid out the way I want, I remove the line blocks.

Let us know how it goes.

A  slideshow presentation can be had by using the Initial Gallery View tweak.

Making the thumbnails appear below the slides is possible, I think.

It would require a bit of JavaScript and a not insubstantial visual restructuring of the current thumbnail content with some CSS.

I know of no code that currently does this.

Please post the URL for a page on your site where we can see your issue. For us to see the URL you need to include the link in the content of your post. The URL field the forum software provides is not shown to us.

A link to the backend of the your site won’t work for us, i.e. a URL that contains /config/.

Please set up a site-wide password, if your site is not public and you've not already done so.

Post the password here.

Adding a site-wide password does not allow anyone to alter your site. It only allows those with the password to see your site.

Please read the site-wide password and how to share a link documentation to understand how they work.

You may find How to post a forum question post useful.

We can then take a look at your issue.

It appears to be working to me. Did you find a fix?

Please see the following.

Let us know how it goes.

The issue is that the instructions you are following are for Classic Editor section blocks.

You are using the Fluid Engine editor and the image blocks were redesigned for it and Squarespace removed the various Design styles.

I know of no instructions for how to replicate the effect you want using Fluid Engine.

Please see the following.

Let us know how it goes.

You may be able to adapt the following to your needs.

Let us know how it goes.

Here is the deal.

SS doesn't make it explicitly clear that Custom CSS supports LESS v1.3.1. Although if you dig around it becomes apparent. v1.3.1 is an ancient version of LESS and therefor you have to often use literals to get CSS syntax that came after v1.3.1 to work.

Examples

your-selector-here {

  max-height : ~"100svh";
  max-height : ~"calc( 100vh - var( --header-scrim-top-spacing ) )";
  max-height : ~"calc( 100svh - var( -- header-scrim-top-spacing ) )";
  
  }

Let us know how it goes.

Quote

I noticed it's not working on mobile. Is that just a necessary limitation, or did I do something wrong?

I have updated the code. Give it a try and let us know how it goes.

Quote

I wanted to know if another Circle member can be added as a contributor and then they can opt-in to Fluid Engine?

Yes you can add another member who is a Circle Member and have them change the setting.

I'd be happy to do this for you. Direct message me and we can set it up.

Whichever Circle Member you invite will need a Contributor invitation with administrator permission.

Setting a section to large makes it the height of the viewport.

Setting the section with code to height medium wasn't strictly necessary but I've gotten into the habit of leaving section settings at the defaults when making these kinds of spacing changes via CSS.

The basic trick here for the section with code is to override any element that is adding height or padding so that the section has an effective height of zero.

Quote

I am using the ‘Avenue’ template v7, it doesn't look like this will work with that template?

I have verified the code does work with the Avenue template and updated the codes READ ME.

I have updated my cited code in my October 30, 2020 post.

From the changes...

• checked for v7.0 Avenue template compatibility

Quote

I checked and made sure the gallery height was set to L (and full bleed.)

The gallery section is still set to height medium. Set it to large and Save.

The section with the code is set to large. It should be medium.

If those section heights aren't set correctly. Then the CSS code won't work.

I also updated my code. There was a missing ruleset.

Please see the following.

Let us know how it goes.

Set the Gallery section height to large.

Set the section with your SVG code height to medium.

Replace your CSS, make a copy somewhere, with the following to Page Settings > Advanced > Page Header Code Injection for the page. Please see per-page code injection.

<style>
  
#header,
#footer-sections {

  display : none;

  }

.page-section:nth-child( 2 ).section-height--medium:not( .content-collection ):not( .gallery-section ):not( .user-items-list-section ) {

  min-height : unset;
  
  }

.page-section:nth-child( 2 ).vertical-alignment--middle:not( .content-collection ):not( .gallery-section ):not( .user-items-list-section ):not( .editmode-changing-rowcount ).section-height--medium > .content-wrapper {

  padding : 0;
  
  }

.page-section:nth-child( 2 ).section-height--medium:not( .content-collection ):not( .gallery-section ):not( .user-items-list-section ) .fluid-engine {

  display : block;
  
  }

/* body { height: 100vh!important;   or  min-height: 100vh!important; } */

.centeredlogo { 

  fill : #FFFEFC;
  left : 50%;
  max-width : 600px;
  position : fixed;
  top : 49%;
  transform : translate( -50%, -50% );  
  width : 30vw;
  
  }

  /* HIDDEN ELEMENTS ON MOBILE */ 
/*@media only screen and (max-width: 768px) {.centeredlogo {width: 75%;}
}*/

@media screen and (max-width: 800px) {
  .centeredlogo {
    width: 62%;
  }
}  
  
</style>

Let us know how it goes.