How can I customize the password page on the Dawn Theme?

SYKOANALYST
New Member
5 0 0

Hope all is well! 

 

So I've been working on my password page using the Dawn Theme and been able to figure out alot on my own. Im just now having trouble trying to customize a few things. I want to move the "enter using password" to the bottom of the page, & I also want to customize the font and change the lock icon if I can. Anyone can help?

Replies 6 (6)

PartsbyNC
Tourist
4 0 3

I'm using the Ride theme, but hopefully the process is similar. When you click on Online Store > Themes nest to the Customize button is the "..." click that and then click on Edit Default Theme Content. There under the General tab you should see Boxes with text for "enter using password" delete that but be sure to hit the space bar so it can save. Unfortunately I don't know how to get rid of the lock icon, but hopefully someone else will know.

 

As for changing the font, click on Online Store > Themes > then the Customize tab. In the top right corner of the editing page is the little Settings gear, click that. Under the Typography tab you'll be able to change fonts.

SYKOANALYST
New Member
5 0 0
Hey I ended up changing my mind, i would actually like to move the “enter using password” to the bottom of the page! would you be able to help me with that?
BrainStation23
Shopify Partner
260 43 41

Hi @SYKOANALYST 
We have gone through your problem and found a solution. 
Solution:
You can do this, You can follow these steps to achieve your result

Go to online store-> edit code-> password.liquid file 

{% section 'main-password-header' %} move this part inse the footer tag

 

 <footer>
      {% section 'main-password-footer' %}
      {% section 'main-password-header' %}
</footer>

 

 

Brain Station 23 PLC
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
Email: js.team@brainstation-23.com

PageFly-Garcia
Navigator
425 72 126

Hi, @SYKOANALYST 

 

I am Garcia from the Shopify Advanced Page Builder App PageFly. I am using Dawn theme too so you can try this code from your side

Go to theme customize => Password page => Password header => Custom CSS => Paste code

password-modal {
  position: absolute;
  top: 400px;
  left: 415px;
}

Warm regards,

Garcia | PageFly Team

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

PageFly-Garcia
Navigator
425 72 126

Hi @SYKOANALYST 
I just found that you wanna put it at the bottom so I suggest this one

Go to theme customize => Password page => Password header => Custom CSS => Paste code. After that, you just need to change the you just change the % of bottom so it will go to the bottom as you want.

 

password-modal {
    position: absolute;
    top: 61%;
    left: 50%;
    transform: translate(-50%, -50%);
}

 

PageFlyGarcia_0-1710492163234.png
On mobile

PageFlyGarcia_1-1710492162978.png

 

 

Warm regards,

Garcia | PageFly Team

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

SYKOANALYST
New Member
5 0 0

Thanks alot! I was experimenting with it and was able to put it exactly where I wanted for the website, but for mobile it stayed around the middle. If its easier I think my best bet would be to just remove it all together. Would you be able to help me with that?