Google Sites offers some basic formatting options. What if you want your Google Site to not look like a Google Site? The answer: CSS. We like headings in a site to draw attention to different sections of content. The most commonly used formatting option are Heading tags: <H1>, <H2>, etc. Use these and you'll get something like this:
What if you want some color or something more stylized? Then you'll need to get a little nerdy and edit the HTML. We can use some basic CSS styles to spruce up our site. In this case I'm using inline CSS on <div> tags to get what I want.
Overview
Now you have a nice bar for each heading. Change the background-color attribute to change the style a bit. Notice the border-radius attribute which makes it all a little less boxy. Without this our ends would be squared off. CSS has some pretty amazing style attributes. These are now supported by all modern browsers. Drop shadows are possible. However Google Sites will strip out some styles if you simply edit the <HTML>. There is, however, an HTML Box gadget that allows you to use more CSS as well as Javascript (which gets REALLY nerdy). It's pretty easy to do with a few tweaks to the code.
Try this....
Bob's your uncle! Now you have some style that makes your site not look like a Google Site.
| Connect & Share
|