How to embed Google Docs into Joomla 2.5 and Joomla 3.0

Google Docs is a popular service for managing documents online. In few steps you can easily embed your Google Docs spreadsheets, documents, forms, and presentations into your Joomla 2.5 or Joomla 3.0 website – with no Flash or PDF browser plug-ins require.

Step 1: Google Document must have public status

Before you share a Google Docs file, please make sure that it’s not private. If it is, you’ll be the only one who can see it. If your Google Docs file is private, click the Share link at the top of the screen to make it public.

Step 2: Choose a right method

Publishing allows you to make your Google Docs available to the whole world. Once you publish your document, spreadsheet, presentation, or drawing to a webpage, you get a URL that you can share with anyone you choose. Your doc will be accessible from this URL until you either delete your doc or choose to stop publishing them. You can also use iframe in order to embed the URL above. You can set the parameters such as width, length and frame border to suit your Joomla page.  Copy the embed code from the box. Now visit your Joomla Article in edit mode and click over to HTML tab. Select the area where you would like the form to display and paste in the code.

Second method, by using Embed Google Docs Viewer (http://joomlacode.org/gf/project/google_docs_vw/) is a plugin for embedding one or more Google Docs Viewers to  both Joomla 2.5 & Joomla 3.0 articles. This plugin seeks to provide this functionality without using an <iframe>. Adding the viewer to an article is very simple, just add the url of the document that you want to embed, and that’s it! It’s also possible to define the size of the document, border width and link to the full size document. Supported formats are: .doc, .ppt, .xls, .tif and .pdf.

Syntax

After you have installed & publish the plugin, go to the article edit form on your Joomla web site and type the following where you want your document to appear:

{google_docs}document_url{/google_docs}
{google_docs}document_url|width:200|height:200|border:1{/google_docs}
{google_docs}document_url|width:200|height:200|link:yes|link_label:Label{/google_docs}
{google_docs}document_url|link:yes{/google_docs}

Example

Replace the “document_url” string with the url of the document that you want to view.

FAQ

If your file requires a login to view – such as being saved in a password-protected directory, or behind a firewall (on your intranet, etc.), the viewer will probably not be able to access the file. This is what is meant above, that the document should be “publicly available.”

In the admin panel it’s possible to define a base URL for the documents, which makes embedding the documents even easier as there’s no need to type in the full URL for each document.