With the Ecrion Design Studio Publisher you have the option to create a new stylesheet depending on the Device it will be viewed on: phone, tablet, computer, or print.

 

 

1. Select the Manage Styles button located under the Home tab, in the Ribbon.

 

Figure 1: The Manage Styles button is highlighted from the Home tab.

 

2. You will either start with the default stylesheet as the stylesheet to be used for PDF/ Print documents, or you can assign / create your own. Once you have the base stylesheet assigned select the Add new style button.

 

3. From the New Style Dialog select the device you would like to add a style for, phone, tablet, laptop or TV.

 

4. You will receive a notice that there is no stylesheet attached for that device. Select Yes to create a new stylesheet for that device.

 

5. Browse and save the stylesheet in the folder needed.

 

6. Give the style a name and adjust the properties as needed, then select Apply.

 

7. The newly added style will appear as a single click option in the Styles Pane and in the Home Tab. Apply the styles the same as you would for a PDF output.

 

Important Questions:

 

- I created a new style for a different device, and when I apply it the Design Surface shows the wrong formats.

       If this happens it is most likely because you have a corresponding style in your base stylesheet for a PDF and this is what is showing in the Design Surface. View your document by going to the Web View, and select the correct device to see if the correct style has been applied.

For example: In your base stylesheet you have a style Heading1, then you create a stylesheet for the phone device also with a Heading1 style. The style from the base stylesheet will appear in the Design Surface but the style from the phone stylesheet should show in the Web Preview.

 

- I created a new style for a different device, and when I apply it nothing changes in the Design Surface.

       This is similar to the above. This happens because there is no corresponding style in the base stylesheet. Like above, use the Web View to preview your document to make sure it has been applied correctly.

For example: In your base stylesheet you have a style Heading1, then you create a stylesheet for the phone device and add a style Heading_1. When you apply Heading_1 it will appear as if nothing has happened because there is no corresponding Heading_1 style in the base stylesheet.

 

Viewing the Different Outputs

 

Navigate to the View tab and select the Web View option. This will allow you to view the document with the stylesheet changes.