Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Paragraph and List blocks for Drag & Drop Editor GA #4415

Merged
merged 2 commits into from
Nov 15, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -40,27 +40,56 @@ Details for each editor block's properties are provided in the following tables.

| properties | description |
|---|---|
| `Title` | Selects the heading style. Only H1, H2, or H3 are available. |
|`Font Family`| This is the font style for your title. |
|`Font Size`| Determines the size of your text. |
|`Text Color`| Modifies the color of the title. |
|`Link Color`| Modifies the color of the link. |
|`Title`| Selects the heading style. Only H1, H2, or H3 are available. |
|`Font family`| This is the font style for your title. |
|`Font weight`| This is the overall boldness of the font. |
|`Font size`| Determines the size of your text. |
|`Text color`| Modifies the color of the title. |
|`Link color`| Modifies the color of the link. |
|`Align`| Moves the title to be left, center or right-oriented. |
|`Line Height`| Modifies the distance between lines of text. |
|`Line height`| Modifies the distance between lines of text. |
|`Line spacing`| Modifies the distance in between each character. |
|`Text direction`| Default left-to-right, but can be edited to be right-to-left. |
{: .reset-td-br-1 .reset-td-br-2}

### Text
### Paragraph

Refer to the following table for details on the `Text` editor block properties.
Refer to the following table for details on the `Paragraph` editor block properties.

| properties | description |
|---|---|
|`Text Color`| Modifies the color of the title. |
|`Link Color`| Modifies the color of the link. |
|`Line Height`| Modifies the distance between lines of text|
|`Line spacing`| Modifies the distance in between each character|
|`Font family`| This is the font style for your paragraph text. |
|`Font weight`| This is the overall boldness of the font. |
|`Font size`| Determines the size of your text. |
|`Text color`| Modifies the color of the title. |
|`Link color`| Modifies the color of the link. |
|`Align`| Moves the title to be left, center or right-oriented. |
|`Paragraph spacing`| Modifies the space between paragraphs. |
|`Line height`| Modifies the distance between lines of text. |
|`Letter spacing`| Modifies the distance in between each character. |
|`Text direction`| Default left-to-right, but can be edited to be right-to-left. |
{: .reset-td-br-1 .reset-td-br-2}

### List

Refer to the following table for details on the `List` editor block properties.

| properties | description |
|---|---|
|`List type`| This is the type of list. Can be either bulleted or numbered. |
|`List style type`| Determines the style of your list. |
|`Start list from`| Determines the starting number for your list. |
|`Font family`| This is the font style for your paragraph text. |
|`Font weight`| This is the overall boldness of the font. |
|`Font size`| Determines the size of your text. |
|`Text color`| Modifies the color of the title. |
|`Link color`| Modifies the color of the link. |
|`Align`| Moves the title to be left, center or right-oriented. |
|`List items spacing`| Modifies the space between list items. |
|`List items indent`| Modifies the indentation of list items. |
|`Line height`| Modifies the distance between lines of text. |
|`Letter spacing`| Modifies the distance in between each character. |
|`Text direction`| Default left-to-right, but can be edited to be right-to-left. |
{: .reset-td-br-1 .reset-td-br-2}

### Image
Expand Down Expand Up @@ -98,9 +127,9 @@ Refer to the following table for details on the `Divider` editor block.
| properties | description |
|---|---|
|`Transparent`| If enabled, 'line' and 'width' options are removed. |
|`Line `| The different line formats, whether dotted, spotted, or solid. In addition, you can modify the thickness and color of the divider line|
|`Width `| Adjusts the spread of the divider in increments of 5 |
|`Align`| Moves the line to be either left, center, or right-oriented |
|`Line`| The different line formats, whether dotted, spotted, or solid. In addition, you can modify the thickness and color of the divider line. |
|`Width `| Adjusts the spread of the divider in increments of 5. |
|`Align`| Moves the line to be either left, center, or right-oriented. |
{: .reset-td-br-1 .reset-td-br-2}

### HTML
Expand All @@ -109,7 +138,7 @@ Refer to the following table for details on the `HTML` editor block.

| properties | description |
|---|---|
|`html editor`| Enter the raw HTML |
|`html editor`| Enter the raw HTML. |
{: .reset-td-br-1 .reset-td-br-2}

### Menu
Expand Down Expand Up @@ -138,7 +167,7 @@ Refer to the following table for details on the `Spacer` editor block.

| properties | description |
|---|---|
|`height`| Adjusts the height of the spacer block. The default is 60px.|
|`Height`| Adjusts the height of the spacer block. The default is 60px.|
{: .reset-td-br-1 .reset-td-br-2}

### Social icon
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -76,7 +76,7 @@ As you build your email, you can toggle between a desktop and mobile view to pre
{% alert tip %}
Need help creating awesome copy? Try using the [AI copywriting assistant]({{site.baseurl}}/user_guide/intelligence/ai_copywriting/). Input a product name or description and the AI will generate human-like marketing copy for use in your messaging.

![Copywriter button, located in the Content panel next to Style Settings in the Drag and Drop Editor.]({% image_buster /assets/img/ai_copywriter/ai_copywriter_dnd.png %}){: style="max-width:85%"}
![Copywriter button, located in the Content panel next to Style Settings in the Drag and Drop Editor.]({% image_buster /assets/img/ai_copywriter/ai_copywriter_dnd.png %})
{% endalert %}

### Creative details {#creative-details}
Expand Down
Binary file modified assets/img/ai_copywriter/ai_copywriter_dnd.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified assets/img/dnd/dnd_content.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.