LoremIpsum is a random text generator that helps designers quickly add placeholder text to mockups. It uses a database of sentences and intelligence to generate random, non-repetitive text.

Use the LoremIpsum command panel to generate text in preset styles as paragraphs, words, lists (plain, bulleted, numbered), and characters. You have flexibility in determining the font, font size, line height (leading), font weight, and font style (see Figure 1).

Figure 1. LoremIpsum panel in Fireworks

You can also use LoremIpsum to convert selected text to lowercase, uppercase, or sentence case. You can also add text to a selected path (text in path), and add more placeholder text to an existing text block.

Note: LoremIpsum works in both Fireworks CS3 and Fireworks CS4.

Requirements

To make use of the LoremIpsum extension, you need the following software and files:

Fireworks CS4 (or CS3)

• Try
• Buy

LoremIpsum extension

• Download from the Fireworks Exchange

LoremIpsum generator basics

Double-click the LoremIpsum.mxp file to install the extension. Adobe Extension Manager guides you through the installation process.

If the Lorem Ipsum panel is not already visible in Fireworks, select Window > LoremIpsum.

To specify paragraphs, lists, words or characters

1. Select the option you want to generate from the drop-down list (see Figure 2).

2. Enter a number in the text input field next to the drop-down list and click the Generate Lorem Ipsum button at the bottom of the panel. Doing this adds a text block starting at the top left of the canvas.

   

   Figure 2. Selecting the text to generate

To generate text with predefined styles

You can specify the format of the text that you want to generate—including paragraph and character styles. Select the predefined style from the Preset drop-down list (see Figure 3) and click Generate Lorem Ipsum to generate a block of text with preset styles. You can change the font, font size, line height settings for the selected style.

Figure 3. Generating predefined styles

To append text to an existing text block

Select the text block to which you want to append a new block of text. Select the Insert and Typography options and then click Generate Lorem Ipsum. This adds a block of text to the selected text block.

To add text to a custom location and within a selected width

Draw an empty text block, select the Insert and Typography options, and click Generate Lorem Ipsum. This adds a block of text to the selected empty text block.

[Fireworks CS4 only] To add text to any custom path (Text In Path)

Select any vector element and then select the Insert and Typography options, and click Generate Lorem Ipsum. This adds a block of text inside the selected vector element.

Note: This will not work on a group of vectors or auto shapes.

To change the text case

Select the text block on the canvas and click either the c, C, or Ca button (see Figure 4) to convert the selected text to lowercase, uppercase, or sentence case, respectively.

Figure 4. Changing the case of selected text

Using the LoremIpsum generator

Let's now use the LoremIpsum generator to fill some dummy text in a sample mockup page (see Figure 5).

Figure 5. Sample page mockup

Filling placeholder A

We want to fill placeholder A with a single line text of size H3 and start each word with capital letters, fitting within the bounding box. Follow these steps to use LoremIpsum in such a scenario:

1. Create an empty text field to define the maximum width (see Figure 6).

   

   Figure 6. Defining the empty text field in section A

2. Select Words from the Insertdrop-down list and enter 5 in the text field.

3. Select H3 from the Preset drop-down list and modify other Typographyoptions to suite your requirements. In Figure 7 we unchecked the italics check box.

   

   Figure 7. Lorem Ipsum selections for section A

4. Click the Generate Lorem Ipsum button.
5. Click the Ca button to convert the first character of each word to uppercase.

The placeholder text appears as in Figure 8.

Figure 8. Placeholder text in section A

Filling placeholder B

Here we want to fill placeholder B with a bulleted list of normal-sized text and width, not exceeding the bounding. Follow these steps to use LoremIpsum in such a scenario:

1. Create an empty text field to define the maximum width (see Figure 9).

   

   Figure 9. Defining the empty text field in section B

2. Select Bulleted List from the Insertdrop-down list and enter 12 in the text field.

3. Select Paragraph(.p) from the Presetdrop-down list and Default from the Font list (see Figure 10)

   

   Figure 10. Lorem Ipsum selections for section B

4. Click the Generate Lorem Ipsum button to fill the empty text field with the bulleted list (see Figure 11).

   

   Figure 11. Placeholder text in section B

Filling placeholder C

In this last case we want to fill the area surrounding the car picture with dummy text. Here are the steps to use LoremIpsum in such a scenario:

1. Draw a vector path outline for the area in which you want the text to be filled (see Figure 12).

   

   Figure 12. Defining the empty text field in section C

2. Select Paragraphs from the Insertdrop down list and enter 2 in the text field.

3. Select Paragraph(.p) from the Preset drop-down list and Default from the Font list (see Figure 13).

   

   Figure 13. Lorem Ipsum selections for section C

4. Click the Generate Lorem Ipsum button to add the text inside the selected path (see Figure 14).

Figure 14. Placeholder text in section C

The mockup page is now filled with dummy text to make it look more realistic when reviewing it with your clients (see Figure 15).

Figure 15. Placeholder text in the sample page mockup page

About the authors