Stroke and Shadow Text Effects

You can decorate text with stroke and shadow effects. Customer's Canvas allows for importing these effects from Photoshop. Also, you can make them in the web-to-print editor.

Strokes and Shadows

It is quite easy to create these effects in Photoshop. Let us go through the process of creating a template with stroke and shadow text effects.

  1. Create a new template in Photoshop.
  2. On the Tools panel, click Type Tool.

    Click the Type tool.

  3. Click where you want to place a text, and enter some text. Click Done in the Options panel when you are finished.

    The Done button.

  4. On the Layers tab, click Add a layer style, and then click Stroke.
  5. In the Layer Style dialog box, click Ok to set default stroke settings.
  6. Repeat steps 2 - 5 for a shadow effect.
  7. Now, the Layers tab looks as follows:

    The stroke and shadow.
  8. Save the template and open it in Customer's Canvas.

    The stroke and shadow effects in the editor.

Now, you can edit these effects in the editor using the Stroke and Shadow buttons.

You may want to disallow your users from editing strokes or shadows in loaded templates. To turn stroke editing off, add the <TAEST_f> marker to a layer name. The <TAESH_f> marker disables shadow editing. Using these markers, you remove corresponding buttons from the Top Toolbar.

To remove the Stroke and Shadow buttons for all products, set the textStrokeButtonEnabled and textShadowButtonEnabled properties of TopToolbar to false in clientConfig.json. For more details about the Top Toolbar customization, refer to the Customizing User Interface topic.

Stroke Design

In Customer's Canvas, you can control the width and color of a text stroke. To see the settings, click the Stroke button on the Top Toolbar.

The Stroke dialog.

To change the width, move the slider or type in a value next to it. This value is measured in points. To change the color, click the color box. You can set up the range in which the width can be changed through the textStroke property.

Shadow Design

In Customer's Canvas, you can control the angle, distance, size, and color of a text's shadow. To see the settings, click the Shadow button on the Top Toolbar.

The Shadow dialog.

To set up a numeric value, just move a slider or type in a value next to it. Angles of a light source are measured in degrees. Distances, the shadow's offsets, are in points. Shadow size is in pixels here. To change the color, click the color box. You can set up the ranges in which the angle, distance, and size can be changed through the textShadow property.

See Also

Manual