How can I modify button transparency and navigation on my website?

Store Design
1

Dear Shopify Community, I need some help with the design of my Shopify store.

  1. The buttons on the website are transparent except for the one that is chosen right now and the Buy Button. I need both to be transparent too. The text should be white.

  2. On the checkout page the express checkout button is not visible. I can’t figure out how to change it.

  3. You can only go to the product page if you click on ‘view details’, I want to ask if there is an option to go to the product page straight from clicking on the name of the product or the image.

Thank you in advance

https://6c3063.myshopify.com/

2

hello there

To make the buttons transparent and the text white, you can add the following CSS code to your theme’s stylesheet:

button, .btn {
  background-color: transparent;
  color: white;
  border: 1px solid white;
}

button.active, .btn.active {
  background-color: white;
  color: black;
  border: 1px solid white;
}

This code sets the background color of all buttons and the “Buy” button to transparent and the text color to white. It also sets the border to 1px white. The code also sets the active state of the button to have a white background and black text.

  1. To make the express checkout button visible on the checkout page, you should check if it is enabled in your Shopify Payments settings. Go to the “Settings” page in your Shopify admin, then select “Payment providers”. Find Shopify Payments, then click “Manage” and check if the “Express checkout” option is enabled. If it is already enabled, try clearing your browser cache and reloading the checkout page to see if the button appears.

  2. To allow customers to go to the product page by clicking on the product name or image, you can add a link to the product page in the code that displays the name and image. You can do this by wrapping the name and image code in an anchor tag that links to the product page URL. Here is an example of how to do this:


  ## {{ product.title }}

This code wraps the product name and image in an anchor tag that links to the product page URL.