Help regarding my theme

coco44
Tourist
20 1 4

Hello,

Hope you are doing well. I am using the Debut theme with also Gempages. My website is: https://ypsohealth.com/

I have few issues I am not able to fix, can you please help.

1- How to make sure the buttons of the Debut theme has the same style as the buttons from Gempages. I do not want to see the difference between both.

Right now with Gempages I have the font Poppins, size 13.

2- I have an issue with the cart page: https://ypsohealth.com/cart

*How can I change the background colour of the page? It should not be white but like all my other pages grey: #f7f7f7

* Why the button is on top of 2 different backgrounds? Can we add more space below the button?

coco44_3-1626632379973.png

 

* How can I change CHECK OUT with CHECKOUT?

* Same issue here why the 2 buttons have a different front?

coco44_0-1626631749466.png

3- How can I have 2 columns for the footer like this website? https://galaxycove.com/

coco44_1-1626632001245.png

4- Also in mobile is there a way a way to have that for the footer, so when I click on the arrow, it opens the sub-menu:

coco44_2-1626632113525.png

Thank you very much and have a nice day.

C.

0 Likes

Hi C,

1. It looks like the Poppins font isn't being included on the normal Shopify pages. To do this, add the following code to you layout/theme.liquid file:

<link data-instant-track="" class="gf_fonts" data-fonts="Poppins" href="//fonts.googleapis.com/css?family=Poppins" rel="stylesheet" type="text/css">

2. You can change the background colour of the whole site by going to the theme customiser, then clicking 'Theme Settings' in the bottom left, then expanding the 'Colors' section on the right and setting the page background colour.

To fix the button/background issue:

.cart__footer {
   padding-bottom: 50px;
}

To change the 'check out', open locales/en.default.json in the code editor and go to cartgeneral checkout and change the translation.

3. You can add a second menu to the footer by opening the theme customiser, expanding Footer on the left, and adding a new menu block.

4. Having an expanding footer requires quite a lot of custom coding. Let me know if you'd like me to look into this for you.

Hope that helps!

Laura | UK Shopify Partner & Theme Developer at Fizzy Pixel

- Was my reply helpful? Please Like and Accept as Solution.

- Looking for more help? Email me at laura@fizzypixel.co.uk or visit our website.

0 Likes
GemPages_Agents
Shopify Partner
43 9 32

Hi @coco44 

Hope you are doing great! It's GemPages team here to assist you!

1. About button style: You can add the following custom codes to theme.liquid file

- Add this  style code before </body>

 

<style>
.btn{
font-size: 13px!important;
    text-transform: uppercase!important;
    padding-top: 10px!important;
    padding-bottom: 10px!important;
    padding-left: 35px!important;
    padding-right: 35px!important;
    border-radius: 0!important;
    background-color: #0f0f0f!important;
    font-family: Poppins!important;
}
</style>

 

- Add this font code before </head>

 

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet">

 

Kindly give it a try and let us know if it works for you. 

In case you need further support on applying those codes, feel free to contact us via email (support@gempages.help) or live chat.

2-3-4. These are parts of the theme which are required lots of custom coding. In this case, in order to avoid any conflicts, it's recommended to contact with the theme support so they can get these handled properly for you. 

Hope the information helps.

If you find my reply helpful, please hit Like and Mark as Solution
Join the waitlist to enjoy exclusive offers once we're back on Shopify at https://gmpg.link/reborn
Get connected: Website | Youtube | Community | Partners | Help Center
0 Likes
coco44
Tourist
20 1 4

Hello @laurafizzypixel 
Thanks a lot for the quick answer.

1- I have added the code at the end of the layout/theme.liquid file. But not sure that something happened.
Do I need to do something else to implement it and change the size if necessary?


2- Issue here is that it will also change the colour of my header and footer and I do not want that.
So I was thinking to change the colour of my header and footer? Is there a way to do that?


*For the issue with the button/background issue, where do I need to add the code with the padding bottom 50 px?

*Checkout is fixed OK

3- Second menu fixed OK

4- It would be awesome if you can help me doing a expanding footer

5- Also I have another question. I was trying to set up the sticky header without the announcement bar. I found an article here about that: https://community.shopify.com/c/Shopify-Design/Sticky-Fixed-Header-and-Navigation-for-Debut-Theme/td...

Issue is that I do not have theme.scss.liquid file so I can not set up this method. Do you have another alternative?

Have a great day,
Corto

0 Likes

Also add this CSS code to fix the font issue:

* {
    font-family: "Poppins"!important;
}

You should add the above code and the other CSS code I shared in the assets/theme.css file at the bottom.

Add this CSS to the same file to solve the header colour issue:

.site-header__mobile-nav, .site-header {
    background-color: #fff;
}

If you want to discuss items 4 and 5 further, please send me a private message.

 

Laura | UK Shopify Partner & Theme Developer at Fizzy Pixel

- Was my reply helpful? Please Like and Accept as Solution.

- Looking for more help? Email me at laura@fizzypixel.co.uk or visit our website.

0 Likes
coco44
Tourist
20 1 4

Hello @laurafizzypixel,

Thanks but this is not very clear.

1- Fo the font, first I need to put this code on layout/theme.liquid file

Correct?

<link data-instant-track="" class="gf_fonts" data-fonts="Poppins" href="//fonts.googleapis.com/css?family=Poppins" rel="stylesheet" type="text/css">

Then put this code on assets/theme.css

Correct?

 

* {
    font-family: "Poppins"!important;
}

 

 2- For the cart page, where should I put this code to add the space?

.cart__footer {
   padding-bottom: 50px;
}

3- Just another quick question for my footer I put it in black so I would like to know how to do the contour in white for my SUBSCRIBE button? I only want to do that for this button. Exactly like here:

coco44_0-1626728973991.png

4- Also do you know how can I add this line on the footer and change the colour? I would like to put a white line

coco44_1-1626729227666.png

5- And to finish how can I change the copy here on the footer © 2021, Ypsohealth

coco44_2-1626729267373.png

I will contact you later for the menu and sticky header.

Thank you so much, 

Corto

0 Likes
coco44
Tourist
20 1 4

Hello @laurafizzypixel,

Any news on that please?

All my best,

Corto

0 Likes