Put "Quantity Selector" Next to "Add to Cart" Button in Impulse Theme

Solved
spencer123432
Tourist
4 0 3

Hey everyone!

 

I'm using the Impulse theme and trying to place the quantity selector on the same line as the add to cart button. Could anyone help with this? I've tried a few things but unfortunately, couldn't get this to work myself.

 

This is how it currently looks:

 

Screen Shot 2020-05-26 at 6.32.43 PM.png

 

 

 

 

 

 

Thank you!

Replies 60 (60)
KetanKumar
Shopify Partner
36503 3621 11766

@Cropsybd 

oh I see can you please try this similar code

<form method="post" action="/cart/add">
  <input type="hidden" name="id" value="{{ product.variants.first.id }}" />
  <input min="1" type="number" id="quantity" name="quantity" value="1"/>
  <input type="submit" value="Add to cart" class="btn" />
</form>

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
Cropsybd
Tourist
4 0 2
Can you please tell me where exactly I have to use this code? which file
and location within the file would be a great help.

Thanks again.

KetanKumar
Shopify Partner
36503 3621 11766

@Cropsybd 

this code add to your collection product cart, or product grid item or product girt etc maybe file snippets file 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
AudreyWatt
New Member
2 0 2

This looks amazing!

How did you get the Quantity above the box, in the smaller text.  This is mine and I'd love to lose the black quantity box and have the smaller qty selection box on the same line as add to cart.

Screenshot 2021-06-18 at 12.48.55 am.png

I'd love to have the + & - in the box too!

Thanks

Audrey

My store is in build mode, but here's a preview - https://f55gnw8g4si8d3xr-26536935529.shopifypreview.com/

KetanKumar
Shopify Partner
36503 3621 11766

@AudreyWatt 

i have check bt i can see can you please show me proper url so i will ck

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
Atzoy
Tourist
10 0 2

Hey KetanKumar, could I trouble you for the same thing as everyone else, I need to get the QTY and Add to cart in the same line, I´m Using the Brooklyn theme, the URL is www.rakunkids.cl

thank you so much

KetanKumar
Shopify Partner
36503 3621 11766

@Atzoy 

sorry for that issue 

your store is password protect 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
Atzoy
Tourist
10 0 2

Right, sorry for that the pass is "rowfeu", thank you!

Deoxes
Navigator
353 2 85

Hello, can you also help me with that quantity? I tried putting some codes from the forum but for me, nothing happens. My web dehome.co.uk and theme Impluse, thanks.

Tomoff
Tourist
6 0 5

Hey! Can you please help me because when I put the code this happens:Screenshot_4.png

KetanKumar
Shopify Partner
36503 3621 11766

@Tomoff 

sorry for that issue please share store URL.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
KetanKumar
Shopify Partner
36503 3621 11766

@Tomoff 

thanks for store url can you please confirm this look!

KetanKumar_0-1638829742258.png

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
Tomoff
Tourist
6 0 5

Perfect! Can you make it look like that? Thank you so much!

KetanKumar
Shopify Partner
36503 3621 11766

@Tomoff 

thanks for confirm please try this code

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.css ->paste below code at the bottom of the file.

@media only screen and (min-width: 769px){
.product-single__form .add-to-cart {
    margin-top: -80px;
    margin-left: 120px;
    width: calc(100% - 120px);
}
}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
KetanKumar
Shopify Partner
36503 3621 11766

@Tomoff 

its my pleasure to help us 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
topdogracing
New Member
3 0 0

Does anyone have a code to put the qty selector next to the add to cart button in supply theme? 

KetanKumar
Shopify Partner
36503 3621 11766

@topdogracing 

yes, please share store url 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
topdogracing
New Member
3 0 0

Cascade Innovations ~ Customize Supply ~ Shopify (cascade-innovations.myshopify.com) this is the supply theme. I don't currently have it published but I can do so if needed.