Hello @SpaceyTraceys ,
Sorry for making you feel confused. To develop and increase sales is a long process, without financial and experience, you just have to try it from the little single one to improve it day by day.
Customer experience is one of big factors affect your sales funnel. With bad customers experience, people will likely to leave your site and refuse to make any purchase. Coding is difficult but with basic codes, you can try to fix it a little bit.
So, to change the size of your price texts, you can try to follow these steps:
- Go to your Online store → Themes → Actions → Edit code → Assets
- Find and click on the file that controls the styling of your product page. This is typically called “theme.scss.liquid” or “style.scss.liquid”.
- Scroll down to find the section of the CSS that controls the price. This section will typically have a selector like “.price” or “.product-price”.
- Modify the font-size property to change the size of the price. For example, you could change it to “font-size: 24px;” to make the price larger, or “font-size: 14px;” to make it smaller.
- Save and preview
To make your “Add to cart” better, you can try to follow these suggestions:
1. Change the color: A simple way to make the “Add to Cart” button more visible is to change its color to something that stands out against the background. For example, if your store’s color scheme is primarily blue, you could change the button color to green or orange.
To change the color, you can modify the button’s CSS in your theme. Locate the button’s CSS selector (often “.btn” or “.product-form__cart-submit”) and add a “background-color” property with the color you want to use. For example, you could add:
background-color: #ff6600;
Note: the color I added here only for example, you can change it to the color you want
2. Increase the size: Another way to make the “Add to Cart” button more visible is to increase its size. This can help it stand out more on the page and make it easier to click.
To increase the size, you can modify the button’s CSS in your theme. Locate the button’s CSS selector and add a “font-size” property with a larger size. For example, you could add:
font-size: 18px;
3. Add a hover effect: Adding a hover effect to the “Add to Cart” button can make it more interactive and engaging for users. For example, you could change the button’s color or add an animation when the user hovers over it.
To add a hover effect, you can modify the button’s CSS in your theme. Locate the button’s CSS selector and add a “:hover” pseudo-class with the effect you want to use. For example, you could add:
background-color: #ff3300;
You can find more tutorial video on youtube, here’s one: https://youtu.be/JqtvmzHnO9I
Hope these can help you. Let us know if you have any further questions, we’d appreciate a lot if you could hit the Like button for us.
Regards,
AliReviews team.
