Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Help with CSS for Newsletter Block


coindisplays

Question

Recommended Posts

  • 0

Add to Home > Design > Custom CSS

footer.Footer h2.newsletter-form-header-title {
    font-size: 18px;
}
@media screen and (min-width:641px) {
footer.Footer .newsletter-form-body {
    display: flex;
    flex-direction: row !important;
}
}

 

Link to comment
  • 0
23 hours ago, coindisplays said:

I was able to make it more how I want it.  See below.  I would like the SUBSCRIBE though to be closer to the input field.  If the field and the button can be made smaller, I would prefer that too.

 

Add to Home > Design > Custom CSS

.newsletter-form-body>div {
    margin-top: 0 !important;
}

 

Link to comment
  • 0
9 hours ago, sebradshaw88 said:

Hi, I am looking to do the same thing, but having trouble formatting it. Here is what it currently looks like vs. what we are trying to accomplish (wireframe screenshot).

 

 

Can you describe in detail?

Link to comment
  • 0
On 3/27/2020 at 10:02 PM, tuanphan said:

Can you describe in detail?

I'm really just trying to shrink the newsletter block so that it fits nicely in the footer. Ideally the button sits right next to the text input box. The top image is what it is currently. The bottom is what we are trying to create.

Link to comment
  • 0
15 hours ago, sebradshaw88 said:

I'm really just trying to shrink the newsletter block so that it fits nicely in the footer. Ideally the button sits right next to the text input box. The top image is what it is currently. The bottom is what we are trying to create.

got it, can you share link to your site?

Link to comment
  • 0
50 minutes ago, emily.klein said:

Hi @tuanphan

https://piece-collectors.squarespace.com/

password: CACTUS

Brine Template

I have 2 Questions:

1. How can I add a newsletter block to the right hand side of the footer?

2. Can I change the business name on the right hand side of the footer to be a logo instead?

Thanks!

1. You can't add newsletter block???

2. Where business name? Can you take a screenshot.

Link to comment
  • 0
2 hours ago, emily.klein said:

Hi @tuanphan

1. No. Maybe it's something glitchy with SS - as I can only see two columns instead of three. 

2. Screenshot attached

Thanks,

Emily

Q1. Contact Squarespace Customer Care

Q2. Add to Home > Design > Custom CSS

.Footer-business-info>div:first-child {
    background-image: url(https://beaverhero.com/wp-content/uploads/2020/05/artboard-1-.jpg);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    color: transparent !important;
}

Replace with logo url

Link to comment
  • 0
9 hours ago, tuanphan said:

Q1. Contact Squarespace Customer Care

Q2. Add to Home > Design > Custom CSS


.Footer-business-info>div:first-child {
    background-image: url(https://beaverhero.com/wp-content/uploads/2020/05/artboard-1-.jpg);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    color: transparent !important;
}

Replace with logo url

Great thanks @tuanphan 

That worked a treat!

 

One last question - is there a way to hide the business information but keep the logo?

 

Screen Shot 2020-05-14 at 9.05.02 am.png

Link to comment
  • 0
13 hours ago, emily.klein said:

Great thanks @tuanphan 

That worked a treat!

 

One last question - is there a way to hide the business information but keep the lo

Add to Home > Design > Custom CSS

.Footer-business-info>*:not(:first-child) {
    display: none;
}

 

Link to comment
  • 0
8 hours ago, RRNYC said:

Hello and thank you so much for this code, it was super helpful! I just have one question: I managed to decrease the font size for the "newsletter" header but not the button/button font itself. Can you please advise how to give it all a more delicate, smaller look? Thank you so much!

 

Can you share link to page in screenshot?

Link to comment
  • 0
7 hours ago, RRNYC said:

@tuanphan reutnewyork.com

 

Had also wanted to remove the "quick view" feature on this page: https://reutnewyork.com/shop

 

Thank you!

Add to Home > design > Custom CSS

/* remove quick view */
.ProductList-quickViewButtonWrapper.sqs-product-quick-view-button-wrapper {
    display: none !important;
}
/* button font size */
.sqs-alternate-block-style-container .newsletter-block .newsletter-form-wrapper .newsletter-form-button {
    font-size: 12px;
}

 

Link to comment
  • 0
3 hours ago, KimPaola said:

@tuanphan Hi, Just wondering if you know how to create a single line newsletter block in squarespace 7.1? I'm attaching a image below of the kind of newsletter I mean. I'd appreciate any help! 

single line newsletter block.JPG

Just did for a client. If you share link to your site, I can give the code.

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...