Gooru Tip - Maximize the video player and adjust video quality for optimal viewing!
Google Sites is an incredibly useful tool for companies using Google Apps, as you can personalize content, access, and more based on your users Google Apps logins, which means they don’t have to log in to a separate system just to access your company’s intranet, for example. This can lead to a higher rate of adoption and usage.
But editing Google Sites has always been seriously painful, the platform lacks many features of a true content management system. Google Sites took a big step forward recently by allowing native usage of CSS, javascript and jQuery. Previously, this could be done by uploading custom Google Gadgets, but this update makes the feature more obvious and easily accessible.
Check out the video for more details on using CSS, javascript and jQuery in Google Sites.
If you enjoyed this video, be sure to sign up for the Google Gooru Newsletter!
Loading ...
This is a great new feature in Google Sites — thanks for sharing. The previous method of finding a gadget to host your CSS/jQuery was awful. This is far more easy to use. Thanks Gooru!
Thanks for getting the word out on this feature. I was just about to write a custom Google gadget for a carousel when, at the last minute, found your video – cheers.
Great to hear!
Is there any way to customize\edit the sidebar area with custom CSS?
Dan,
I don’t believe so. I’ll continue to look into it and let you know if I find any new information.
I’m trying to stick my social media buttons in the top right corner using absolute positioning in an HTML box but the page title covers it up. Kinda some wasted space there to the right of the page title. to bad I can’t access it.
Here’s a test page the display the behavior
http://pro.d3mckee.com/html-test
Here’s the bit of code on the page.
The LEFT positioning works as expected but the TOP value, when set to a negative number renders for a few seconds then disappears behind the page title zone, even if the page has no title. It seems to get covered up when positioned outside of some invisible frame.
I’ve tried overflow:visable, z-index:99 and using negative MARGINS instead of nested relative/absolute position.
Dave
Hey Dave,
Personally I don’t think I have ever seen someone position a div in that top right area successfully…but I have a friend who’s a skilled Google Sites Designer and I’m going to check with him and see what he has to say. Hopefully will get back to you in the next couple of days.
Thanks,
Google Gooru
I think what you are trying to accomplish is not exactly possible with Google Sites, even with gadgets, html boxes, in-line CSS. There are those area that are unfortunately dead to code: header area and side margins.
Sometimes it is best to recognize limitations and create alternatives.
You know I’ve been trying to add this widget but it doesn’t seem to work. Got a wierd error.
Should I get rid of the type?
I can’t seem to see the HTML Box gadget from my menu, or is it only available on Google Apps and not the usual sites.google.com/site/ ? Thanks for sharing though…
Hey Anthony,
The HTML Box gadget is no longer on the main menu, but you can search for it in “more gadgets.” Once you open up the “more gadgets” section, click on “public” and search for “HTML Box.” It will be the second one that comes up on the list, after “try it editor gadget”. Let me know if you have any further questions.
Thanks,
Google Gooru
Yes, this made quite more easier for me. As I have my website running in google sites. I had to hunt for gadget just to embed a button. Now I can do it myself. I am not professional developer so this helped me a lot. Hope google sites will have more features like comments etc in future.
Yes, I agree. Google Sites has a lot of great features for people that manage web sites but are not necessarily professional developers. I’m glad you felt that this video helped and I appreciate the feedback.
Could anybody create a sites.google.com/site/… for me similar to another sites.google.com/site.. ?
I need its copy. I do not need its content.
I will replace the content myself with my own, that is not related to trans-that.com
I just like how it looks
$?
Vic
Vic,
I’d like to help you out, but I’m not exactly sure what you mean. If you could email me with more details of what you want to do, I will be able to assist you. My email is gooru@gooruvideos.com. Thanks.
-Google Gooru
I’m trying to put a audio player into an html box, but the editor takes the “controls” tag out of the audio element when it folds it in. Is there any way to get it to stop this or work around it?
Dan,
I’m sorry that you’re having this problem. I think I may be able to assist you further if you could e-mail me the code that you used (gooru@gooruvideos.com). There should be a way to insert an audio player without taking away the “controls” tag.
-Gooru
At first glance I thought the html box would enable me to insert a css snip that would slightly modify the layout of the general html content in a google site page. As it turns out this isn’t possible – all html box css, js and html is scoped to that html box and can’t affect anything outside of that box. Whilst this works for some things, the html box doesn’t help me with that should be a trivial customization to a web page . Simple css tweaks pages are not possible. Editing and customizing Google sites in any way outside of the WYSIWYG editor is still a major pain.
I’ve put a number of carousels on my site using html boxes from the example. They work fine in chrome, firefox, and internet explorer 9, but disappear in ie 8. Any suggestions?
Can you provide us with the code?
Hi there, i read your blog occasionally and i own a
similar one and i was just curious if you get a lot of spam feedback?
If so how do you reduce it, any plugin or anything you can suggest?
I get so much lately it’s driving me insane so any support is very much appreciated.
hi
It seems that jquery in the html box is not working anymore got google sites. Even the google example no longer works. It may be idea to update the video/ post.
Hi, does Google indexing the content of the HTML widget for search?
Sergey,
I’m not sure about that, I’ll have to look into it a little more.
Does your JQuery URL not work anymore?