Authoring tools element design examples

You can format an authoring tool element's look and feel in different ways, including displaying authoring tools as text based links, or image based links.

You use placeholder tags to display authoring tools. You can only use these placeholder tags in authoring tool designs: See the Using Placeholders in element designs topic for further information.

Text-based authoring tool

This example describes the element designs used to display a text-based authoring tool. Each design includes placeholder tags that are used to generate the text and link for each authoring tool. Each link uses the target="_blank" tag to make the authoring tool action open in a new browser window instead of replacing the current page.
New action design:
<a href="<Placeholder tag="href"/>" target="_blank">
<Placeholder tag="name"/></a>
Read action design:
<a href="<Placeholder tag="href"/>" target="_blank">
<Placeholder tag="name"/></a>
Edit action design:
<a href="<Placeholder tag="href"/>" target="_blank">
<Placeholder tag="name"/></a>
Delete action design:
<a href="<Placeholder tag="href"/>" target="_blank">
<Placeholder tag="name"/></a>
Approve action design:
<a href="<Placeholder tag="href"/>" target="_blank">
<Placeholder tag="name"/></a>
Reject action design:
<a href="<Placeholder tag="href"/>" target="_blank">
<Placeholder tag="name"/></a>
Header:
<div><span>
Separator:
</span><span>
Footer:
</span></div>

Image-based authoring tool

This example describes the element designs used to display an image-based authoring tool. In this example, the <Placeholder tag="name"/> tag is replaced with a component tag referencing an image component. Before creating these element designs, you must create an image component for each image used in the design. In this example, the following image components are required:
  • new-image
  • read-image
  • edit-image
  • delete-image
  • approve-image
  • reject-image
New action design:
<a href="<Placeholder tag="href"/>" target="_blank">
<component name="new-image" /></a>
Read action design:
<a href="<Placeholder tag="href"/>" target="_blank">
<component name="read-image" /></a>
Edit action design:
<a href="<Placeholder tag="href"/>" target="_blank">
<component name="edit-image" /></a>
Delete action design:
<a href="<Placeholder tag="href"/>" target="_blank">
<<component name="delete-image" /></a>
Approve action design:
<a href="<Placeholder tag="href"/>" target="_blank">
<component name="approve-image" /></a>
Reject action design:
<a href="<Placeholder tag="href"/>" target="_blank">
<component name="reject-image" /></a>
Header:
<div><span>
Separator:
</span><span>
Footer:
</span></div>