Do you need to add content from another provider, for example, embedding a Google calendar or donation form? It is possible to embed third-party widgets and code using the HTML widget. Common examples include form builder platforms that provide a code snippet to embed a form on a website or calendar applications like Google Calendar.
Before proceeding, please note the following:
- Use of third-party code is self-serve and at your own risk.
- It is highly recommended you create a hidden draft page to first test your content.
- It is advisable to republish your site prior to embedding content as republishing a site creates a backup which can be used to restore your site.
- Be advised this is an advanced feature and topic, only users with some knowledge of HTML, CSS, and or Javascript should attempt to embed coding from a third-party.
- Rediker does not guarantee that all third-party widgets or code will work on the RediSite platform.
- Rediker is not responsible for fixing, updating, editing, or troubleshooting third-party widgets or code.
- Rediker is not responsible for the security of or impact said third-party code may have on your website,
- Some widgets or codes require multiple parts/steps to make it work, please check with your provider and follow their directions carefully.
- Not all code or widgets are supported due to performance, security issues, technical methods, outdated third-party code, and or may interfere with the website content management system.
- Not all third-party code is responsive or adaptive in nature and may not render correctly on all device sizes. Always preview the embedded content on mobile.
If you send the source code and directions from the provider to Rediker, we would be happy to test it and or place it on a page for you. Please email support@rediker.com with the directions and code supplied from the third-party provider. As noted above we do not guarantee it will work, nor are we responsible for correcting, editing, or updating the code provided. Any issues with the code would need to be resolved with the provider of that code. Believe it or not, some code from third-party vendors is just not done correctly and it may be best not to use it.
Embedding Code on RediSite
To embed third-party coding, you can use the standard HTML widget provided in the editor. In the example below we will use a Google Calendar Embed code. Check with the provider for how to obtain embed code for their specific platform. Rediker is not responsible for obtaining third-party code.
- Copy the provided embed code from the provider/source.
In this example, we are copying a Google Calendar Embed Code
- On your website, in the Editor go to the page you want this third-party widget/code to appear
- Open the Widgets Menu, search for the HTML widget, then drag and drop it on the page where desired.
- Remove/Delete the default text.
- Paste the provided third-party code into the widget
- Click Update.
Note most embedded content will appear as soon as you click update. Though some content, you may have to close the Widget Editor and refresh the editor in the browser. Some content may require more than one piece of code to work.
- Review and Preview the content especially in mobile view
- Republish the site.
Additional Page Header HTML Code
Some embedded content requires multiple pieces of code working in tandem to correctly render. Providers of the code would have to specify in their directions if this is the case. If a second piece of code is needed in the SITE or PAGE header to work, you can use the following method:
- Open the Pages Panel
- Open the Page Settings for the page where the HTML widget and first piece of code have already been placed.
- Click the 3-dots next to the page name
- Choose Set Page Access (you can also go through, Page URL, and Edit Page SEO, as all 3 options take you to the same page of options.
- Scroll to the bottom of the options, at the bottom will be a section titled Header HTML
- As noted on the page, this text box provided is for custom HTML/JavaScript. If your third-party content provider requires a piece of code in the Head section of the site/page, this would be the place to put it.
- Once you paste in the custom code close the Pages/Options panel and if necessary, refresh the page with the HTML widget on it.
- The embedded code should be rendering now.
- Review and preview the content, including in mobile preview.
- Republish the website to view the embedded content on your live site
Code Issues/Modifications
It is very important to reiterate not all third-party content will work on all platforms. In some cases, it requires knowledge of coding to modify the provider's code. For example, not all provided code is responsive and may require modifications to render properly in mobile. For example, Google's Calendar embed code is provided with a standard width in pixels, changing the width to 100% makes the widget more responsive especially in mobile. Rediker is not responsible to correcting third-party code. Though in most cases we will make a simple best effort to assist.
Below is an example of how the original provided code rendered, note it went outside the given column or space. And it would be cut off on a mobile device
After changing/fixing the provided code, the content renders better in the space both in the editor and on mobile devices. In this case, modifying the width to be set as 100% allowed the embedded content to be more responsive.
