New Website

Change is inevitable, and it seems that the main ASME organization thought that it would be better to force a bit of it upon us. They have removed each section's hosting space in lieu of the current "groups" function. I do have to say that the current setup most likely does provide more sections with a baseline site since not all were able to utilize a full website. However, in our case, a full site suites us just fine :-) .

I would like to welcome you to the new and improved website of the St. Louis Section of ASME. Although some of the content still needs to be populated, and we need to go forward with the domain purchase, but there is little left to be finished. This does not mean that I will ignore feature requests or in any other way, allow this site to become stagnant to the best of my abilities. On that point, I am not a website designer, nor am I fully fluent in any web language. I know the basics along with a few odd-ball functions that I find useful, but mostly, I'm not afraid to look through reference material and find something new.

So, if you need a website for your section or organization, this site is a proof of concept that a decent looking site can be put together for free (other than the option domain name; sub-domains are still free) and still allow the owner to avoid editing code each time that they would like to make an update. There are definitely cleaner ways to do some things, but cost is the first priority in this project. I will not outline each exact step, but I will try to give an overview for anyone that would like to set up something similar.

All readers not looking to setup their own site need not read further

The lesson here: Google is great.

I am utilizing as many Google services as I please to keep access down to only one set of credentials so that any board member/owner can see everything with one login. Which means that the Google Dashboard is very important.

Google services used:
Drive - The site is entirely hosted on Google Drive (via Gweb.io - more on that later) along with the archives
Analytics - This tracks anonymous visitor statistics (use the "Classic" set of code)
Blogger - We have two blogs, this News one and the Past Events one. This allows content updates without needing to embed the material directly in the page(s). Now to do this, we need some way for the content to be viewed on the page(s) that they are intended. Enter Google Gadgets, and in particular, the one that I chose for the main blog page, this RSS Feed Reader. I also liked a "title only" version that could be placed on the homepage. Each blog that you create will have a line that looks like "Subscribe to: Posts (Atom)" at the bottom of the page in View mode. Copy the link provided by this line and use it in the gadget, and then paste the generated code into your page's body. Rinse and repeat for each blog that you would like.
Calendar - There are many settings available to embed the included calendar onto a site. As you can see, we have two versions utilized here: the small list format on the homepage and the full month view on its dedicated page. The only tip here is to ensure that the calendar in question is set to "Public" before attempting.
Contacts - This on it's own isn't much for a website tool, but combine it with GMailingList.com and you now have your own listserv available to send out newsletter, updates, etc.
Gmail - With Gweb.io's documentation, the address that Gweb gets from your account can be utilized as part of a "Contact Us" box like the one on our own "Contact" page. This will also be the address used when registering a domain.
Picasa - This service is currently in the process of being phased out and replaced with Google+, but at the moment, G+ doesn't provide any code to embed the photos or albums just yet. Thankfully, they are leaving the web portion of Picasa available for the time being. This is mostly used for all of the photos of past events. Once an album is created and populated, a slide-show can be embedded into a blog along with any description that you would like to be shown via the gadget that we covered earlier.

Non-Google services:
GWeb.io - Basically, this great little service can turn any folder on your Drive account into a website complete with either a sub-domain (example.gweb.io) or a custom one. Just pick the folder that you need, and assign it an address. This does mean something important though. There are no server-side services running. No PHP, python, MySQL, etc. You are stuck with client-side languages such as HTML/CSS, HTML5, Flash, Java, etc.
GMailingList.com - This is a very simple service that attaches to a specific group of contacts on your account to manage your mailing list. As the site instructs, the group needs to be created through their site to work fully. Once someone signs up their e-mail address from your site, they are sent a confirmation e-mail with a verification link and instructions on how to unsubscribe. When you would like to sent out a message, be sure to send it to that group and all of your recipients will receive it. NOTE: Gmail has a limit of 500 messages per day from their web interface (less via POP or IMAP).

Now that you've READ through all of that, what good does it do if you don't have anywhere to put all that embedded code? Not much. So you need a template, and since I am assuming that you don't want to/can't create your own, here is the gallery that I got this one from: TemplateMo.com
These are all CSS based templates that usually add a bit of Flash animation for style.

And there you have it. You may have to get a bit dirty in the code for the initial setup, but it requires much more patience and perseverance than skill. And this way, the only recurring cost it to renew your domain every 10 years. If you have any questions, please feel free to send me an e-mail at ASME.StLouis@gmail.com.

Brad Tissi, EIT
ASME, St. Louis Webmaster