How can I adjust text alignment on mobile and remove header text?

Store Design
1

Hello,

I need some help with aligning the text in the first section of the website to the middle of the screen on mobile, and the button as well. On desktop i would like it to remain on the left.

Here is a picture of how it looks now:

Screenshot_20220728_022530_com.android.chrome.jpg
Screenshot_20220728_022530_com.android.chrome.jpg1080×2340 140 KB

Also can someone please tell me how to remove the “menu” text in the top bar of the header?

Thank you very much in advance!

Store URL: https://klein-wallet.myshopify.com/
Password: ridvan

2

Hi [email removed]NZA

This is PageFly - Free Landing Page Builder. I would love to provide my recommendations for your store based on 6 years of providing solutions for about 100.000 active Shopify merchants.

you find : theme → Edit > Search “theme.liquid”.

Then you paste the code before the tag:

@media (max-width:767px){ .caption-content.caption-background-false.caption-transparency-false.align-left{ text-align:center !important } }

If you want more flexibility to personalize your pages, I’d love to introduce our product PageFly Landing Page Builder with 24/7 support live chat. PageFly has a Free plan where you can use all features and create different page types so I hope give us a try.

If you find my comment useful, please let me know by giving it a Like. Thank you!

PageFly

3

Hi @NZA ,

You can follow the instructions below.

  1. From your Admin store, go to Online store > Themes > Click Actions > Edit code
  2. Open the Asset folder, and find the styles.scss file.
  3. Add the code below.
@media only screen and (max-width: 750px) {
.caption-content.caption-background-false.caption-transparency-false.align-left {
    text-align: center;
    margin-left: 50%;
    transform: translateX(-50%);
}
}

.mobile_nav span.menu_title {
    display: none !important;
}