Skip directly to content

This Website

on Fri, 07/22/2011 - 13:21

I have finally gotten around to creating a real website for CharlotteFischer.net - a place that can tie together all of the things that I do on this webhost (WebHostingBuzz.com).

I have used this webhosting service for several years (since I retired) to play around with web-design and to host a couple of sites that share pictures and genealogy. Here is a (current as of now) list of things that are working (sort-of) here at charlottefischer.net:

A web-hosting service is a pretty handy thing: with the click of a button you can install software to run any of the above sites. Drupal, of course, requires LOTS more than just installing. All require at least some configuration, but it is mostly well-documented on-line. The advantage of direct access to the databases (MySQL) with the opportunity to learn and practice database queries makes for an interesting and challenging entertainment.

Thanks for visiting!

 

Drupal ... again

on Wed, 07/20/2011 - 19:25

What is so fascinating about web-design? Perhaps that anyone with a computer and some patience (thanks for the patience, Dad) can do it. 

It used to be simple. Remember when you just learned how to write html tags and enclose your text and pictures between <P> and </P>? And then we expanded it with styling: <font size="small" color="red> ... </font>. And remember Composer? That was Netscape Navigator's early html-editor. It's still around, but is called SeaMonkey, now.

And remember how ugly the code looked after you had junked it up with those nested tags inside nested tags? Lovely. And if the nesting got a little entwined some browsers would display it anyway, and some wouldn't. But it didn't matter because Composer, and then Dreamweaver kindly hid the mess from you, and allowed you to happily create the webpage of your dreams, quietly increasing the hidden coding mess to the point where not even a computer could always figure it out.

So we tried to make our pages more beautiful with colors and pictures and boxes (they were tables, remember?), and links, and we wanted certain things to always appear in the same color and format, so we added styles and classes. And then some programmers got to thinking how nice it would be if you could click on a link and the page would react by showing you certain information based on who you were and where you came from.  Voila! Javascript, and then PHP. And if the server would keep track of lots of information, then pages could be displayed very quickly ... databases! Opensource meant that you did not need to spend $$ to install these things and play with them.

Of course, who would do that without a reason? One thing leading to another .... I suppose it started when I had a student in my AP Computer Science course who wanted to spend a semester on a special project. He wanted to learn php (I was teaching java at the time). We decided he needed a specific project, and the school principal was wishing for an attendance program. CASA (Center for Advanced Studies and the Arts) is a consortium of six small school districts that could not individually support Advanced Placement (college-level courses for high-school students) classes. And none of the six districts were over generous with anything but seriously-used furniture and computers. Twenty (or so) teachers, three or four hundred students, and the state, of course, requires detailed attendance records. So Brad spent the semester learning and programming. In late May, he had a program that functioned, sort-of. 

But the principal was COUNTING on that attendance program. So I spent the summer learning php (and html) and mysql. PHP is a computer programming language similar to java but designed to be used by a web server - it essentially allows you to write a computer program that users can use on the web. And MySQL is an opensource database.  By September I had a working program, that still had a few bugs, but by then I knew how to fix them when we found them. I retired several years later, and the school continued to use that program for several more years - they may even still be using it! 

Retirement. What to do? Genealogy, photography, ... and eventually some church work. I found wonderful programs to handle the genealogy (PhpGedView) and the photography (Gallery). And the need to email large groups of people to solicit Communion Servers, and remind people of upcoming events (PHPList).  Easy to install and run on a home server. That original server was named Frankenstein (Frank for short) because it was created from the parts of dead computers. Did I mention that in the process of running a computer lab to teach Computer Science in a school without a tech department, guess who had to learn to configure, run, and troubleshoot a computer lab? And since Microsoft is very expensive to learn, and Linux is free, well .... 

At some point in there, I realized that it was costing maybe $10/month to run Frank full-time. And for $100 I could get 2 years of webhosting (WebHostingBuzz). So I shifted it all over to the hosting service. Thus when I looked at what was available in web design processes, I was very pleased to discover that I would never have to use DreamWeaver again! In 2006, when I needed (wanted) a website for Presbyterian Women (I was moderator), there were several choices out there, but Drupal seemed the most flexible. And, wonder of wonders, you could get it installed with a click on my spiffy new webhost! Several months later, I would say that the flexibility is a good thing ... and a real challenge!  But a simple functioning website was created - still running pretty much as I set it up (I know it needs some updating): Presbyterian Women of First Presbyterian Church

I could read and understand php, but I didn't NEED to - Drupal is completely point-and-click!  So, what is this great big historical document about? Well, after several years away from drupal web-development (except for occasional updates and the normal website maintenance), I see that there is something new out there. 

I started looking into web services that help you design (theme) a Drupal site. I looked at two and chose DrupalGardens because I didn't have to pay first (Buzzr is the other one)! So I registered at DrupalGardens and created first a site for myself (http://charlotte.drupalgardens.com/) and one for the Presbytery of Detroit (http://pbydetroit.drupalgardens.com) which is looking into the redesign of its current website. The one for me looked pretty good, but when I exported it to my webhost, it seemed to have lost it's formatting.

So I went back to a drupal-7.4 installation I had started some time ago and given up on. I worked through the instructions for creating a theme and it seemed to be working ok, until I tried to add some content. It erased all of the line-breaks and I spent at least a day trying to solve that, before going back to this exported site and trying again - and the second time, I managed to follow the DIRECTIONS and export a reasonably nice-looking site to my webhost.

I started this post when, after several days trying to figure out how to adjust the width of the page on my drupal-7.4 site, I finally found the answer! This site uses Zen to create a theme. Zen is css-based. And it took ages to figure out how the css box model works. Essentially, I had it looking pretty good, except that the pages were too wide for the browser. WHERE is the problem? There must be 16 css style sheets in this theme! Finally, I figured out that there is one element that is too wide, and that is making the WHOLE page wide. Which one? Thanks to Firefox and the Firebug Extension, I could see each element and it's width. I spent several days looking for the problem (my husband wonders what I do with myself all day). Finally found it! One of the elements had a width setting of 100%. But that element was nested inside another element that had a margin set to 25px. The margin is ADDED to the width of the contained elements. If one element is set to be as wide as the browser and you add a margin to that, then your page is wider than the browser.  EUREKA!!

OK, on to other things ....