Funny Stuff - ecmtb.com Archives

OMG - For those of you who used to be on the old site. There was no gallery for the first several years, and we would do the updates manually after every race weekend or event. Not that any of this means anything but this is what we used to have to do just to build a gallery page. LMAO.

HTML updates for ecmtb.com

Content Page Text.

  1. Open Dreamweaver :slight_smile:

  2. Hit F5 to open the site window.

  3. Navigate to the section which you will be updating.

  4. Open a page that is similar to the one that you are planning to create.

  5. SAVE AS immediatley. Make certain that you save it to the same folder as the other docs. There can be NO SPACES in the name. Use lower case.

  6. Select the header text to the right of the section name at the top of the page and change it to the new title.

  7. Open your Word doc with your final, edited text.

  8. Select all of your text in Word and COPY it.

  9. Select all of the body copy in Dreamweaver. Choose PASTE AS TEXT from the edit menu.

  10. You will now need to go through and add hard RETURNS at the paragraph breaks. Find where they are in the text, insert the cursor and hit return. If it drops down 2 lines, you will need to pull it back up. You shouldn’t be able to insert your cursor in the white space between two paragraphs.

  11. Open the SOURCE window by hitting F10.

  12. Find your body copy. See at the beginning of each paragraph where there is a

    or just a

    tag? Body text has to have

    in there. Items that are subheads need to have

    instead. The author’s name uses

    and the header at the top of the page is

    .

  13. Preview your page in the browser by hitting F12. Make sure everything looks right, especially the text formatiing.

  14. If you have bulleted lists, seperate the items with a hard return (same as 7) and then select them all. Click the bullet button in the toolbar. These items do not need to have a class applied to them, because I control this with a

      class in the style sheet.
  15. Save your File. (You’ve been doing this all along, no? :slight_smile:

Inserting images

  1. Drop your properly named and sized images into the current directory’s IMAGES folder. Make sure that everything is uniquely named.

  2. Go back to your Dreamweaver document. Insert hard RETURNS between paragraphs where you want to place an image. Only three to four images per page please, especially if they are portrait.

  3. Put your cursor in the open space and hit CONTROL-ALT-I. This should bring up the images selction dialog.

  4. Find your picture in the IMAGES directory and select it. Hit OK.

  5. Repeat steps 2-4 for each and every image you want to place, er, palce.

  6. Select the first image on the page. Go to the SOURCE window by hitting F10. Your image HTML should still be selected and will be enclosed in a

    tag (most likely). You have to remove the class info so that all that is left is

    . This is for Netscape’s benefit which does not handle class’ and images well and tends to overlap the bastards.

  7. Save your file.

Editing the SSI Navigation Document.

  1. In order to make the page accessible from the left bar navigation, you need to add a line to the text document SECTIONnav.txt.

  2. NOTE: NEVER EVER EVER open this file in Dreamweaver. Weird shit happens. Instead, open it in a straightup text editor.

  3. There will be a collection of lines that look like this:

Jacks Lake XC

  1. Select one and copy and paste it to the top of the section you are editing.

  2. Change the name of the link in the a href tag. Make certain that you spell the name of your file exactly as it is, no spaces and with the same case as your file name.

  3. Change the title (in this case the “Jacks Lake XC”). Make it exactly the same as the title from the page, for consistency.

  4. Save this file. You can’t preview this locally.

Creating a Teaser

  1. Open the default.shtml page for your section.

  2. Change the headings, text and images to show the section’s new contents. Make sure you use the same styles as are used elsewhere in the site.

  3. Update the links too.

Uploading

  1. Upload all of your files (images and HTML docs). DO NOT UPLOAD the nav.txt file or default.shtml. To upload, select the files, and click the Put button.

  2. Send out an email with the path to your document so that it can be checked by the rest of us.

  3. When it is signed off, upload the other two files and let Jeff know to add a note on the front page.

  4. Crack a beer and move on to the next file.

2 Likes

Photoshop Techniques. lol. Thanks Jeffro!


Picture for the gallery

If pic = Landscape

First thing to do is adjust the levels with ctrl-l (bring up the layers palette ) you should be able to tell by looking at the he to a nicely rounded histogram. Your goal is to centralize the curve. Don’t go too far. If there is a flat area, drag it to the flat area. Use the gray bar in the middle and try and pull out the mid range tones (think in grey tones).

When you are finished, click ok. You can go back and see what you did by clicking undo. You can also refer to the history palette for undo levels.

Go to Image Size. Leave the Constrain Proportions checked. On the web, everything is 72dpi. Set the resolution to 72dpi.

Horizontal image : Go into the width field and set to 600. The height should stay under 480.

Vertical Image : Set height to 460 - 470 pi.

NB: The goal of these steps is to set the longest edge

Click OK

Now we have a full sized Gallery image.

To add the ghosted logo. Open the logo (transparent). Select all (ctrl-a) in that window and copy (ctrl-C). Switch to the graphic and paste (ctrl-v).

If this looks ok, select the move tool, then select the opacity in the layers window kto somewhere between 40% and 80%. If the picture is really light and the logo is getting loist on the picture. At the bottom of the color palette, there are two color chips. Top = foreground color. Behind color = background color.

Go to the layers palette and lock transparency (1st checkbox of 4 at top of the palette). ALT+BKSP will fill the image (with the foreground color) which is black as selected.

Now to save: Go to file menu and choose save as. Create filename ( NO SPACES pls). Save it as a jpg. Baseline Optomized. Aim to save a 70k (ish) file.


Making a thumbnail

Image size. Set the width to 150 - no matter if landscape or portrait.

Go to save as and save it as the same thing + sm i.e. chrismarks.jpg would be chrismarkssm.jpg. Click save.

In the JPEG options dialog, set the quality to between 1 and 3. Be sure to have enough detail in the picture that people will be able to save. Aim for 12k file size. Choose Baseline Optomize and click OK to save.


Picture for an article

All of the steps for doing an article pic are the same as the steps before the Making a Thumbnail image but the width can be no more than 300 pi, 72 dpi resolution.

When saving, we are going for mid range quality. Set quality to 5 or 6. File size should be around 30k / pic.

2 Likes

Jesus Christ. I’m sitting here rocking back and forth in the corner with PTSD.

4 Likes

Oh come on, you guys were making big bucks with that site, I bet you were making hundreds (of pennies) from the advertising every month… The whole “running your own business” stuff was a sham, I know it. I wanna get spawnsord so I can do big dorps to falt.

I miss the old site, but I am sure you guys don’t miss all the work that went into it.

1 Like

NOTE: NEVER EVER EVER open this file in Dreamweaver. Weird shit happens. Instead, open it in a straightup text editor.

And this is why I never used Dreamweaver or any WYSIWYG.

I made a website way back then one time and I had to create a pile of forms for somebody to add content to the website. I spend so many gruelling days writing PHP and MySQL queries(something I was never good at) to make it work, then immediately discovered Joomla or Wordpress or one of those a-holes and promptly forgot any PHP or MySQL skill, to this day. CraftCMS is my new joy to work with. Dropped the popular Wordpress years ago.

I never used Dreamweaver as a WYSIWYG, only as a code editor. For a while, it was one of the best on the Mac. But that was a long, long time ago.

I haven’t coded in the better part of a decade and that’s just fine with me.

Funny, I was just talking about that last night with the MBH crew. It was easily a second full time job for each of us.

Given the traffic it generated (in the heyday, we were getting 100,000 unique visitors/month! That was a LOT in 2005), it should have been able to become a full time business for at least a couple of us. Look where Pinkbike or NSMB are now, they generate pretty decent revenue. None of us were ever really willing to make that leap on it though. Sometimes I wish I had, but I like the business I own now much better,.

4 Likes