Twitter layouts
This topic describes:
- how customer support sets up alternative HTML layouts
- how to select alternative layouts in the Twitter paragraph
- how to edit alternative layouts using HTML, CSS, and Velocity
Vy3Z-twitter-layouts.mdxTo receive up to two alternative layouts, contact customer support.
To create HTML layouts, set up alternative layouts for mobile and text versions also. If no alternative layouts are saved for those versions, the default layout is used.
Note
In some cases, some text elements will not be in the order that you want.
Vy3Z-twitter-layouts.mdxSelecting a layout
To select a default layout or one of up to 2 alternative layouts, while editing a message in the Template Kit, do the following:
- On the left side of the preview, in the menu bar of the Twitter paragraph, click Twitter. The configuration window opens on the right.
- Click the Options tab.
- In the Layout area > Layout drop-down list, select the layout you want to use.
- Click Apply.
Vy3Z-twitter-layouts.mdxEditing a layout
You can edit alternative layouts, but not the default layout.
Warning
If you lack knowledge of HTML, CSS, and Velocity, contact customer support to edit the alternative layouts. If you edit them without in-depth knowledge, serious display errors may occur in your mailings.
- In the preview on the left, click Settings. The configuration window opens on the right.
- Open the Twitter tab. Each layout has source text fields for the desktop, mobile, and text versions.
- Edit the source text of the corresponding layout as needed. Under Inserting content, read how to place the various contents.
Tip
Set up alternative layouts for mobile and text versions also. If no alternative layouts are stored for these versions, the default layout is used.
- Click Apply.
Vy3Z-twitter-layouts.mdxInserting content
Access the content of the Twitter paragraph using Velocity variables and format the transferred content using HTML style attributes.
The following Velocity variables are available:
- Status. Information on current item paragraphs
- Present. For using queries that check for the presence of an element
- Value. For issuing the content
Notes for the creation of new layouts
- Font definitions. If you are using an alternative layout variant, font definitions must exist in the HTML you entered. The texts are not formatted by the Template Kit to give you complete freedom in visual design.
- Widths. Specify a fixed width or a width in percent. You should enter a percentage, because this prevents elements from sticking out of the layout.
- Danger of display errors. If you edit the layouts without in-depth knowledge of HTML, serious display errors may occur in your mailings.
Status variables
Variable | Type | Description |
|---|---|---|
$twitterItemFirst | Boolean | Is true if it is the first tweet in the Twitter paragraph, or is otherwise false. |
$twitterItemIndex | Integer | Contains the position of the post within the Twitter paragraph as a number (1 for the first tweet, 2 for the second tweet and so on). |
$twitterItemLast | Boolean | Is true if it is the last tweet in the Twitter paragraph, or is otherwise false. |
Present variables
Variable | Type | Description |
|---|---|---|
$twitterTextPresent | Boolean | Contains true if there is content for the Text box, or otherwise false. |
$twitterAuthorPresent | Boolean | Contains true if there is content for the Author box, or otherwise false. |
$twitterDatePresent | Boolean | Contains true if there is content for the Date box, or otherwise false. |
$twitterLinkTextPresent | Boolean | Contains true if there is content for the Text box in the Link area, otherwise false. |
$twitterLinkUrlPresent | Boolean | Contains true if there is content for the URL box in the Link area, otherwise false. |
$twitterImageUrlPresent | boolean | Contains true if there is content for the Image box in the Image tab, otherwise false. |
$twitterImageAltTextPresent | Boolean | Contains true if there is content for the Alternative text box in the Image tab, otherwise false. |
$twitterImageLinkPresent | Boolean | Contains true if there is content for the Link box in the Image tab, otherwise false. |
Value variables
Variable | Type | Description |
|---|---|---|
$twitterTextValue | String | Contains the content of the Text box. |
$twitterAuthorValue | String | Contains the content of the Author box. |
$twitterDateValue | String | Contains the content of the Date box. |
$twitterLinkTextValue | String | Contains the content of the Text box in the Link area. |
$twitterLinkUrlValue | String | Contains the content of the URL box in the Link area. |
$twitterImageUrlValue | String | Contains the image URL from the Image tab. |
$twitterImageAltTextValue | String | Contains the content of the Alternative text box in the Image tab. |
$twitterImageLinkValue | String | Contains the content of the Link box in the Image tab. |
$editBar | String | Inserts the paragraph's button bar. This is required to integrate the button bar into the table, such as when implementing adjacent items. If this variable is not available, the button bar is placed above the item. |