Jump to content

CSS Code for Image Block - Collage Block Button

Recommended Posts

Hi. Can you share link to page where you use collage image block?

Do you add a extra link in image subtitle? We can give code to turn link to button.

Or if you use Business Plan or higher, we can use script code to add an extra button.

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 2 years later...

@tuanphan Hello, I want to add an extra button to my card so that it sits directly below the card text, not in a separate block underneath. 

I have a business plan so I would love a script but I also want to know the code to turn the link into a button. I am using Squarespace 7.0 so I don't have the fluid engine option.

Here is the link to test page, where I wrote 'SHOP' in italics so you can see where I would like the button: www.elizabethhayt.net/landing-page-copy2-1 The current button that I have sits too far down, and I used CSS to change the margins, but when it collapses on mobile the button runs into the text.

And here is a link to another version of the same page where the button is in the place that I want it. I didn't use poster or collage options to build these cards, I used image, text and button blocks. https://www.elizabethhayt.net/landing-page-copy HOWEVER, mobile view doesn't look good using this layout technique, as the image and text is disarranged. So I would prefer to use poster or collage cards, as they look good on mobile. 

Thx

Edited by 2Eyeballs
Link to comment
On 9/22/2023 at 6:05 PM, 2Eyeballs said:

@tuanphan Hello, I want to add an extra button to my card so that it sits directly below the card text, not in a separate block underneath. 

I have a business plan so I would love a script but I also want to know the code to turn the link into a button. I am using Squarespace 7.0 so I don't have the fluid engine option.

Here is the link to test page, where I wrote 'SHOP' in italics so you can see where I would like the button: www.elizabethhayt.net/landing-page-copy2-1 The current button that I have sits too far down, and I used CSS to change the margins, but when it collapses on mobile the button runs into the text.

And here is a link to another version of the same page where the button is in the place that I want it. I didn't use poster or collage options to build these cards, I used image, text and button blocks. https://www.elizabethhayt.net/landing-page-copy HOWEVER, mobile view doesn't look good using this layout technique, as the image and text is disarranged. So I would prefer to use poster or collage cards, as they look good on mobile. 

Thx

Hi,

The landing page copy doesn't work. Can you check it again?

and you want to add a button under this? For 4 image sections on page?

image.thumb.png.31756312b0dae1917af4553104d498de.png

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.