If a service gives you embed code (a short piece of code that shows its booking calendar, feed, chat button or form on your page), paste it into an HTML Snippet widget in the spot where you want it to appear. Code that has to be on every page, or that the service says goes in the page's "head", goes in Head/Footer Code instead.
Where to put the code
| The code is for | Put it in |
|---|---|
| Something visitors see in one place on a page: a booking calendar, a feed, a form, a map | An HTML Snippet widget on that page |
| One page, and the service says "paste in the head" or "before the closing body tag" | Inspector > Page Settings > Head/Footer Code: Head Code or Footer Code |
| Every page, such as visitor tracking, a chat bubble or a cookie notice | File > Edit Publishing Settings: Head Code or Footer Code |
Add code with the HTML Snippet widget
- In the other service, look for an option such as Embed, Share, Add to website or Install, and copy all of the code it gives you.
- In EverWeb, open the page, click the Widgets tab and drag HTML Snippet onto the page.
- Go to Inspector > Widget Settings, paste the code into the HTML Code box and click Apply.
- Leave Embed Option set to Auto. EverWeb then keeps the code in its own frame only if it might upset the rest of the page. Direct Embed puts the code straight into the page, and a mistake in it can affect other things on the page. External Frame always keeps it separate, but search engines may not read what's inside.
- Drag the widget to the size you need. If the content is cut off at the bottom, make it taller or tick Adjust height to content.
- Click Preview, then publish and test the published page.
Examples
- Booking (Calendly, a restaurant or class booking system): paste the service's "inline embed" code into an HTML Snippet. Or add a button and link it to your booking page with Link To set to An External Page. A link is the most reliable choice on phones. See How to link to another page, a website, an email address, a phone number, a PDF, or a section of a page.
- Google Calendar: in Google Calendar's settings for that calendar, find Integrate calendar and copy the Embed code. The calendar must be public for visitors to see events. An address ending in
.icsis a feed for calendar apps: it can't be shown on a web page. - Instagram, Facebook or other posts: the network's own embed code shows one post. To show your latest posts as a feed, you need a feed service that gives you embed code. See Add social media buttons and feeds (Facebook, Instagram, X, Pinterest) to your website.
Make it fit on a phone
- On a responsive page, put the HTML Snippet inside a Container and tick Full width in Inspector > Metrics. See Build a responsive page with Containers so it stacks neatly on a phone.
- If the code sets a fixed width, such as
width="800", the content stays that wide on a phone. Change it towidth="100%"if the service allows that, or ask the service for a responsive version.
Code from other companies
We can check that EverWeb publishes your code on the page. We can't write, change or troubleshoot code from other companies, so if it doesn't work, contact the company that gave it to you. Only use code from services you trust: code from an unknown source can add advertising or harmful scripts to your website.
Common problems
| What you see | What to do |
|---|---|
| Nothing shows in EverWeb, or in Preview | Some services only work on your real website address. Publish and test in a private browser window |
The service gave you a whole page, starting with <html>, <head> or <body> |
Ask the service for its embed code for an outside website, and paste only that |
| The rest of your page looks wrong after adding the code | Set Embed Option to External Frame, click Apply and preview again |
| The browser shows "Not secure", or the content is missing on your https:// site | Change any http:// addresses in the code to https://. See My site says 'Not Secure': how to get HTTPS (SSL) on your website |
| It worked before and is now blank | The service may have changed or retired that code. Get a fresh copy from them |