Jump to content

Add and position buttons to product item section

Recommended Posts

Site URL: https://www.raretestudios.com/shop

Hi there, 

I need several buttons in all product item sections.

> next/previous (top right corner)
> size guide (next to size selector)
> Inquire or schedule viewing (underneath add to cart button) 

I have already installed the lightbox plugin and added size guide text link in text description.

1. Can you help me to turn "Inquire or schedule viewing" in button

2. And to position all the above links/buttons where I would like them to be?

Site is currently locked. Password: September2022

Any help is highly appreciated. 

Mockup_Button_positions.png

Link to comment
  • Replies 1
  • Views 272
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

#1. There is no automatic way to add Previuos/Next

You can add Text Block >> add previous/next on all products > Then I will give code to move it top screenshot position

#2. Add to Code Injection > Footer

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
  $(document).ready(function() { 
		$('div.ProductItem-details-excerpt [href*="size-guide"]').appendTo('.variant-option:nth-child(2) .variant-option-title');
	});
</script>
<style>
  .variant-option-title a {
    float: right;
}
</style>

#3. You want to move button in Additional Info to current Add to cart position?

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.