How to make a Screen Savers Filter Page

"Filter page" is the fancy name what you'll find at http://www.thescreensavers.com/. It is the Internet face of "The Screen Savers."

Because it is an Internet face, the filter page must experience all the things you do to your regular face before you go to work. Cleansing, cremes-application, exfoliation, X-Foliation, tweezing, nasal-hair trimming, you name it. It's not like you head to work without combing your hair and wearing a loin cloth, except for if you're Josh Lawrence.

Out of all the fun things there are to do in the world, "stacking" (Internet speak for "putting together") the filter page is the most fun thing to do ever. So much fun, in fact, that you may reach orgasm.

This brings us to our first tip:

Tip No. 1: Bring a towel and cigarettes to work.

Filter page ingredients

The "Screen Savers" filter page should be stacked and published by 3 p.m. every day. Each day's filter page must include all of the following elements:

1. Links to the segments on today's show.
2. Links to popular articles from the past week.
3. Links to the latest Windows Tip, Dark Tip, Download of the Day, and Mod Tip.

Getting started

To do anything involving filter-page production, you need to use the CMA. Here's how to get to where you need to go.

1. Go to http://cma.techtv.com/.
2. Find "Filter Pages" in the left navigation column. Click "Edit."
3. Scroll down the filter page menu until you find the one labeled "The Screen Savers." Click the "Select" button.
4. You're ready to stack the filter page.

You'll notice that in the CMA, the filter page looks like a big list of teases with numbers to the left of them. The placement of each item on the filter page depends on these exciting numerical codes. The codes may baffle you at first, but you'll soon get the hang of them.

We'll talk more about the codes later. But first, some fundamentals.

THE FUNDAMENTALS

Adding teasers

Where do the teasers on the filter page come from? Funny you should ask, because it's your job to add them.

Here's how to do it.

1. Keep the CMA filter page editor open in one browser window. Open a new browser window.
2. In the new window, find a story you want to add to the filter page.
3. Click the "Add a Teaser" button at the bottom of the CMA.
4. Select the radio button next to "Story." (Read the next section for an explanation of teaser types.)
5. Copy the story ID from the article you found in step 2. Paste it into the "Story ID" field and hit Enter.
6. This will bring up any teases and graphics that have already been written for that story. If none have been written, you'll need to write one and assign a graphic to the teaser.
7. Select the radio button next to the teaser you want and click "Save Selection."
8. This will place the selected teaser at the top of your filter page queue.

Now that your teaser is added, you need to make it appear in the appropriate place on the filter page. That's where those pesky numerical codes come in.

Teaser types

Story
This is the most common. You'll use it to add a link to a TechTV Web article.

None (Free-form teaser)
This is the second most common. It's not associated with any story, and it's the type of teaser we use for filter page headers such as "On Friday's Show," "The Screen Savers Favorites," and the like. We also use free-form teasers for hard-coded links and teasers that don't link to anything.

Filter
This is used to tease to another filter page.

External Link
This is a link that doesn't have an id in the system. It can be truly external, or it might be something like an archive link that doesn't automatically have an id in the system.

Changing the date/time

Each story has a set date and time to "flush" (publish live to the site) and delete itself from the live site. If you're adding teasers manually, it's important to make sure the end date/time won't delete the teaser until you update the page.

The publish date appears on the left and the delete date appears to the right. The publish date will have a default setting of "01/01/1970," which you don't need to change if you want your changes to appear on the site immediately after you flush the page.

The delete date will also have a default setting of "01/01/1970," which you will need to change. To make sure teasers appear on the site until you manually delete or change them, change the year on the delete date to 2010.

The secret is in the codes

Here's a rough guide to each numerical code and what they mean in terms of filter-page placement.

301-319: Teasers for the "More Tips" module in the third column.
500: The "On Today's Show" header.
501-519: Teasers for today's show.
520: Open slot used to highlight breaking news, contests, new shows, etc.
521-525: Teaser(s) for highlighted content.
560: The "Screen Savers Favorites" header.
561-579: Teasers for "The Screen Savers" favorites (popular stories from the past week).

APPLY THOSE FUNDAMENTALS

Changing the "On Today's Show" header

Scroll down to the 500 spot. You should see a teaser that says "On (Today's) Show." You'll need to edit this to make sure the right day appears on that day's filter page.

1. Click the "Edit" button on the teaser.
2. Update the headline text with the correct day.

Placing teasers for "The Screen Savers" favorites

The first step in filter-page production is to identify the popular stories from yesterday's show and add them to the "Screen Savers Favorites" section.

Every morning, Tom Merritt sends out a list of the top 50 traffic-driving stories on TechTV.com. Find this message in your email and proceed to step 1.

1. Identify the top traffic-generating stories from yesterday's show. The stories from yesterday's show will be in slots 501-519.
2. Change the number codes to reflect where you want them to appear in the Screen Savers favorites section (slots 560-575).
- The two top stories from yesterday's show should appear in slots 561 and 562.
- If they're still in the top 50, the stories in yesterday's 561 and 562 slots should be moved down to slots 570 and 571.
- Everything else in the TSS favorites section should be moved down a spot or two.
- Check the "Delete" box next to any stories that aren't in the top 50.
3. Once you've re-ordered the favorites section and deleted old stories, click the "Save Changes" button at the bottom of the page.

Now you're ready to add today's stories to the filter page.

Placing teasers for today's show

1. Visit today's show notes and add teasers for all original TechTV Web content written for the show.
2. Once they've all been added to the filter page, they'll appear at the top of the filter page queue with a numerical code of "0".
3. Change the delete dates for all the stories you added to "01/01/2010 04:00 PM" (no quotes).
4. Change the number codes for the stories on today's show to reflect where you want them to appear.
- Teases with graphics should appear in slots 501-505.
- Teases with decks but no accompanying graphics should be in slots 505-510.
- Teases you want to appear as bullet items ("Come See the Show," "Join the LAN Party," etc.) should appear in slots 511-519.
- Delete any stories from yesterday's show that weren't added to the "Screen Savers Favorites" section.
5. Once you've updated the dates and number codes, click "Save Changes" at the bottom of the page.

You're almost done. Now it's just time to see if the Tips Module is up-to-date.

< Adding teasers for the More Tips module

If there was a Dark Tip, Mod Tip, Download of the Day, or Windows Tip on yesterday's show, now's the time to add it to the More Tips module.

1. Copy the story ID for the tips or download story from yesterday's show.

2. Click the "Add a Teaser" button at the bottom of the page.

3. Enter the story ID in the "Story ID" field. Press Return.

4. Compose a new teaser for the story. It should consist of just a brief, snappy headline that describes the tip. For examples, check the headlines in the current More Tips module.

5. Depending on the type of tip, copy and paste the following code after the headline:

- For a Windows Tip:
>> Windows Tip archive

- For a Mod Tip:
>> Mod Tip archive

- For a Dark Tip:
>> Dark Tip archive

- For a Download of the Day:
>> Download archive

6. Select the radio button next to the teaser you want and click "Save Selection." This will put the teaser at the top of the filter page with a number code of "0".

7. Change the delete date for the teaser to "01/01/2010 04:00 PM" (no quotes).

8. Change the number code for the teaser depending on the type of tip.

- For a Windows Tip: Delete the teaser that appears in the 307 slot and add the new teaser to the 307 slot.
- For a Mod Tip: Delete the teaser that appears in the 309 slot and add the new teaser to the 309 slot.
- For a Dark Tip: Delete the teaser that appears in the 311 slot and add the new teaser to the 311 slot.
- For a Download of the Day: Delete the teaser that appears in the 313 slot and add the new teaser to the 313 slot.

9. Once you've entered the new tip in the slot and deleted the old teaser, click "Save Changes" at the bottom of the page.

Adding more sections

We often want to highlight a story from another TechTV show, a special page, a TechTV contest, or a breaking news story. When this happens, you'll need to add a new header and put the appropriate teaser under that header.

Here's how to do that.

1. Click "Add a Teaser" at the bottom of the page and select "None (Free-form teaser)".
2. Write your new header in the "Headline" field. (e.g. "Special Report," "New Show on TechTV," "New Virus Attacks," etc.) and press Return.
3. Select the radio button next to the teaser you want and click "Save Selection."
4. Scroll to the bottom of the page and click "Add a Teaser" again.
5. Select the type of page you want to highlight.
6. Compose or select the teaser you want to appear on the filter page and click "Save Selection."
7. Your header and teaser will now appear at the top of the page with a value of "0". Change the delete date to 01/01/2010.
8. Give the header a value of 520 and the teaser a value of 521. This will make them appear between the "On Today's Show" section and "Screen Savers Favorites" section.
9. Scroll to the bottom of the page and click "Save Changes".

Previewing the page

Now you're ready to see if the page looks OK to publish. Click the "Preview" button at the top of the page to see what your changes look like. If there's a problem with the way it looks, consult the guide below.

Teasers not showing up on the preview page?
Check to make sure you changed the delete date for the teaser to "01/01/2010" or sometime in the future. Also, check the publish date to make sure it's "01/01/1970" or some date in the past.

Teasers still not showing up?
Make sure two of them aren't assigned the same number code. If two teasers have the same numerical code, only one will display on the page.

Graphics not showing up?
Even if they're assigned to a teaser, graphics only appear in slots 501-505 for the "On Today's Show" section, and slots 561-565 for the "Screen Savers Favorites" section. If you want your teaser to appear with a graphic, it should be in one of those slots.

Page too long?
If the page looks cluttered or too full of information, try cutting down on the number of teasers with graphics. Keep a couple of teasers with graphics in the "On Today's Show" section, and move the rest down to the 505-510 range to display without graphics. In the "Screen Savers" favorites section, just use one graphic teaser and move the rest of the teasers down to the bullet-list section (570-579).

Flushing the page

Once everything looks perfect, it's time to press the "Flush" button at the top of the page. It will make all your fabulous updates appear live on the site.

The changes should appear on the live site almost instantly, but there's sometimes a 5-minute delay. Give it 10 minutes. If your changes still aren't appearing after that long, file a bug report through the CMA.