Jump to content

Adding Resy Button onto Navigation Bar

Recommended Posts

Hello there,

Has anybody implemented a resy widget before? Is there a way to have the widget live on the nav bar? 

I have it install below the carousel  https://www.nyumbai.com/ but would love to house it on the nav bar. 

I believe there's some way by installing scripts and tagging an anchor tag to link on the nav bar, but have yet to figure out what the code is. 

Thank you in advance!

 

Link to comment
  • Replies 7
  • Created
  • Last Reply

Hi @aaninetythree! I've done this before by adding a Link (under Other in the popup) to the nav bar. You'd paste in your code where it says https://example.com and call the link title something like Resy. You can't see the code after you save it, but it has always worked for me.  Good luck!

Link to comment

I just updated my template, and now my widget isn't even working on my page correctly.  I get this when you first navigate to my page, it shows the first attachment.  But it needs to show the widget, as in the second attachment.  

Squarespace can't help me because it's custom code?  

 

resy1.PNG

resy2.PNG

Link to comment

You need to include the full code, including the first line. This is what should go in the LINK area for your Resy button:

<a href="https://resy.com/cities/sf/nyum-bai" id="resyButton-lYhGuXY0mf">Book your NYUM BAI reservation on Resy</a>
<script src="https://widgets.resy.com/embed.js"></script>
<script>
    resyWidget.addButton(document.getElementById('resyButton-lYhGuXY0mf'), {"venueId":9633,"apiKey":"2DLr8n3maylI5Gq4xA2kWUNi6e3IPPcf","replace":true,});
</script>

 

Link to comment

I wonder if you have other code preventing it from working?  Here's how it works for me. I demo it on a page first, then put it in the nav: https://www.loom.com/share/5c45361a872b4a3dae29bdecfc15bea9

 

 

Link to comment

Archived

This topic is now archived and is closed to further replies.

×
×
  • 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.