14 | Create An HTML Version

Now that our projectx content is finalized and prepped, we finally begin the actual file conversion processes.

In this section, we create the raw HTML version of projectx.

I promise this is a lot easier than you think it'll be. (For the complicated stuff, wait until the next section.)

Raw HTML Conversion Process

Prepare htmlslug.txt

Let's start by taking a look at the htmlslug.txt file downloaded during Section 5.

EXHIBIT A:

We use this file as a template to receive our projectx content.

htmlslug.txt is intended to be reused over and over again. Make sure to use SaveAs, first thing, as outlined below. (SaveAs creates a copy with a different name, leaving the original intact.)

ACTION: Prepare htmlslug.txt template

1. Open htmlslug.txt in your plain-text editor of choice.
2. Before making any changes, use SaveAs to rename the file projectx.html
3. (NOTE THE FILETYPE!!! -- the filetype will be .txt by default. Users must type projectx.html into the Filename field, just like that, or they will end up with projectx.txt instead of projectx.html).
  - Navigate to ensure this file lands in the desktop production folder.
  - On the very bottom of the SaveAs pane, change the Encoding setting to UTF-8. (see Exhibit C below)
  - Click Save to close the SaveAs pane.
4. Make sure the plain-text editor is NOT set to word wrap. (see Exhibit B below)
5. Replace the ###### symbols with the name and author of projectx (shown in both EXHIBIT A & D).
6. Plain-old save projectx.html.

EXHIBIT B:

No Word Wrap: (If Word Wrap has a check to its left, un-check it.)

EXHIBIT C:

Encoding: (This setting is usually something like ANSI by default)

Transfer projectx Content

In these steps, we copy and paste all of final_projectx into projectx.html.

1. In the Find/Replace word processor, open final_projectx.
2. Select and copy the entire final_projectx file. This can be done a few different ways:
  1. Click anywhere in the final_projectx file and press ctrl+a (mac: cmd+a) and then ctrl+c (mac: cmd+c).
  2. Depending which word processor you’re using, somewhere in the menus will be a ‘Select’ option. Choose Select All, then right-click anywhere in the file and select Copy.
  3. Google is your friend.
3. Return to projectx.html in the plain-text editor.
4. Click between the <body> and </body> tags somewhere. (see Exhibit D below)
5. Paste in the entire final_projectx file by pressing ctrl+v (mac: cmd+v) or whatever method you're used to using.
6. Once projectx has successfully landed in projectx.html, plain-old save the projectx.html file.
7. Close all open versions of projectx.

EXHIBIT D:

Paste final_projectx content between body tags:

EXHIBIT E:

Voila!

Previous << Header Tags | Next >> Create The EPUB Version

Page updated

Google Sites

Report abuse