iWeb is winding me up - how do I outline text?

[bananabar]

I'm trying to do a really simple site but iWeb is getting on my tits!

I want "two" to overlay "one" but still be readable, so need to give it a black border - HOW DO I DO IT?!

 

[sickmacdoc]

Well assuming the example attached is along the lines of what you are looking for, I don't think you will find what you need within iWeb itself.

In the example I just created the block in a graphics program first (one that supports "stroking" the text in this case Photoshop Elements) and saved it with a black background. This graphic could then be imported into your page using the Insert-->Choose... selection to add it to your page.

 

[Mr Skills]

Why not make a copy of the "two", make the text bolder, make it black, and then put it under the "two" (but above the "one")?

 

[bananabar]

Well assuming the example attached is along the lines of what you are looking for, I don't think you will find what you need within iWeb itself.

In the example I just created the block in a graphics program first (one that supports "stroking" the text in this case Photoshop Elements) and saved it with a black background. This graphic could then be imported into your page using the Insert-->Choose... selection to add it to your page.

I've got Elements - could you explain a little more?

Thanks.

 

[sickmacdoc]

I've got Elements - could you explain a little more?

Thanks.

Sure- will give it a shot. These instructions should be almost identical whether you are using the current v. 6 of Elements or the previous v. 4. I just checked and the commands are named the same in at least those two versions. Also, please understand ahead that it takes far longer to read this than to just do it- so don't be discouraged!

So--
1. Open a new blank document. Set to the size to something reasonable (800x800 pixels?), tell it to make the background "transparent" (we'll change that later) and use 72 pixels/inch.

2. In the layers pallete, make two more blank layers for a total of three.

3. Click on Layer 2. Use the type tool to enter the text that you will want to be on the bottom in the stack (in your case "One"). Use a fairly large size for clarity- 72pts or so. You can adjust the size of the graphic in iWeb later to fit, but it is better to start a little larger than you may want it. Make the type white before or after setting it. Click the checkmark at the top of the screen to commit the edit.

4. Go under the Layer menu at the top and select "Simply Layer"

5. Go under the Edit menu above and select "Stroke (Outline) Selection"

6. In the window that appears, select the color you want to outline with, enter the desired width, and select "Outside" for location of the stroke. Click OK and the stroke will appear. If you want to change anything (to lighten it, make it heavier, etc.) just go to Edit---> Undo Stroke and do it again.

7. Now go to layer 3 in the layers pallette, and repeat 3-6 for that layer.

8. Use the Move tool to move layer 3 into the right place over layer 2. Use the arrow keys to make one pixel at a time movements for fine tuning the location once you have it roughly in place using the mouse.

9. Once you are satified, click Layer 1 in the layers pallette and use the Fill tool to make it solid black.

10. Use the Crop tool to trim the block down to just larger than the graphic.

11. Finally, go to Layers---->Flatten Image to get rid of the three layers and combine them into one, then select Save As.... from the File menu and select PNG as the type at the bottom of the window. Give it a name and save it.

12. Use Insert--->Choose.... in iWeb to locate and import your new graphic. It will already be selected so hold down the Shift key and drag one of the corners to resize it as necessary, then click and hold the middle of it to drag it into the correct place. Hold Shift and do any fine tuning on the size (shift keeps it proportional when it resizes so you don't get it out of proportion either horizontally or vertically BTW).

13. Whew- done.

Hope this helps, and ask again if you have any questions.

 

[bananabar]

Wow! Thanks so much for your help - you can go about your day knowing you've done a lovely thing!

If ever you're in London, I owe you a beer.

Thanks again.

 

[sickmacdoc]

Glad it helped out- and I'll put that in my notes and hold you to it!