Help with custom code snippet

Design help Custom code
1

Hi Webflow people -
Built a site for a friend who owns a deli in NYC.
Share link here: Webflow - Getting-Hungry

we were having trouble with a seamless link in the top marquee. My wife tried to fix it… I believe she added a code snippet that she received from seamless that they called a “button”. She says she added it to the black marquee area. (note: black marquee should be directly below the top brown mini nav.

Now… we have a weird extra seamless button locking to top left corner of page that behaves all wonky and pushes the marquee down - and I have no way of eliminating it. Believe me - I’ve tried MANY things.

screenshot attached. The think I want to remove is the seamless button that in the very top left corner.

Any help would be greatly appreciated. Thanks.

2546×1250 1.59 MB

2

Hi @scottbarbey, thanks for reaching out about this custom code snippet.

The issue is that the custom code that is running to generate the button is placed in the head of the site in project settings, and so when the page is generated on publish, the button is affixing itself at runtime to the top left corner of the Body.

If you wish to simply remove the button, then remove the code in the Head of the site. Save changes and republish the site for changes to take effect.

If you need the button on the page, but in a different location, then instead of pasting the snippet code into the head of the site, use an embed widget instead and place it somewhere on your page.

For example, see the screenshot where I have the embed, in the middle column within the marquee symbol:

1170×545 266 KB

For the embed, select that and double click or edit from the settings panel and paste in the button code:

<div class="gh-button-ifrm" data-customer-id="292975" data-restaurant-name="Restaurant" data-button-type="branded" data-button-color="red" data-button-size="large" data-env="prod" data-url="getting-hungry-225-varick-st-new-york-" data-tracking-id="19538" data-restaurant-address="225 Varick St, New York NY, 10014" data-version="1.0" data-link-type="sml"></div><script src="https://gh-prod-nitrosites.s3.amazonaws.com/scripts/iframeLib.min.js"></script>

This code above will run when the page is published. The result before any other styling is done is for the button to be aligned to the left, in the center column:

1051×310 99.6 KB

Looking at the image on the published site, I can see the image width that seamless is sending is 187px. So, given that info, we can set the width of the embed to be 187px, with a left and right margin set to auto:

1249×496 283 KB

And when published looks like this for me:

943×261 58.5 KB

Play around with the positioning and the styling and put it on some different part of the page, or perhaps create a fixed div to always show that button, but maybe in bottom right instead of at the top of the page.

The key here is to use the Embed widget for the code snippet.

I hope this helps!

3

As always - thanks Dave!

Scott B.

4

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.