Widget or Form Integration With Google Sites | Community
Skip to main content

Widget or Form Integration With Google Sites

  • July 1, 2016
  • 5 replies
  • 0 views
N

Hey there, 

I was referred here by one of your techs, Elliott B. I would love to incorporate Zendesk with my company's Google Sites website. Currently due to Google Sites constraints I cannot integrate the widget. If possible it would be awesome to be able to integrate Zendesk in the form of a widget or simple form on our site for our end users to create tickets on the fly.

If there is no way to integrate a widget, I would love to have a way for our end users to be able to simply fill out a form through our internal Google Sites website which would create a ticket in Zendesk. This would give our users the option to either go to our Zendesk portal and create a ticket, or create a ticket through our Google Sites website which they use on a daily basis, saving them time.


This is what the Zendesk tech said about integration.

"Since Google Sites does not give users access to the Document Head element of the webpage, and because it restricts the tags and set of JavaScript commands that can be used on a website, the Zendesk web widget cannot be embedded into it. Unfortunately, the web widget only functions on sites where you have greater access to the html document and greater control over the code."

Thanks

    This topic has been closed for replies.

    5 replies

    E
    • Erica19
    • July 13, 2016

    Thanks for letting us know about your use case Nathan. I was doing some research and I think I saw that you have now gotten the Web Widget to work in your Google Sites account, is that right? 

    Terence14
    • Terence14
    • July 12, 2017

    Nathan (or Erica!)

    Did you ever get an answer to this?  We have the same issue.

    E
    • Erica19
    • July 13, 2017

    @terence I believe this is a Google Sites implementation issue because I believe it is possible. See, for example, these docs.

    Terence14
    • Terence14
    • July 15, 2017

    @erica

    Your link doesn't, unfortunately, address the quote that Nathan provided, particularly around the removal of tags, limitation of iFrame etc.:


    "Since Google Sites does not give users access to the Document Head element of the webpage, and because it restricts the tags and set of JavaScript commands that can be used on a website, the Zendesk web widget cannot be embedded into it. Unfortunately, the web widget only functions on sites where you have greater access to the html document and greater control over the code."

    In fact, it is outlined in the article you linked:

    "Features that don’t work with the HTML box

    You can’t use the HTML box to add:

    • iframes
    • Script, image, or link tags created by JavaScript code
    • Document or window onload and onready functions. You can add JavaScript at the end of code that needs to load after the document."
    Terence14
    • Terence14
    • July 16, 2017

    Hey everyone, so it appears I found a solution but there's definitely formatting issues, and you'll need a place to host a HTML file that can be directly referenced.

    Required:

    1. A plain-text editor (I used Notepad on Windows)
    2. For the html file to be referenced directly, you'll need a host. I used GitHub to host and RawGit to get the URL to reference
    3. Your Widget Script, which will look something like:
     <!-- Start of YOUR Zendesk Widget script -->
     <script>/*<![CDATA[*/window.zEmbed||function(e,t){var n,o,d,i,s,a=[],r=document.createElement("iframe");window.zEmbed=function(){a.push(arguments)},window.zE=window.zE||window.zEmbed,r.src="javascript:false",r.title="",r.role="presentation",(r.frameElement||r).style.cssText="display: none",d=document.getElementsByTagName("script"),d=d[d.length-1],d.parentNode.insertBefore(r,d),i=r.contentWindow,s=i.document;try{o=s}catch(e){n=document.domain,r.src='javascript:var d=document.open();d.domain="'+n+'";void(0);',o=s}o.open()._l=function(){var e=this.createElement("script");n&&(this.domain=n),e.id="js-iframe-async",e.src="https://assets.zendesk.com/embeddable_framework/main.js",this.t=+new Date,this.zendeskHost="YOURDOMAIN.zendesk.com",this.zEQueue=a,this.body.appendChild(e)},o.write('<body onload="document._l();">'),o.close()}();
     /*]]>*/</script>
     <!-- End of YOUR Zendesk Widget script -->

    Steps

    1. Copy your Zendesk Widget code to the clipboard

    2. Open your plain-text editor, and type the following:

      <html>
      <head>

      PASTE YOUR ZENDESK WIDGET CODE HERE

      </head>
      </html
    3. Save the file as yourzendeskwidgetname.html
    4. Upload yourzendeskwidgetname.html to your host (e.g. GitHub)  Note:  Make sure this file is publicly accessible
    5. (Optional, if you used GitHub, copy the file address and paste in RawGit to get the Production URL.  Copy that Production URL)
    6. In Google Sites, click the button to edit your page.
    7. Choose "Insert > More Gadgets"
    8. In "Public" search for "Include gadget (iframe)" and select it
    9. Paste your production URL from step 5 into the "URL to content (required)" field
    10. Edit the display options accordingly (I used 350 width, 500 height, all boxes unchecked)
    11. Click "Ok" and edit your gadget properties accordingly (i.e. wrapping, alignment, etc.) then save your page

    Hope this is useful to anyone out there!

    Terms & ConditionsCookie settingsAccessibility statement