Creating Your own Section Website
- 1. Section Websites 101 How to create and manage your own. Standards Certification Education & Training Publishing Conferences & Exhibits May 2, 2009 Jeff Gamber, St Louis Section
- 2. Section Websites 101 We will cover the basics of creating and managing a Section Website based upon lessons learned during the process of recreating the St Louis Section website. This presentation was developed with the intent of teaching attendees to create a data-driven website and learn from our mistakes.
- 3. Section Websites 101 Defining your Dream for Your Section website. What is the end goal for your website? The St. Louis Section’s end goals were (and still are) defined as: – To serve our membership with the most up to date information and services we can provide them. – To have the best Section website within ISA. Lofty?...
- 4. Section Websites 101 Defining your Dream for the Site. Maybe. Without goals, there is nothing to measure progress against. – As result of setting goals for our site, we have experienced a marked growth in monthly meeting attendance, steady growth, and offer services that are important to our membership. – Having goals also helps determine whether or not you act on potential changes. They quite simply have to meet the criteria of your goals.
- 5. Section Websites 101 Defining your Dream for the Site. • How do you plan to reach your end goal? – Who will help plan it? – Who will create it? – What will your domain be called? – Is that domain available for purchase? – Who will host it? – Who will manage content for it? – Who will maintain it? – Has there been a budget set aside for Website development?
- 6. Section Websites 101 Defining your Dream for the Site. Setting End Goals I knew from the start that the goal would be to make the St. Louis site the best. When St. Louis recreated its site, we asked ourselves what we had to do to meet our end goal. The answer... RESEARCH!
- 7. Section Websites 101 Defining your Dream for the Site. Setting End Goals: Research If we were to become the best Section Site in ISA, we first had to find out what other Sections were doing, good or bad. In the end, this exercise helped define both the structure and content of our site. It provided information on how Sections used their Sites, ideas for improvement, and helped prime the creative pump for new concepts.
- 8. Section Websites 101 Defining your Dream for the Site. Setting End Goals: Research – Organize your thoughts by committing your ideas to paper. – Reference where you got your ideas, who you saw that did what you want to do well. Why recreate the wheel if you don’t have to. – Call the Webmaster for the site that best represents the concept you want to emulate. Their help might just save you substantial effort and time.
- 9. Section Websites 101 Creating your site. The first task at hand will be to obtain a Domain Name. Some good online sites to acquire a Domain Name are: http://www.godaddy.com http://www.domainbank.com http://www.directnic.com Or… From the company you will choose to Host your Website.
- 10. Section Websites 101 Creating your site. Choosing a Domain Name. – The choice of a Domain Name is essential. The Domain Name of a site should be its most important keyword (the thing that search engines search by. – Your Domain Name should be Keyword Rich, Descriptive, and Helpful. – Don’t make it too long, or complicated.
- 11. Section Websites 101 Creating your site. Choosing a Domain Name. – Be wise about what your Domain Name states. – DO NOT buy a Domain Name too similar to another website. – Protect your Domain Name. • Your Section Domain Name will have an .org extension. • Always buy the .com, .net. .biz extensions as well. • Keep an eye on DNS restrictions as well (Can someone access your site if they do not type the www. In front of your Domain Name?).
- 13. Section Websites 101 Creating your site. – IT IS VERY IMPORTANT that wherever you choose to create an account and purchase your domain name, make sure you do so in your section's name, and not an individual's name. You also want to keep this information in a place that will be available to the future leadership of your section. Since we are all volunteers, it's easy to misplace this information. You need to make a point to make it available to members as the baton gets handed from person to person. – DON’T BE AN IDIOT!!!
- 17. Section Websites 101 Creating your site. Getting a Host Account. – This will be the place you will get your domain if you don't already have it, and Host your website. – There are thousands of Website Hosts to choose. Feel free to do a little research on your own, but based upon ours, I am going to narrow it down to 2 hosts: 1. Godaddy.com - For a building a Simple Informational Website with SiteBuilder AND Data-Driven Websites – in this instance Joomla 1.5. 2. Siteground.com - For a building a Simple Informational Website with SiteBuilder AND Data-Driven Websites – in this instance Joomla 1.5
- 19. Section Websites 101 Some of you may be asking, "What is Joomla?" Joomla is one of the most powerful Open Source Content Management Systems on the planet. It's used all over the world for everything from simple websites to complex corporate applications. Joomla is easy to install, simple to manage, and reliable.“ Essentially, Joomla is data-driven. It relies on a host's MySQL database to store and retrieve information. Open Source means that developers all over the world have had a hand in developing this incredible web application. Content Management means that the site has a backend and a frontend. The frontend of course is what visitors see through their Browsers. The backend is the administrative area of the site. The main file coding that Joomla uses is PHP. This web application is available FREE. Joomla developers all over the world have also developed Extensions in the form of Components, Plugins, Modules, and Templates which are also available - Free. A very small percentage are not free, but usually priced under $50, and well worth it for the powerful capability of that particular "add on."
- 31. Section Websites 101 Leave Blank
- 65. Section Websites 101 Site Maintenance – Lets face it…Stuff Happens! – Your fault, Someone Else’s fault, Nobody’s fault. If something happens, can you fix it? If you can…Great! If not, you will need somebody who can! – During our short existence on the Web, our well-meaning webmaster (who shall remain nameless to protect the ‘Innocent’) has inadvertently changed behind the scenes code… – Software has had glitches that had to be debugged… – and…The unthinkable… – We were HACKED by someone that had nothing better to do with their time than to make our lives and our member’s experiences with our site miserable. – All of these events were beyond our ability to repair.
- 66. Section Websites 101 Site Maintenance Who will maintain your site? Mistakes need to be corrected occasionally, even with the most experienced webmaster. Eventually something will stump them. Software needs to be purchased, installed, and periodically updated. Templates need to be implemented. Components and Modules need to be installed. Custom Graphics must be created (Unless you are a Photoshop whiz)…I am not! New technology needs to be explained for novices. Domains need to be re-registered.
- 67. Section Websites 101 Site Maintenance Who will maintain your site? Hosting needs to be paid for. Third Party software (i.e. PayPal and the like) need to be integrated. Security Patches need to be implemented. The site will require occasional optimization to keep it running smoothly. Site will need to be optimized for search engines to ensure that you see maximum traffic on your site.
- 68. Section Websites 101 Site Maintenance Budget for what you want to do! – Budgeting for web development is imperative if you want to create a website. Regardless of what avenue you take to develop yours, costs will be incurred. If you allocate money for Advertising and Marketing, consider using a portion of that money for early development. If designed properly, your site can and should pay for itself down the road. – The St. Louis Section has taken the approach that our website has the potential to become our Section’s biggest advertising, marketing, and membership tool all wrapped into one. – Having said that, we budgeted conservatively to get it off the ground and running. We decided that our website would have to “season” a while with our members and sponsors, before it would become the powerful marketing tool that we thought that it could be. – We chose an excellent local Web Design Firm to help us navigate the turbulent waters of the Web and minimize our mistakes.
- 69. Section Websites 101 Site Maintenance – Our Web design Firm has been retained to manage the support and technical details of our site, while the volunteer base of our Section manages the content in the site, keeping it fresh and current. We have several more large tasks to accomplish before we get the site to what we initially dreamed it would become. – Our Section membership dynamically participates in the directions we take on our site by offering their opinions in polls and by offering suggestions for services they would like to see. The site after all is intended to serve their needs, so who better to help determine what those needs are!
- 70. Section Websites 101 The St. Louis Site in a nutshell… To date our site includes: A public and members-only interface. While the members-only portion is limited now, we intend to add many features that are available only to our members as a perk to membership in our Section. In the near future, we plan to include a reference materials resource as a member-only feature. Reference Materials will be provided by members for other members in a searchable, downloadable format. A secure means to contact the Board with suggestions and questions and disseminate information to board members for upcoming board meetings. Membership Information including access WITHIN our site to online registration from the Society site. Access to current Section and Society news. We will soon have RSS feeds available to our members.
- 71. Section Websites 101 More morsels from the nutshell… A program guide where members can propose topics for upcoming meetings as well as a compendium of past program information including presentation materials for download. A list of current and past Section newsletters for download. PDH recipients are identified in each edition. A photo gallery for events and teaching through photos. A Meetings & Events page for expanded information regarding upcoming events. An Employment section where members can view current job openings and post resumes for corporations to view, as well as a place for corporations to post openings and view potential employee resumes. A Section President’s Blog.
- 72. Section Websites 101 More morsels from the nutshell… An Events Calendar and On-line Event Registration Module allowing our membership to pay for events by Credit Card, PayPal, or elect to pay at the door and simply RSVP. This component will be expanded this year to include our Golf Tournament and will in the future permit payment for Directory Sponsorships, Meeting Sponsorships and Web Sponsorships. We also have plans for a searchable Directory that will not only assist our membership, but also drive business to our vendors and sponsors from any out of town corporations performing automation work in our region. Plans also include the listing of scholarships available to students through the section as well as a means to apply for them on-line.
- 73. Section Websites 101 Recommended List of Resources Domain search and purchase. http://www.godaddy.com (recommended) http://www.directnic.com http://www.domainbank.com Hosting http://www.siteground.com (Recommended as they specialize in hosting Joomla sites) http://www.godaddy.com Content Management http://www.joomla.com (Recommended) Siteground’s Sitebuilder Demo http://serv01.clev5.com/zeni/verify_login/env=prd/user_name=demoacco/password=none/ user_type=demo/forcelogin=demonv=prd/user_name=demoacco/password=none/user_ type=demo/forcelogin=demo Siteground’s Sitebuilder Demo http://www.siteground.com/tutorials/zen-tutorial/index.htm
- 74. Section Websites 101 Recommended List of Resources Joomla Templates http://www.joomlashack.com (Recommended)(Simple, Search Engine Optimized) http://www.templatemonster.com http://www.rocketthemes.com Modules and Components http://www.joomlashack.com (Recommended) Online Payment http://www.paypal.com (Recommended) Web Design Firm http://www.karadesigngroup.com (Recommended)(St Louis Site Manager)
Editor's Notes
- #2: Welcome everyone… My name is Jeff Gamber, I’m the Section President and Webmaster for the St Louis Section. Before we get started, I want to let everyone know that my background in web-development is entirely experiential. I am by no means an expert. There may be people in this very room that have a better understanding of web development than I do. I am here simply to instruct you on how create a data-driven Section website from scratch, or upgrade an existing Section website to be data driven.
- #3: The main focus of this presentation is geared toward building a data-driven site that has endless options for plugging in a full spectrum of gadgets, such as a blog, paid registration, web polls, membership logins, site galleries, interactive calendars and so on. The good news though is that the process for upgrading an existing website is almost the same as starting one from scratch. We will also help you avoid repeating the problems and pit-falls we encountered while recreating the St Louis Section website. How many of you do not currently have a Section website? Okay How many of you DO have a Section website, but you're wanting to develop one that is data-driven (one that can handle registrations, including online payments, for instance)?
- #4: Looks like we have the right group then… Before we get into the nuts and bolts of this presentation, I would like us to start by taking a 10,000 foot view of what you expect your website to accomplish…Defining your dream if you will. If you haven’t thought about that yet, you do this by starting at the end…defining your end goals. * *
- #5: * Without an end goal in place, you have nothing to measure your progress against… Nothing to help you stay on track in accomplishing your Dream. *
- #6: Okay…Once you have defined your end goal, how do you plan to reach it? * Here are some basic questions you might consider asking yourself to help you reach your end goals. *
- #7: Now lets talk about setting your end goals…defining your dream! * As I to you earlier, our dream was defined as: Serving our membership with the most up to date information and services we can provide them. And the lofty goal of having the best Section website within ISA. *
- #8: Research was extremely important to us in recreating the St Louis site. Mainly because when we started we didn’t know what other Sections provided as services to their members. Some Sections provided more services than others. Maybe it was a blessing in disguise, but we discovered that there wasn’t a truly great one-stop site we could copy from. That is what prompted us to decide to try to be that site for others.
- #9: I am an organizer by nature, but I realize that others are not. So during your research, I would encourage you to do the following: *
- #10: Are you ready to get started Creating your Site? Okay, Let’s begin… * How many of you already have a Domain Name? Very Good. For those of you that don’t… *
- #11: Fact: For searches conducted in Yahoo!, a higher ranking is given to those web sites which contain the keyword in the title. * Ours is ISASTL – since we serve members in the St Louis regional area. * Your Domain Name needs to be something that people can remember easily. *
- #12: Don’t intentionally make your Domain Name difficult to type. * Be careful to take the time to misspell your site name to see if anything else pops up. *
- #13: At godaddy.com, you can search to see if the domain name you want is available.
- #15: In Case you are wondering if you are an Idiot… *
- #16: I am offering a free idiot test for a special price of $5 after this session. Okay, let's say you already have a domain name and it's parked where you bought it - in other words, it's not tied to your website yet. *
- #17: The Nameservers (or DNS - domain name servers) will be displayed in your domain account information like this. Your information, unless you purchased it from godaddy.com will be slightly different. If you already have a domain name, and you host at a different company, it is important to know where you will access and change your DNS. I'll get into that in just a few minutes. *
- #18: Let's talk about getting a Hosting Account.
- #19: Siteground is the host that we recommend for this type of site since they specialize in Hosting Joomla websites.
- #21: Another perk of this host is that you can get your Domain Name FREE when you purchase hosting!
- #22: This host is reliable, offers 24/7 customer service and 24/7 tech support. Plus, they specialize in Joomla websites.
- #23: In your Outline Appendix you will find links to Siteground's Sitebuilder Demo and Full tutorial with Videos. It’s a very easy process and you should have no trouble getting an informational site up and running.
- #24: I am now going to walk you through setting up an account with Siteground.com, and then installing Joomla 1.5 In siteground, choose your hosting package. I suggest 12 months. From here you will enter your contact information. Remember to keep records of your receipts and login information.
- #25: Once you sign up, you will have access to Manage Your Account. Notice your DNS settings. Remember I mentioned this earlier. If you have a domain name that you purchased elsewhere, you need to change the DNS Settings from the Parked Status, to point to your new host.
- #26: In Godaddy, you find it in your account information. Change your Nameserver to whatever Siteground shows in your welcome letter as the new DNS for your website.
- #27: In the account we have, this is what it reads: NS1.SITEGROUND173.COM / NS2.SITEGROUND173.COM Is everyone with me so far?
- #28: So now we need to go to the Control Panel and install Joomla 1.5 In the Control Panel, there is a Getting Started Wizard and Video Tutorials, as well as place to setup Email Accounts and show where you can access Webmail.
- #29: As you scroll down, under the heading of Software / Services, you will see Fantastico De Luxe.
- #30: When you click on that you will see different packages you can install. Under Content Management, you will see Joomla 1.5.
- #31: Here it gives a short description, as well as the homepage for joomla at www.joomla.org.
- #32: Click New Installation. And follow the steps. Leave Install in Directory - BLANK. The rest is pretty self-explanatory.
- #33: Once installed you can access the administration side of your Joomla website by going to: www.yourdomain.com/administrator. Type in the admin password and login you setup when you installed Joomla 1.5
- #34: Here's what the backend of your new website looks like. The backend is where you develop your website. Before we take a look around, I want to tell you about the best resource to help you with your new Joomla website. www.joomla.org
- #35: Here's Joomla.org’s homepage.
- #36: The Extensions tab takes you to my favorite part. This is where I go to find the "goodies" that are made to work within the joomla environment. The possibilities are endless, and installing the components and modules couldn't be easier.
- #37: If I wanted to ad a gallery, I look under the photo gallery tab and see different options. Most all of these have GPL licenses, which makes them.... FREE.
- #38: Here's a great one that makes your webpages user-friendly - which is most helpful for getting you more readily found on the search engines. The SEF in the title means “Search Engine Friendly”.
- #39: joomlashack.com is another great resource for templates , tutorials, and resources.
- #40: This is where we purchased our template. Within the template itself, you can find instruction about setting up the menus, color choices for that template. typography, certain bells and whistles that come with that template (ie gallery, flash rotators, etc.) AND…
- #41: Module Layout. This is your Roadmap for positioning the items on your website. This one is OUR Module layout.
- #42: Here's one from joomlashack's Relevant template. As you can see, this one has more positions.
- #43: Another resource for awesome templates is rocketthemes.com. Their templates are more in depth, and can have more options. But, they can also be harder to understand if you're just jumping in and are light on technical know-how. I suggest you take a look at these vendors, and find something that will suit your needs. Be careful when selecting, because you want a template that is web compliant and Search Engine Friendly. Not all templates are created equally. Both of these resources provide templates that i would recommend. The good news is, that templates aren't super expensive, they are easy to download, and take one click of a button to change. Which means once your site is set up and running with all the components in place, you can change the look without any issues. If you have a graphic logo in place in your template, you will have to adapt it for the new one. But that is all.
- #44: Okay. Let's get into the backend of our website. Here we can enable all the Users under User Manager. Another feature I think is awesome about Joomla is the ability to give users limited access to certain areas. This spreads the duty of maintaining the website to many people instead of just one, yet keeps quality control. Each person would have their area of posting. Someone could maintain the blog, another could post upcoming events, and yet another could keep up with local news and keep that area updated. These posts are all conducted through the Front end of the site via login and password rights assigned to those posting.
- #45: Under Extensions you have a Template Manager. Siteground offers several free website templates included in the hosting. See the star? That is the current Default template.
- #46: Here's what it looks like from a visitor's browser.
- #47: Here we change it to a different template.
- #48: And voila - a new look.
- #49: In Siteground, when Joomla is installed, it also installs "dummy content." This is very helpful and shows where content is in the admin area and how it shows in a visitor's browser.
- #50: Under the Content Tab, we go to Articles Manager. We can see what is there.
- #51: In an article on the frontpage is "Joomla Resources at Siteground,"
- #52: This is what it looks like in Article Manager. As you can see, it looks very much like Word. You will have to do a little experiment here. Keep in mind that templates are based on style sheets. You leave styles blank, and put headings H1, H2 and so forth, for your headlines. On the Right, where parameters are, you can make adjustments to show or hide different information, such as author name, date posted and so on. The last thing I want to talk about is installing extensions, such as a template, or a module or a component.
- #53: In joomla.org extensions, I searched for Guest Books. Here are my results. After doing some reading, the most Popular Easybook is our choice. Does anyone remember what GPL licensing means?
- #54: I click on Easybook and I choose the latest version. I then press download and it downloads to my desktop.
- #55: In Extensions Manager I browse and find my new download. I click Upload File and Install.
- #56: Install Component Success. Yes, it's just that easy.
- #57: Go to components, see EasyBook is there. Now we have to make it available as a link on our website so that people can sign up.
- #58: Go to Menus and select Menu Manager.
- #59: Select Main Menu.
- #60: Here we see the different Links on the Main Menu. Since we need to create a new link that leads to our new Guest Book, we choose NEW.
- #61: Choose Easybook.
- #62: Fill out the Title of your Link - Here I've chosen Guest Book. Click Save.
- #63: In their browser our Visitors can now see a Guest Book link in our Main Menu
- #64: Select the link, fill it out and submit. Choose Read Guestbook.
- #65: There's the entry. You can manage your entries from the backend of your website with controls and features that came with that particular component.
- #66: Let's talk about getting a Hosting Account.
- #67: Let's talk about getting a Hosting Account.
- #68: Let's talk about getting a Hosting Account.
- #69: Let's talk about getting a Hosting Account.
- #70: Let's talk about getting a Hosting Account.
- #71: Let's talk about getting a Hosting Account.
- #72: Let's talk about getting a Hosting Account.
- #73: Let's talk about getting a Hosting Account.
- #74: Let's talk about getting a Hosting Account.
- #75: Let's talk about getting a Hosting Account.