What's your biggest current challenge? Have your say in Community Polls along the right column.

No scroll on screen

Solved

No scroll on screen

marycrichton123
Explorer
53 0 10

I have built a password page on Shopify, I would like to do two things: 

 

https://mishmash.world/password

 

1. stop the page from scrolling, so that no matter what size the screen is the content will fit that screen and there will be no option to scroll. 

 

2. I would like to remove the semi-colons from the timer. Doing this in the CSS file is hard as they are the same class. 

 

Really appreciate anyone's advice

 

The ideal password page is attached 

Accepted Solutions (3)

Guleria
Shopify Partner
3692 741 1039

This is an accepted solution.

Hello @marycrichton123 ,

 

Follow these steps:

1. Go to Online Store -> Theme -> Edit code

2. Open your section-password.css file and paste the following code at the bottom:

.essential_countdown_timer span:nth-child(even) {
    visibility: hidden;
}
body.password.gradient { 
    overflow: hidden;
}

 

Thanks

- Drop an email   if you are looking for quick fix or any customization
- Email: guleriathakur43@gmail.com Skype: live:navrocks1
- Try GEMPAGES a great page builder

View solution in original post

Guleria
Shopify Partner
3692 741 1039

This is an accepted solution.

Definitely it will, if you need footer visible either you have to make the scroll visible or remove the spaces and content from the body.

There is no other way to do it. 

- Drop an email   if you are looking for quick fix or any customization
- Email: guleriathakur43@gmail.com Skype: live:navrocks1
- Try GEMPAGES a great page builder

View solution in original post

Guleria
Shopify Partner
3692 741 1039

This is an accepted solution.

@marycrichton123 Add this css too at the bottom in file section-password.css 

.rich-text.content-container { 
    padding: 8px 0 0 0 !important;
}
.countdown_timer_wrapper_cm2u9n9df232681191lx3axb59f {
    padding: 0 !important;
    margin: 0 !important;
}
.password__footer {
    padding: 0 !important;
}

 

If problem solved don't forget to Like it and Mark it as Solution!

And If you need help with customization/code part you can contact me for services

You can find the email in the signature below.

 

Thanks

 

 

- Drop an email   if you are looking for quick fix or any customization
- Email: guleriathakur43@gmail.com Skype: live:navrocks1
- Try GEMPAGES a great page builder

View solution in original post

Replies 9 (9)

Guleria
Shopify Partner
3692 741 1039

This is an accepted solution.

Hello @marycrichton123 ,

 

Follow these steps:

1. Go to Online Store -> Theme -> Edit code

2. Open your section-password.css file and paste the following code at the bottom:

.essential_countdown_timer span:nth-child(even) {
    visibility: hidden;
}
body.password.gradient { 
    overflow: hidden;
}

 

Thanks

- Drop an email   if you are looking for quick fix or any customization
- Email: guleriathakur43@gmail.com Skype: live:navrocks1
- Try GEMPAGES a great page builder
marycrichton123
Explorer
53 0 10

Amazing that hid the semi colons! Thankyou so much 

 

The only issue is when we remove the scroll, it removes the footer?

Guleria
Shopify Partner
3692 741 1039

This is an accepted solution.

Definitely it will, if you need footer visible either you have to make the scroll visible or remove the spaces and content from the body.

There is no other way to do it. 

- Drop an email   if you are looking for quick fix or any customization
- Email: guleriathakur43@gmail.com Skype: live:navrocks1
- Try GEMPAGES a great page builder
marycrichton123
Explorer
53 0 10

@Guleria  thankyou. 

 

How do I:

1. reduce the padding around the rich text block

2. reduce the padding around the timer? 

 

Thanks, 

Mary

Guleria
Shopify Partner
3692 741 1039

This is an accepted solution.

@marycrichton123 Add this css too at the bottom in file section-password.css 

.rich-text.content-container { 
    padding: 8px 0 0 0 !important;
}
.countdown_timer_wrapper_cm2u9n9df232681191lx3axb59f {
    padding: 0 !important;
    margin: 0 !important;
}
.password__footer {
    padding: 0 !important;
}

 

If problem solved don't forget to Like it and Mark it as Solution!

And If you need help with customization/code part you can contact me for services

You can find the email in the signature below.

 

Thanks

 

 

- Drop an email   if you are looking for quick fix or any customization
- Email: guleriathakur43@gmail.com Skype: live:navrocks1
- Try GEMPAGES a great page builder
marycrichton123
Explorer
53 0 10

Amazing, thank you @Guleria 

 

I have one last request:

 

1. I would like to change the input field, to be one straight line with email written above it from the footer 

2. I would like to take away the text. 'Are you the store owner? Log in here' from the footer

 

Screenshot 2024-11-03 at 15.11.43.png

LizHoang
Shopify Partner
285 35 61

Hi @marycrichton123 , 

 

Thanks for your question. You can follow the instruction here: 

1. Go to Shopify > Online store > Theme > Edit code

2. Select theme.liquid > copy the code and paste it before </head> tag. https://prnt.sc/z6YYHAk5vgEI

 

{% style %}
body.password.gradient {
    overflow: hidden !important;
}
{% endstyle %}

 

Please let us know if our reply is helpful by giving it a Like or marking it as a Solution!

Check our Joy Rewards & Loyalty Program
marycrichton123
Explorer
53 0 10

I pasted in password.liquid - see attached

 

But it didn't work Screenshot 2024-11-02 at 09.59.53.png

LizHoang
Shopify Partner
285 35 61

Ah, please paste it to the Theme.liquid, not password liquid file

Please let us know if our reply is helpful by giving it a Like or marking it as a Solution!

Check our Joy Rewards & Loyalty Program