Troop 174

Webmaster's Guide
James S. Lipscomb
Dec. 8, 2007

Take over tripod.com -- web hosting for troop174.info

Tripod hosts our web pages for a fee, charged to a credit card.  Switch from mine to yours.  Either consider it your contribution to Scouting or get reimbursed by the Troop Treasurer.

Keep it paid up or else the site will go down and may be taken over by porn. Then, they might sell us back troop174.info for thousands of dollars.

The website has three equivalent names that all point to the same thing.

To take over the Tripod account:
  1. Go to http://www.tripod.lycos.com/
  2. User -- Get this from the Webmaster or Scoutmaster
  3. Password -- Get this from the Webmaster or Scoutmaster
  4. (Note that we are using only a few hundred GB of the 5 GB of storage available.)
  5. Click on My Account tab at the top
    1. Click below on "Change your membership & billing information"
      1. See the "LYCOS Account Information" page.
      2. Change to your e-mail address, name, and address
      3. Click at right on "Edit Payment Methods" from within the "LYCOS Account Information" page.
        1. Change to your credit card.
        2. (We - you - are paying $11.95 / month or $143.40 / year)
To take over the web pages themselves, perhaps you got on a USB drive or CD.  If not, you can download them yourself.  You can either ftp to Tripod with your favorite FTP program and download, or you can use python.com's websucker program to get the whole site at once.

Set up TroopMaster DotNet if you have not done so.  Instructions are on the password-protected pages here, but you will also need passwords.

TroopMaster DotNet Remote Data Storage

Since this remote space is free, there is not so much need to take this over.  Your choice.

"As a service to the Scouting community we are offering FREE FTP access and server space for units who utilize the  DotNet add-on to their TroopMaster or PackMaster Software. This data will be accessible utilizing the  DotNet software only. Normal browsers will be unable to access this data."

"This plan includes up to 500 KB of server space, private folder, unique login and password to access your TroopMaster or PackMaster files via the DotNet package."

"This offer is limited to Scouting Units utilizing the DotNet software package. Sites that do not show any activity within a 9 month period or utilize the free space in other ways are subject to deletion."

TroopMaster is at  http://www.troopmaster.com/products/troopmaster/dotnet.html .

The FTP site that stores our troop information that TroopMaster loads when it starts up is at  http://www.scoutwebservices.com/dotnetplan.htm .
where we are signed up as

Now for some software installs.  All this software is freeware.  There are no licensing fees.
 

Install an FTP Program - WS_FTP

Use this ws_ftple.exe (0.6 MB) old free-forever limited-edition version.  The current version on the ws_ftp website is free for only 30 days.  (FileZilla is another good free FTP program).

WS_FTP  is old-fashioned and a bit clunky to use, but I like the way that it leaves a history file in each directory, so that any new files you have edited are newer than the history file, so it is easy to see which files need to be uploaded next.

Because Tripod us UNIX or LINUX, be sure that your ftp program is set for ASCII for .htm, .html, and .txt files, else the line-termination characters will be mangled and you may have an editing nightmare with an HTML page in for example Notepad coming up as a single, fantastically long line instead of as several lines.  Also, file names must not have blanks in them.  This is OK in Windows, but illegal in UNIX, and the pages will not load onto tripod.

  1. Set up the FTP login
  2. Give it a name, say T174
    1. Ftp to ftp.tripod.com (IP address 209.202.196.70)
    2. Host Type Unix
    3. User -- Get this from the Webmaster or Scoutmaster
    4. Password -- Get this from the Webmaster or Scoutmaster
    5. Startup
      1. Initial Remote Site Folder - Leave blank
      2. Initial Local Folder - C:\Data\Website_Troop174  or whereever you keep your website locally.
    6. In the Startup tab:
      1. Leave the Initial Remote Folder blank, which will take you to the website root.
      2. Set the Inital Local Folder to where you keep the website index.html on your computer, something like   C:\Data\Website_Troop174
    7. OK
  3. Consider setting up another login for photos, same as above, but
    1. Call it T174 photos
    2. In the Startup tab:
      1. Set the Initial Remote Folder to History/Y2007/Photos
        1. Note that the slashes tilt to the right.
      2. Set the Inital Local Folder to where you keep the website index.html on your computer, something like   C:\Data\Website_Troop174\History\Y2007\Photos
  4. In Options / Extensions configure ws_ftp to transfer files as ASCII in these formats

Install HTML Editor - Netscape 4.75

Use Google to find and download cc32d475.exe on the internet.

Install Netscape 4.75 (20 MB)  from the Install directory provided.  The file is cc32d475.exe

After the install, check that it will not disrupt HTML formatting.  Not sure where this is.

Double check that Edit / Preferences / Composer / Publishing / uncheck both Maintain links and Keep images.

Also from that directory copy "Netscape 4.75 EDIT" to C:\Documents and Settings\Administrator\SendTo  or wherever you have your SendTo directory.

Then, to edit an HTML file

  1. Right click on the HTML file
  2. Move cursor to Send To
  3. Netscape 4.75 EDIT

Install Text Editor - NotePad++

Website to download NotePad++

For editing Sign-up forms and for making image thumbnails, you will need something with multi-file view and multi-file search-and-replace.

You will download something with a name like npp.4.3.Installer.exe (1.7 MB)

Or follow the link provided to the website to download the current version.

After the install, configure to not remember previous files and open them when NotePad++ opens.  Not sure where this is.  Maybe Settings / Preferences / Global / uncheck Remember the last operation directory.
 

Install Image Editor - XnView

Website to download XnView

You will download something with a name like XnView-win-en.exe (4 MB)

Copy desktop icon XnView to C:\Documents and Settings\Administrator\SendTo  or wherever you have your SendTo directory, if the icon is not already there.
 

Install Image Editor - The Gimp

Website to download GIMP Installs

You will download things with a names like

  1. gimp-2.4.1-i686-setup.exe (15 MB)
  2. gimp-help-2-0.13-eng-setup.exe (16 MB) -- English Language Only help files for the GIMP.
Copy desktop icon GIMP to C:\Documents and Settings\Administrator\SendTo  or wherever you have your SendTo directory.

Use the GIMP to make a new EmYourname image file with your e-mail address.  This may protect you from automated robots that harvest e-mail addresses on the Internet for spam targets.

  1. Start the GIMP
  2. File (main window) / New
  3. Width 250, Height 17
  4. Select Magnifying glass and click a few times to enlarge.
  5. Select the text tool, the big A
  6. Set to Sans 12 Px
  7. Click in the upper left of the white box.
  8. Type your e-mail address
  9. Select the Select Box tool at upper left.
  10. With the mouse, select just your e-mail address close in, 13 pixels high by say 140 wide, making a note of it.
  11. Control-c to copy
  12. File (main window) / New
  13. Width 13 by 140 in this example
  14. Control-v to paste
  15. File (image window) / Save As
  16. Set file name to EmYourname and directory to write to.
  17. Expand Select File Type and select .GIF
  18. Save
  19. In Windows Explorer drag the image to a web browser to check it.
  20. Close the GIMP
  21. Drag the image to the main T174 directory.
  22. Using Netscape 4.75 edit index.html to have at the bottom of the page your name and this image of your e-mail (drag and drop it onto the Netscape Edit window) and Save.
  23. Using WS_FTP upload to the website the EmYourName.GIF file and index.html.
  24. Online on the website, check all uploaded files.

Install OpenOffice - Exports PDF forms

HTML forms on the troop website, may be edited directly with Netscape 4.75.

But PDF forms on the troop website are made by editing DOC or HTML files supplied in an offline Forms directory, and then exporting as a PDF.

Download and install OpenOffice here http://www.openoffice.org/ .

To start, and every few months after.

Make a backup copy of the website in case you clobber a file accidently, so that you will have some kind of chance.  It will happen.

Daily

  1. Edit index.html
    1. News Posted On Section
      1. Add any new items.
      2. Items more than 5 days old - change from bold to non-bold.
      3. Items more than 10 days old - delete.
    2. Sign-up Section
      1. Overdue Section
        1. Events that are over - remove.
        2. Edt the Password-Protected Page and do the same.
      2. Now Section
        1. Events that have passed the deadline - move up to Overdue Section.
        2. Edt the Password-Protected Page and do the same.
      3. Long Range Section
        1. Events that are less than one month away - move up to Now Section.
        2. Edt the Password-Protected Page and do the same.
    3. Calendar of events section
      1. Events that are over - cut, and paste at bottom of  inPastMo.html
      2. New event information - add in index.html or inFutureMo.html
  2. Porn Patrol
    1. Go online the Password-Protected Page
    2. For each List of those who have signed up:
      1. Click on List to look at it.
      2. Scroll to the bottom looking for Porn sign-ups.  If none, look at next List, which is quick if you use the Backspace key to go back.
      3. Start WS_FTP, the FTP program
      4. Very carefully download from the website the List with the Porn sign-up.
      5. On your local computer using NotePad++ edit out the Porn sign-up in the file.
      6. Very carefully upload that file to the website.  Be sure not to upload the wrong one, else wipe out sign-ups.
  3. Online on the website, check all uploaded files.

Posting Event Sign-up Forms

  1. Note that for every form in the Forms directory named ifoEventName.html there is text file one level above in the home directory named ifoEventName.html.txt.  The connection is implicit, not explicitly stated anywhere.
  2. Look at the line for last-year's version of this event in f0rm5Mast3r.html
  3. Edit the sign-up form using NotePad++, not Netscape, in f0rm5Mast3r.html, post f0rm5Mast3r.html to the website, and test it there.
  4. When the sign-up form tests OK, upload a blank (just the title) corresponding .txt file to erase your test signup.
  5. When happy, copy from f0rm5Mast3r.html to the Password-Protected Page and (without the List) to index.html.
  6. Forms are named ifoEventName.html.  "ifo" stands for Interactive FOrm.
  7. Online on the website, check all uploaded files.

Monthly

Move the last of this month from index.html to inPastMo.html
  1. From index.html move the last of this month, say Jan., from index.html to inPastMo.html
  2. In index.html under Quick Links - remove this month's quick link, say Jan.
  3. From index.html copy the next month, say Feb., green image and one character of the first event to inPastMo.html (need one character at least in a bullet item to keep bullet from disappearing after file is uploaded).
  4. From index.html under Quick Links - copy the next month's quick link, say Feb., to the top of inPastMo.html
Move upcoming month from inFutureMo.html to index.html the next month, to keep three months in index.html, in this case Apr.
  1. in index.html see at the bottom of the calendar a green May image and a big black Apr. 2009, etc. See Future Months of troop Calendar.
    1. From inFutureMo.html copy to index.html, from and including the green Apr. image all the way to the green May image and past it to the big black text May 2009.
    2. The insert into index.html replaces the green Apr. image and the big Black Apr. 2009 just before "etc. See Future Months of troop Calendar."
    3. When you are done, index.html will have all of April ending in May 2009, etc. See Future Months of troop Calendar.
    4. From inFutureMo.html copy the Quick Links Apr. link in to index.html just before ", and later" so that we can jump to the newly moved-in month.
  2. in inFuturMo.html
    1. Remove all of April 2009, as it is now in index.html.  Leave all of May 2009.
    2. As Apr. has been moved to index.html, go to Quick Links and cut the Apr. link from 2009 and paste it in the row below for 2010.
For Weekly Troop Campouts remove old sign-ups and add another month of weekly campouts, if troop is still doing that.
  1. Remove old sign-ups from http://bsatroop174.tripod.com/ifoCampOut2dayWeekly.html.txt, much like Porn Patrol above.
    1. Start WS_FTP, the FTP program
    2. Very carefully download from the website ifoCampOut2dayWeekly.html.txt.
    3. On your local computer using NotePad++ edit out the old sign-ups in the file.
    4. Very carefully upload that file to the website.  Be sure not to upload the wrong one, else wipe out sign-ups.
  2. Add a new month
    1. Using Netscape 4.75 Edit
      1. Either index.html or inFutureMo.html
        1. To the calendar add the weekly campouts and deadlines.
        2. Save
      2. index.html
        1. To the Sign-up list at the top of index.html add weekly campout sign-ups.
        2. Above that in News Posted On section add announcement of new sign-ups.
        3. Save
    2. Using NotePad++ edit Forms\ifoCampOut2dayWeekly.html
      1. Remove old sign-up dates and add new ones following the pattern there.
      2. Save
    3. Using WS_FTP, the FTP program upload all files
  3. Online on the website, check all uploaded files.
Add signups for the new month rolled onto the homepage
  1. In f0rm5Mast3r.html find the full signup line for last year's version of this event.
  2. Copy that line to the password-protected page pwOurPassword.html
  3. Copy just the signup part of that line, omitting the list of who has signed up and paste at the top of the home page in the Long Range or Now section.
  4. Copy the signup to this year's event in the homepage calendar.
  5. Copy the signup to a point a few days or weeks before the event when the deadline for signup is.  You will seldom be given a deadline, so guess and mark the guess in bold italics with question marks to let everyone know that you need the info.
  6. Put a new item at the very top of the home page exhorting people to sign up.
Check for upcoming events to add to index.html or inFutureMo.html
  1. Lakeland Calendar for vacations during which no troop activities.
  2. Federal Holidays for the long-term troop calendar inFutureMo.html
  3. Check for different things each month ..
Post TroopMaster Scout Information to Password-Protected Pages
  Also post before Courts of Honor, when advancement is updated in TroopMaster.
  1. Edit the Password-Protected Page using Netscape 4.75.
  2. Start TroopMaster in Read-Only mode.
  3. Set Today's Date, 2007 - Scout Leadership Roster: Patrol, rank, age, phone, e-mail.
    1. Reports / Scout/Unit General / Scout Leadership Roster (near top) (only Include e-mail checked)
    2. OK
    3. In Pop-up window click Save Icon / Web Page ...
      1. Be sure that you will save into the Protected directory.
      2. See Troop_174_Scout_Leadership_Roster.html
      3. Save / Yes / Yes
    4. Cancel
  4. Set Today's Date, 2007 - Scout Unit Phone List: All Scouts: Phone, addresses, e-mail, parents' names.
    1. Reports / Scout/Unit General / Unit Phone List (near bottom) (All scouts, home, unit website, double space)
    2. OK
    3. In Pop-up window click Save Icon / Web Page ...
      1. Be sure that you will save into the Protected directory.
      2. See Troop_174_Phone_List.html
      3. Save / Yes
    4. Cancel
  5. Set Today's Date, 2007 - Scout Unit Patrol Roster: All Scouts grouped by patrol: Patrol, phone, e-mail, age, rank, leadership.
    1. Reports / Scout/Unit General / Unit Roster (nearer bottom) (All scouts, group by patrol, DOB, grade, unit, separate page, double space)
    2. OK
    3. In Pop-up window click Save Icon / Web Page ...
      1. Be sure that you will save into the Protected directory.
      2. See Troop_174_Roster.html
      3. Save, Yes
    4. Cancel
  6. Set Today's Date, 2007 - Advancement: Status. All Scouts.
    1. Reports / Awards-Advancement / Advancement Status (at top) (All scouts, group by rank, all ranks, legend, double space)
    2. Select Date of Last Rank or select DOB as you wish.
    3. OK
    4. In Pop-up window click Save Icon / Web Page ...
      1. Be sure that you will save into the Protected directory.
      2. See Troop_174_Advancement_Status.html
      3. Save, Yes
    5. Cancel
  7. Set Today's Date, 2007 - Advancement: Merit Badges Earned. All Scouts: Double check against your records.
    1. Reports / Awards-Advancement / Merit Badges Earned (near top)
    2. Select All - All Scouts  (All scouts, group by rank)
    3. OK
    4. In Pop-up window click Save Icon / Web Page ...
      1. Be sure that you will save into the Protected directory.
      2. See Merit_Badges_Earned.html
      3. Save, Yes
    5. Cancel
  8. Set Today's Date, 2007 - Merit Badge Counselors in the Troop: Grouped by Badge Name, e-mail, and phone number.
    1. Reports / Merit Badge Counselors / Grouped by Badge (middle) (Active Counselors, all boxes checked)
    2. OK
    3. In Pop-up window click Save Icon / Web Page ...
      1. Be sure that you will save into the Protected directory.
      2. See Troop_174_Counselors_Grouped_By_Badge.html
      3. Save, Yes
    4. Cancel
  9. Set Today's Date, 2007 - Adult Member Leader Phone List: Phone, addresses, e-mail, position.
    1. Reports / Adult Members / Leader Phone List (middle) (Home, Adult Leaders, all boxes checked)
    2. OK
    3. In Pop-up window click Save Icon / Web Page ...
      1. Be sure that you will save into the Protected directory.
      2. See Troop_174_Adult_Phone_List.html
      3. Save, Yes
    4. Cancel
  10. Close TroopMaster
    1. Probably a good idea to back up the database on your computer in spot of your choosing.
  11. Save the Password-Protected Page
  12. Start WS_FTP
    1. Upload the Password-Protected Page
    2. Change to Protected directory on BOTH sides of WS_FTP
    3. Upload the 7 TroopMaster files above.
      1. In the left panel sort by Date
      2. And select files above the WS_FTP.LOG file
      3. Click Right Arrow icon in the middle.
    4. Close WS_FTP
  13. Online on the website, check all uploaded files.
Keep the Eagle Scout page up-to-date
  1. Using Netscape 4.75 edit file eagles.html
  2. Compare to TroopMaster, or password-protected page Troop_174_Advancement_Status.html
  3. Edit as appropriate.

Posting Event Photos

Someone has just sent you photos for an event, let's call it ScoutFunDay on Dec. 1, 2007.
  1. Go to your set of photo directories.  I shall give you a starter set.
  2. Copy directory c00Prototype.  Get a copy here, if you do not have one (zip file).
  3. Click on the parent directory to c00Prototype.
  4. Paste.  You should see directory "Copy of c00Prototype" just after the last event directory, say c50LastEventDay
  5. Change the name of "Copy of c00Prototype" to c51ScoutFunDay.
  6. Click on ScoutFunDay to enter the directory
  7. Change the name of zEventThumbs30.jpg to c51ScoutFunDayThumbs30.jpg
  8. Change the name of zEvent.html to c51ScoutFunDay.html
  9. Edit c51ScoutFunDay.html
    1. Edit c51ScoutFunDay.html with NotePad++
      1. At the top change   <title>174Event, MonthDay, 2007</title>  to  <title>174ScoutFunDay, Dec. 1, 2007.</title>
      2. Save and close.
    2. Edit c51ScoutFunDay.html with Netscape 4.75
      1. Change EventName to ScoutFunDay
      2. Change MonthDay to Dec. 1.
      3. Save and close.
  10. Receive photos.
    1. Store them in c51ScoutFunDay\aOrig\Thirds  Photos are third-rate until promoted.
    2. Do not look at them yet.
  11. In the Thirds directory rename files.
    1. Start XnView: Double click on "XnView Tools - Batch Rename"
    2. In XnView's left hand window click on the c51ScoutFunDay\aOrig\Thirds directory if not already there.
    3. In XnView's top right window click on the first photo, then shift-click on the last photo.  This should select all photos in the Thirds directory.
    4. Select XnView's Tools / Batch Rename menu item.
    5. In Windows Explorer copy the directory name or part of a file name c51ScoutFunDay
    6. Paste that in XnView's Batch Rename window near the top replacing something like RawPhoto##  by  c51ScoutFunDay##
      1. Or if you expect photos from more people, consider keeping them straight with the submitter's initials, from Jamie C for example c51ScoutFunDayJC##
    7. In the lower left click Rename.
    8. Close XnView
  12. In Windows explorer, the Thirds directory may need to be converted to show large images.
    1. Click on the Thirds directory
    2. Select from the top menu bar View / Customize this Folder
    3. Under the Customize tab select drop-down Photo Album (best for fewer files)
    4. OK
    5. Select from the top menu View / Filmstrip
    6. You should now see a big photo in Windows Explorer with a bar of small photos below.
  13. Review the photos in Thirds and move any you like up to directory aOrig
  14. Final review of photos in aOrig.  You may need to convert it to Photo Album as you did Thirds above.
  15. Copy the aOrig photos to directory a1Reframe.
  16. In directory a1Reframe change the framing of badly framed images.
    1. Start XnView: Double click on "XnView Reframe - Cut - Edit Import Clipboard"  Note that the name give a synopsis of what to do.
    2. In XnView's left hand window click on the c51ScoutFunDay\a1Reframe directory if not already there.
    3. In XnView's upper right window double click on a thumbnail of a problem image, BadFrame11.jpg to expand it (Esc makes it go away).
    4. Drag and drop the cursor to frame the image as you want.  Assuming a 4:3 aspect ratio at the bottom of the window adjust until the number just before the two numbers in parentheses becomes 1.33.  Then you have the 4:3 aspect ratio.
    5. Control-c to copy
    6. Control-Shift-v to paste.  This is the Edit / Import Clipboard function, different from the usual Paste.
    7. File / Save As /
      1. Change to the c51ScoutFunDay\a1Reframe directory if not there.
      2. Options / Write tab - Quality 90, OK
      3. Click the BadFrame11.jpg image on the list.
      4. Save, Yes replace.
    8. Esc twice to close the pictures in XnView
    9. Repeat the above as necessary for more pictures.
    10. Close XnView
  17. Copy the a1Reframe photos to directory a3CurvesColor.
  18. In directory a3CurvesColor brighten up dark photos, and other fixes.
    1. Start the GIMP: Double click on "1 GIMP 2-4  Colors Curves - Colors ColorBalance - Colors RedEye batch or individ"  Note that the name give a synopsis of what to do.
    2. Drag and drop a photo that needs fixing onto the small GIMP window.  A pop-up window with the photo will appear.
    3. From the top menu of the photo window select Colors / Curves.
    4. To brighten shadows: In the pop Curves window grab the line near the bottom and drag up to lighten.  Maybe grab near the top and drag up too.  OK.
    5. File / Save
      1. Set Quality to 90
      2. Save
    6. Also good: Colors / Color Balance, Filters / Enhance / Red Eye.
    7. Sharpening blurry photos works only after making them small
      1. Click on Image Window
      2. Image / Scale Image / W 400, H 300 / Scale
      3. Filters / Enhance / Sharpen / In pop check Preview box, slide Sharpen setting, OK.
      4. Save image
    8. Repeat the above as necessary for more pictures.
    9. Close the GIMP.
  19. Resize to 400x300
    1. Start XnView: Double click on "2 XnView IRedEye - Tools BatchConv - Transf Resize Add NoRatio - Gen Options Quality 30 - Go"  Note that the name give a synopsis of what to do.
    2. In XnView's left hand window click on the c3CurvesColor directory if not already there.
    3. In XnView's top right window click on the first photo, then shift-click on the last photo.  This should select all photos in the directory.
    4. Tools / Batch Conversion
      1. (First Time Only)
        1. Transformations Tab
          1. Resize on the left - Add - Click on Resize on the right
          2. Width 400, Height 300
          3. Uncheck all boxes
          4. Save Resize400x300
        2. General Tab
      2. Subsequent times
        1. General Tab
        2. From the drop-down at the bottom select Resize400x300
      3. General Tab
        1. (First Time Only)
          1. Set a standard output directory, create in Windows Explorer if necessary, say StandardOutputDirectory
        2. Options
          1. In Read/Write / JPEG / Write Tab
            1. Set Quality Level to 30
            2. (First Time Only)
              1. Uncheck all boxes, else some 400x300 images will be 60-70 KB instead of the desired 10-20 KB.
          2. OK
      4. Go
    5. Close XnView
    6. In Windows Explorer go to directory StandardOutputDirectory
      1. The files you just wrote should be 10-20 KB.  If less then 5 KB or more than 30 KB then something may have gone wrong.
      2. Move the files to the photo home directory c51ScoutFunDay in this case.
  20. Add photos to c51ScoutFunDay.html file
    1. Go to the photo home directory c51ScoutFunDay in this case.
    2. Right click on c51ScoutFunDay.html and SendTo Netscape 4.75 EDIT
    3. Drag and drop the photos in the c51ScoutFunDay directory into c51ScoutFunDay.html.
      1. Drop the first photo to the left of the invisible "."
      2. Drag the second photo to the right of the invisible ".", and then add a "." after it to its right.
      3. Repeat that last step for all remaining photos.
      4. Rearrange photos by cutting and pasting, to cut a photo select both it and the "." to its right.
    4. Change at the bottom "Photos by zzzz" to reflect who shot the photos.
    5. Save c51ScoutFunDay.html.
  21. Make a Photo Thumbnail Image Array
    1. Example 
    2. Copy c51ScoutFunDay.html
    3. Paste.  You should see file "Copy of c51ScoutFunDay.html"  This will be a working file, not to be posted, that will make the thumbnail image.
    4. Edit "Copy of c51ScoutFunDay.html"
      1. In Windows Explorer multi-select "Copy of c51ScoutFunDay.html" and zThumbsConvert.txt
      2. Right Click and select NotePad++
      3. Copy the following items from zThumbsConvert.txt and paste into "Copy of c51ScoutFunDay.html"
        1. Copy the  <body bgcolor="#FFFFFF" text="#000000"> tag and paste it over the existing Replace the existing <body text="#9F9F9F" bgcolor="#000000" link="#6666FF" vlink="#AA00FF" alink="#FFFF99"> tag.  This will make the background white.
        2. Copy the </center> tag and put it before the photos to end centering and make them right justified.
        3. Copy the FFFFFF from the  <font color="#FFFFFF"> tag and replace the 000000 font in the font tag after the first photo but before the period character.  This will make the "." characters white.
        4. Search / Replace
          1. Find what: height=300 width=400
          2. Replace with: height=56 width=75
          3. Double check that you have selected the NotePad++ "Copy of c51ScoutFunDay.html" tab.
          4. Replace All
          5. Check the pop window that says "xx tokens are replace" to see if that is about the number of photos on the page.
      4. File / Save
    5. Drag and drop "Copy of c51ScoutFunDay.html" into a web browser
      1. If it looks about right, then close NotePad++.
      2. Adjust the right margin of "Copy of c51ScoutFunDay.html" to make the picture wrap around to make 8 thumbnail images across.
      3. Click on the browser view of "Copy of c51ScoutFunDay.html" to make sure that the focus is on that window, and then do a screen capture (hold down the "alt" key and hit the "print screen" key).
    6. XnView
      1. In the c51ScoutFunDay directory double click on "XnView IRedEye - Ctl-c Ctl-Shift-v SaveThumbs"
      2. In XnView's left hand window click on the c51ScoutFunDay directory if not already there.
      3. Control-Shift-v to paste.  This is the Edit / Import Clipboard function, different from the usual Paste.  You will see an image of the web browser window.
      4. Zoom in by clicking on the magnifying glass above.
      5. Drag and drop the cursor to frame the image of the 8-across thumbnails.
      6. Control-c to copy.
      7. Control-Shift-v to paste.  You should see just the image of the thumbnails.
      8. File / Save As /
        1. Change to the c51ScoutFunDay directory if not there.
        2. Options / Write tab - Quality 30, OK
        3. Click the c51ScoutFunDayThumbs30.jpg image on the list.  You renamed it to that way up top.
        4. Save, Yes replace.
      9. Esc twice to close the pictures in XnView
      10. Close XnView
  22. Copy files to T174 Photos directory
    1. In Windows Explorer go to the photo editing directory where you have been working.
    2. Multi-select
      1. c51ScoutFunDayThumbs30.jpg
      2. c51ScoutFunDay.html
      3. The several c51ScoutFunDay##.jpg files used by c51ScoutFunDay.html
    3. Copy these files to the troop website photos directory, say C:\Data\Website_Troop174\History\Y2007\Photos
  23. FTP to website
    1. Using WS_FTP, upload these files to the corresponding remote website photos directory.  After login, have to drill down to the corresponding directories on both left and right panels of WS_FTP.
  24. Edit index.html using Netscape 4.75 (Right click and SendTo)
    1. In the New Photos section
      1. Copy and paste the top event name and its link, so that you have two of them.
      2. In the copied event the Thumbnail image is too far left.
        1. Select Move to Right Icon
        2. Select Bullet List Icon to remove the bullet that is there.
      3. In the topmost of the duplicated events
        1. Change the name of the event to Scout Fun Day
        2. Change the date to the correct date.
        3. On that date link right click / Link Properties to bring up link.
          1. Change in the line just the HTML file part of the line to c51ScoutFunDay.html
          2. OK
        4. Double click on the thumbnail image to bring up the Properties.
          1. In the Image Location field change just the file name part of the line to c51ScoutFunDayThumbs30.jpg
          2. OK
    2. New Top Three-Images section
      1. Decide which Scout Fun Day event photo you like, say c51ScoutFunDay11.jpeg
      2. At the top index.html double click on the rightmost image (the oldest event) to bring up Properties.
      3. In the Image Location change just the address to Y2007/Photos/c51ScoutFunDay11.jpeg
      4. In the Height box copy the 180
      5. OK and see that the image is too large
      6. Double click again to bring up Properties.
      7. Paste the 180 back into Height
      8. OK
      9. Multiselect the image and the white underline to the right of it.
      10. Cut, Control-x.
      11. Click left of the leftmost image.
      12. Paste, Control-v
      13. The new event image is now the leftmost of the three.
    3. For the Event Calendar Entry
      1. In the New Photos section, copy the date link for the event.
      2. In the Event Calendar for this event make a new line if necessary for
        1. Photos of Scout Fun Day at Wherever, on
        2. Then, paste the date at the end.
        3. Abbreviate date to just month and year.
    4. Save index.html
  25. Move Event Calendar Entry to inPastMo.html
    1. Using the Netscape 4.75 editor
    2. You did remember to copy and paste in a link to the new photos (step just above).  Yes?
    3. In index.html Cut the event from the Event Calendar
    4. In inPastMo.html at the bottom, paste the event.
    5. Save index.html and inPastMo.html
    6. Using WS_FTP upload both to the website.
  26. Add to photos.html
    1. Using the Netscape 4.75 editor
    2. In index.html in the New Photos section, copy the event name, date link, and thumbnail.
    3. At the bottom of photos.html
      1. Click the cursor at the end of the last event thumbnail.
      2. Hit enter, which gives a new numbered entry at the bottom.
      3. Paste
    4. Save photos.html
    5. Using WS_FTP upload photos.html to the website.
  27. Online on the website, check all uploaded files.

In September

  1. Obvious things, setting up troop meetings, patrol meetings, events, and things in the Monthly Sept. list above.
  2. New Patrol names
    1. Using NotePad++ go to the Forms directory and edit most any random form.
    2. Inspect a line that has the patrols listed, for example
      1.  <option value="">(select)</option><option value=" Pedro Patrol">Pedro Patrol</option><option value=" Phoenix Patrol">Phoenix Patrol</option><option value=" Shark Patrol">Shark Patrol</option><option value=" Spartan Patrol">Spartan Patrol</option><option value=" Wolverine Patrol">Wolverine Patrol</option><option value=" V. Crew">V. Crew</option><option value=" Adult">Adult</option>
    3. Copy just the part of the line that has the patrols, this is because not all sign-ups have V. Crew and Adult sign-ups, and we want to replace the part of the line that is in every sign-up.
    4. <option value=" Pedro Patrol">Pedro Patrol</option><option value=" Phoenix Patrol">Phoenix Patrol</option><option value=" Shark Patrol">Shark Patrol</option><option value=" Spartan Patrol">Spartan Patrol</option><option value=" Wolverine Patrol">Wolverine Patrol</option>
    5. Paste this line twice into a new text file.
    6. Edit the second of those two lines to match the new patrol names (note that the space after the quote gives a pleasing indent) for example
      1. <option value=" Newbee Patrol">Newbee Patrol</option><option value=" Turtle Patrol">Turtle Patrol</option><option value=" Tapeworm Patrol">Tapeworm Patrol</option><option value=" Angst Patrol">Angst Patrol</option><option value=" Problematical Patrol">Problematical Patrol</option>
    7. You now have two lines, one with the old patrols and one with the new patrols.
    8. In Windows Explorer sort files by file type, multi-select all .html and .htm files, and drag and drop them into NotePad++.
    9. in NotePad++
      1. Search / Replace
      2. Copy Line 1 with the old patrol names and paste into the Find What box.
      3. Copy Line 2 with the new patrol names and paste into the Replace With box.
      4. Click Replace in All Opened Documents.  After 10 seconds of flashing, about 150 replacements will have been done, OK.
      5. Close the Replace window.
      6. File / Save All
      7. Close NotePad++
    10. Using WS_FTP, upload all new files to the remote Forms directory.
  3. Online on the website, check all uploaded files.

Late December Moving to the Next Year

Example is moving from 2007 to 2008.

inPastMo.html

  1. Copy inPastMo.html to inPastMo2007.html and then in it --
    1. inPastMo2007.html
      1. In a text editor change title "Cal Past Months" to Cal 2007 in <title> and in text heading at top of page.
      2. Copy from inPastMo2007, and change title Past Months of Calendar to Calendar 2007
      3. Top picture change the dinosaur image to "Y2007/Year2007-200x150.gif".
      4. Clean away references to past years.  This is just 2007.
    2. inPastMo.html
      1. delete old 2007 information, which is now in inPastMo2007.html
      2. create a link to inPastMo2007.html
      3. Just for fun replace the dinosaur image with another in directory  History/inPastMoDinosaurs/    Run them in a 7 year rotation.  I have the next few years mapped out in the file names.  2008 is inPastMo2008Pterosaur.gif  All images are from Tripod.com, so we have permission to use them.
photos.html
  1. Copy photos.html to photos2007.html
    1. In a text editor ...
    2. In both the text heading at top of page and in <title>: change "Photos of Troop Activities" to "Photos 2007"
    3. Remove from Past Years to This Year and substitute <p>
  2. In body of photos.html delete information, and then create a link to photos2007.html
inFutureMo.html
  1. Next year should be partly filled in.  Leave it alone.  The year after should be blank.
  2. See http://bsatroop174.tripod.com/f0rm5Mast3r.html#January
  3. Edit  f0rm5Mast3r.html and go to that place.
  4. Copy Jan-Dec to the year after next.
Online on the website, check all uploaded files.

Using NotePad++ go to the Forms directory and edit all .html files (multi-select and Send or drag and drop).

  1. Search / Replace
  2. Type this year (e.g. 2007) into the Find What box.
  3. Type next year (e.g. 2008) into the Replace With box.
  4. Click Replace in All Opened Documents.
Photo editing directory FTP program

Scouting Photography Pages - Optional if you have time

Update the Scouting Photography pages at http://troop174.info/History/Photography101/aaPhotography.html with recent examples from Troop 174 photographs.  By the time you are able to contemplate this, you will not need step-by-step instructions.

Year images - Optional if you have time

.
The small images like the one on the left are on the Future Months page, then gradually they migrate to the home page, to past months, and finally in the larger version on the right to the page for that year that gets saved away.

Master files for making Year Banners (Year plus list of months, and scout in the background).  To download right click on links below and either "Save Target As..."  or "Save Link As..." depending on your browser.  If the browser tries to save as .htm you may have to edit the extensions to .xcf and .psp.

But you should check out the GIMP layered image Year2008-320x240-2020-GIMP-Format.xcf which was used to make images from 2008 to 2020.  From this single image all the BMP images in the subdirectory were made (high color resolution), and then from these the GIF images on the website were made.

If you want to make your own year images

  1. Open Year2007-320x240-PaintShopPro-Format.psp
  2. In the image window Dialogs / Layers brings up the Layer window that shows where all the sub-images are.
  3. Drag and drop new images in, being sure beforehand that they are at 320x240 resolution.
  4. Type your own new year if past 2020.  Use Sans Bold 60 Pixel Green at 255.  No need to create a new layer; they create themselves automatically whenever you do something.
    1. Month names are 24 pixels, white, if you want to change any of them.

Grid Calendar Test - Future Maybe

Experimental grid calendar test is at http://troop174.info/indexTest.html#January.  Do not use as a calendar, just to evaluate, as event entries are out of date.  Send me your opinion.  Bear in mind that it requires considerably more work for the webmaster to maintain two calendars, one grid and one detailed, and the links between them.

Be sure to click on "* Details" on events that have that link to see how it takes you directly to details.

The Grid Calendar has two ways to go, Small and Medium.  Medium is the example that I set up

  • Small Calendar with just the event names, and one hotlink to the top of the month on the detailed calendar.
  • Pluses are a simple clean look and little of the double-update problem.
  • Minuses are that you never know if any event has more details and have to click to see for all of them and it may take some searching on the detailed list to find them.  Having a direct link to each event in the detailed list would make that easier, but at great cost to Webmaster effort.
  • Medium Calendar with more detail on each item in the grid.
  • Pluses is that because simple events can have their full details on the grid calendar, then only a few need links to the detailed calendar, and that those links can be direct to the event, not to the top of the month.
  • Minuses are more work for the Webmaster to make links direct to each event that has more details, and for simple events the double updating problem that a change in event detail on both the Grid and Detailed list have to be kept in sync.
  • Adding a grid calendar on top of the details can be done any time.
     

    How the Protected Pages Work

    How the password protected pages work is easy to see.  Look at the source HTML code in file pwYourPassord.html.  When the user types password YourPassord then pword look for a file named pwYourPassord.html.  So, our current password, call it YourPassord, takes troop insiders to that page pwYourPassord.html.

    If you want to change the troop password from YourPassord to zyxwv, then simply rename the target file from pwYourPassord.html to pwzyxwv.html.  Nothing else need be done.  It really is just that simple.

    The pages are protected through obscurity, a medium level of security.  Anyone who knows the address of the page can see it, but there are no links from the main pages to the protected pages, and the pages have hard-to-guess names.

    Just to be on the safe side, keep up the convention of protected pages excluding robots, so in the off chance that a search engine finds the pages, it will not make them findable in a user search.  See
        http://www.robotstxt.org/wc/exclusion.html#meta
    and follow its advice to add the
        <META NAME="ROBOTS" CONTENT="NOINDEX, NOFOLLOW">
    tag in the header of each new protected page you make.
     

    Notes on the website

    Design Principles
    You are now ready to modify the site.  You have your own ideas on web design I'm sure, but let me try to sell you on our design ideas.
    1. Lipscomb's Web Design Lemmas:
      1. "The principal object of website design is for an individual to express his personality defects." - James S, Lipscomb
      2. "A web page is not an accomplishment; it is another mouth to feed." - James S, Lipscomb
      3. "No one will ever tell you to take something out of a web page." - James S, Lipscomb
    2. NO SCOUT OR ADULT NAMES ON THE WEBSITE, at least the publicly-accessable part, from the Council Web Site document link below.  We use first name and last initial to make names non-identifiable.
    3. Less technology gives more technology.  By keeping web pages technically simple, just lists at most, we add the technology of rendering them on Palm and Pocket PC devices with a variety of web viewers (AvantGo and Plucker for example).  These simple web viewers, small enough to fit in a pocket device cannot handle frames, style sheets, or other fancy HTML.
    4. A large top level page with pretty much everything one needs to know for the next few months is an idea that has been warmly received by our users.  No digging needed to find things, it is all just there.
    5. Be modem friendly.  Not everyone is so rich and up-todate with equipment as the web master.  Honor and embrace those who have less, and are on slow modem lines.  They will be too embarrassed to complain.  Keep images small.
      1. Learn when to use JPEG format (natural images) and when to use GIF format (when there are large flat areas, such as in maps or printed documents).  Sometimes GIF can beat JPEG compression by a country mile.
      2. Learn how to squeeze down the size of JPEG images by reducing the quality level until they scream.  Note that this entire starter website fits on a floppy disk.
      3. Learn how to squeeze down the size of GIF images by reducing the number of colors.  I like to reduce the number of colors to 5, then edit the color map to make some of those the same color, then save the image, reload it, and save it again.  This reduces the number of colors to what I wanted in the first place.
    6. Adopt a consistent style for all troop pages.  This traditional technique of graphic design comforts and orients the reader while letting them focus more easily and quickly on the different content of the pages.  Troop 174 has a white background with a first line of "Troop 174" and a second line with the title.  There is a small image centered just underneath that to brighten up the page without making it slow to load.
    7. Isolate files for a particular year in that year's directory.  This lets you start off almost fresh each year, with last year's files tucked away.  Unfortunately, that means that each year you must (after saving a copy to copy and paste events from to future years) the inPastMo.html and photos.html pages down two levels and then adjust the relative links within these pages.  Details are below, but after this onerous task is done, the pages are out of the way for next year.
    8. Alphabetize related files together, for example a page, "pda.html" and the image it uses, "PdaCa.jpg."   Another example, if you take a lot of pictures is alphabetizing all photos by event name, with the first event of the year starting with "a", the second with "b", etc.; see CreateWebsite2\CopyToWebsite\History\Y2003\Photos.  Alphabetizing like this at first seems unimportant, but becomes more helpful with each file added to the website.  In 5 years, you will be very happy you did.

    Webmaster Links