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

Help with CSS for Newsletter Block

Question

Recommended Posts

  • 0

Here is the screenshot.  First, I would like the title font of the newsletter to be much smaller.  If possible, I would like the SIGN UP to by inline with the input field.

Thanks,
Paul

image.thumb.png.66d9b3bf6d36030f1fd694509fe48ee8.png

Share this post


Link to post
  • 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;
}
}

 


You can send your question to my email to get faster answer.

How to Setup Password & Share URL  Squarespace Customer Care

OFF to next Tuesday. Please send to email if you have urgently problem.

Share this post


Link to post
  • 0

Thank you for the quick reply, I made the change however the SIGN UP is not lined up.  Also, can the Sign up and save 5% be on one line and closer to the input box, not so much space?

image.png.b90ec46fafcb8d5d6ca14924f5959129.png

Share this post


Link to post
  • 0

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.

image.thumb.png.65e80ca54917561d4331b24ce68a716b.png

Share this post


Link to post
  • 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;
}

 


You can send your question to my email to get faster answer.

How to Setup Password & Share URL  Squarespace Customer Care

OFF to next Tuesday. Please send to email if you have urgently problem.

Share this post


Link to post
  • 0

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

Capture.PNG

Capture2.PNG

Share this post


Link to post
  • 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?


You can send your question to my email to get faster answer.

How to Setup Password & Share URL  Squarespace Customer Care

OFF to next Tuesday. Please send to email if you have urgently problem.

Share this post


Link to post
  • 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.

Share this post


Link to post
  • 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?


You can send your question to my email to get faster answer.

How to Setup Password & Share URL  Squarespace Customer Care

OFF to next Tuesday. Please send to email if you have urgently problem.

Share this post


Link to post
  • 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.


You can send your question to my email to get faster answer.

How to Setup Password & Share URL  Squarespace Customer Care

OFF to next Tuesday. Please send to email if you have urgently problem.

Share this post


Link to post
  • 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


You can send your question to my email to get faster answer.

How to Setup Password & Share URL  Squarespace Customer Care

OFF to next Tuesday. Please send to email if you have urgently problem.

Share this post


Link to post
  • 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

Share this post


Link to post
  • 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;
}

 


You can send your question to my email to get faster answer.

How to Setup Password & Share URL  Squarespace Customer Care

OFF to next Tuesday. Please send to email if you have urgently problem.

Share this post


Link to post
  • 0
Posted (edited)
On 5/14/2020 at 8:43 AM, tuanphan said:

Add to Home > Design > Custom CSS


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

 

Thank you so much!

 

 

Edited by RRNYC

Share this post


Link to post
  • 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?


You can send your question to my email to get faster answer.

How to Setup Password & Share URL  Squarespace Customer Care

OFF to next Tuesday. Please send to email if you have urgently problem.

Share this post


Link to post
  • 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;
}

 


You can send your question to my email to get faster answer.

How to Setup Password & Share URL  Squarespace Customer Care

OFF to next Tuesday. Please send to email if you have urgently problem.

Share this post


Link to post
  • 0

@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

Share this post


Link to post
  • 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.


You can send your question to my email to get faster answer.

How to Setup Password & Share URL  Squarespace Customer Care

OFF to next Tuesday. Please send to email if you have urgently problem.

Share this post


Link to post

Create an account or sign in to comment

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


×
×
  • Create New...