Clear search
Close search
Google apps
Main menu

Insert custom HTML, CSS, and Javascript

Use the HTML Box tool to customize the appearance of your site.

With the HTML Box tool, you can add HTML, CSS and Javascript into a Google Sites page. The tool lets you add functional CSS and Javascript to customize the look and feel of your Google Site. For example, you could create image carousels, custom menus, submission forms and jQuery-based widgets.

This tool is different than using the HTML button in the toolbar when you’re editing a page, as the HTML button allows you to make small edits to HTML and inline CSS, but it doesn't allow you to write custom Javascript.

Insert custom HTML, CSS and Javascript

  1. Go to the Google Sites page that you’d like to embed HTML in.
  2. Go to the Insert menu and select HTML Box.
  3. In the dialog that opens, add HTML, CSS and/or Javascript code.
  4. When you’re done, click Save.
  5. To preview your embedded HTML, click Save on the Google Site page.

Tips for writing HTML with the HTML Box tool

  • To make sure that your code is error free, we’ll show you errors underlined in red as you type.
  • You can reference any public image on the Internet in your HTML embed. Keep Google program policies and copyright laws in mind whenever you reference a public image.
  • Code from one HTML box can’t interact with or refer to code outside of the HTML box, including other HTML boxes. This mean you can not include external javascript files, except jQuery files hosted at

Unsupported features

The HTML Box tool currently doesn't support the following features:

  • iframes
  • JavaScript code can't create any script, image or link tags
  • Document/window onload and onready functions. You can place any JavaScript at the end of code that needs to load after the document loads.
Was this article helpful?
How can we improve it?