Add button to header login

Store Design
, , , , , ,
1

Hi,

I want to add a button that says Login to my header instead of the cart on the homepage

just a 1px outline black button.

236A857F-3EE7-4DCB-BF29-9A2274519516.jpeg
236A857F-3EE7-4DCB-BF29-9A2274519516.jpeg1170×2532 135 KB

my site is https://lux360.net

2

Hi @Luxluxlux360

To add a black, 1px outlined “Login” button in place of the cart icon on your homepage header in Shopify, follow these steps:

  1. Go to Online Store > Themes in your Shopify admin, and select Edit code.
  2. Open the header.liquid file in your theme.
  3. Find the code for the cart icon, usually located within or tags.
  4. Replace it with this code for the “Login” button:

Login

  1. Save changes and refresh your homepage to view the button.

If you have other questions, I am willing to answer them more.

Best regards,

Daisy
3

<a href=“{{ routes.cart_url }}”

class=“navlink navlink–cart”

data-drawer-toggle=“drawer-cart”>

{% if section.settings.use_icons %}

{{ cart_icon }}

{{ ‘layout.cart.title’ | t }}

{{ cart_status }}

{% else %}

{{ ‘layout.cart.title’ | t }}

{{ cart_status }}

{% endif %}

this is my code. Can you let me know what to replace thank you

4

Any colitis for this?

5

Hi @Luxluxlux360

Based on your provided code, if you need to replace the href attribute with a specific cart URL, you can substitute {{ routes.cart_url }} with your actual cart URL. Here’s how you can do it:

Modified Code with Specific Cart URL:

<a href=“https://yourwebsite.com/cart”

class=“navlink navlink–cart”

data-drawer-toggle=“drawer-cart”>

{% if section.settings.use_icons %}

{{ cart_icon }}

{{ ‘layout.cart.title’ | t }}

{{ cart_status }}

{% else %}

{{ ‘layout.cart.title’ | t }}

{{ cart_status }}

{% endif %}

**Steps to Replace:**1. Identify Your Cart URL: Determine the exact URL of your cart page. For example, https://yourwebsite.com/cart.

  1. Replace the Placeholder: Substitute {{ routes.cart_url }} with your actual cart URL within the href attribute.
  2. Verify Functionality: After making the change, ensure that the cart link correctly navigates to your cart page.

Example Replacement:

If your cart URL is https://example.com/cart, update the href like this:

<a href=“https://example.com/cart”

class=“navlink navlink–cart”

data-drawer-toggle=“drawer-cart”>

Additional Tips:- Dynamic URLs: If you’re using a platform that supports dynamic URLs (like Shopify with Liquid), ensure that replacing {{ routes.cart_url }} with a hardcoded URL won’t disrupt other functionalities.

Testing: Always test the updated link to confirm it directs users to the correct cart page without issues.