No scroll on screen

Solved

No scroll on screen

marycrichton123
Explorer
78 0 19

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
4147 809 1164

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

- Custom themes, UI/UX design, ongoing maintenance & support.
- 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
4147 809 1164

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. 

- Custom themes, UI/UX design, ongoing maintenance & support.
- 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
4147 809 1164

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

 

 

- Custom themes, UI/UX design, ongoing maintenance & support.
- 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
4147 809 1164

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

- Custom themes, UI/UX design, ongoing maintenance & support.
- 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
78 0 19

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
4147 809 1164

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. 

- Custom themes, UI/UX design, ongoing maintenance & support.
- 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
78 0 19

@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
4147 809 1164

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

 

 

- Custom themes, UI/UX design, ongoing maintenance & support.
- 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
78 0 19

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
1251 159 195

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
78 0 19

I pasted in password.liquid - see attached

 

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

LizHoang
Shopify Partner
1251 159 195

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