The Text Element [Zipify Pages]

Boost your content creation and SEO with the inline text editor!

Ezra Firestone avatar
Written by Ezra Firestone
Updated over a week ago

Working with the Text Editor

Text included in text elements on pages can be edited in the convenient inline editor by double-clicking directly on any text field in the page builder. Styles can be applied to selected text using the handy WYSIWYG (What-You-See-Is-What-You-Get) editor:

The WYSIWYG editor not only provides the ability to set desired text formatting, but also allows for adding links to text, including the option to anchor text links to any other section on the page. In order to set/change the text formatting, you need to first select the desired portion of text and add/remove the desired formatting using the tools available on the WYSIWYG editor's panel:

The following heading text types can be applied to heading text:

  • Heading 1 (H1)

  • Heading 2 (H2)

  • Subheading 1 (H3)

  • Subheading 2 (H4)

As well as 6 "Body" text types for paragraph text:

  • Body Copy 1 - 6

Generally for SEO purposes, only use one H1 per page - this should represent the main heading/subject for the whole page. Also, don't skip heading levels - start with H1, then use H2, and so on. The main title of your page will be your H1, your main points the H2, and sub-points the H3, etc.

The "Link"/"Unlink" actions allow you to add a link to a desired portion of text or remove it from the text respectively. In addition to linking to a "URL", you have the option of linking to any other section on the page by selecting the "Page Section" option from the Destination dropdown menu. There's also the option to "Open in new tab" once the link is clicked:

The "Remove Styles" action (eraser icon) allows you to remove all applied formatting from the selected portion of text and set the default formatting instead.

Text Element Settings

Additional settings for the Text element are available in the sidebar Tabs of the builder:

๐Ÿ“Choose the device type you'd like to edit the text styles on from the "Edit on" section, prior to making changes. All settings are available in Desktop edit mode, while only style edits for Spacing and Visibility are available in Tablet/Mobile modes.

1. In the "Background" tab you can edit the text element's:

  • Background Color - Set a background color for the text element

  • Background Image (Coming Soon!) - Set a background image for the text element
    โ€‹

2. In the "Shape" tab you can edit the text element's:

  • Shape - The shape you'd like used for the text element

3. In the "Border" tab you can edit the text element's:

  • Border Style - None, solid, dotted or dashed

  • Border Size - How thick you want the border to be

  • Border Color - The color you'd like used for the border
    โ€‹

4. In the "Box Shadow" tab you can edit the text element's:

  • Color - The color of the shadow

  • X offset - The horizontal distance of the shadow. You can use positive values to push the shadow rightwards and negative values to push it leftwards

  • Y offset - The vertical distance of the shadow. Positive values will push the shadow downwards, while negative values will push it upwards
    ๐Ÿ“ X and Y offsets can also be set using the pin in the square to the right of the offset fields. The pin can be dragged to set coordinates

  • Blur - The blurriness of the shadow. Higher values create a more blurred shadow, while lower values create a sharper shadow

  • Spread - The size of the shadow. Range of allowed values is 0 - 20

5. In the "Spacing" tab you can edit the text element's:

  • Padding - Top/Bottom and Left/Right in px. Padding is the space between the content of the element and its border

  • Margin - Top/Bottom and Left/Right in px. Margin is the space outside the border of the element

6. In the "Visibility" tab you can choose which device(s) to show the text element on:

  • Show on Desktop

  • Show on Tablet

  • Show on Mobile

AI Copy Generator

The "AI Copy Generator" is an advanced feature incorporated within the text editor that harnesses the power of AI to generate compelling and engaging copy for your pages!
โ€‹
It generates attention-grabbing headlines, persuasive call-to-action statements and impactful product descriptions. With the AI Copy Generator, you can effortlessly produce high-quality copy that resonates with your audience, effectively captures their attention, and motivates them to take desired actions.

To use the AI Copy Generator, start by adding a prompt (1) which is what should be generated, choose the Tone of voice (2) you want used, then click the "Generate" button (3) and the AI will generate your copy as a response:

๐Ÿ“ There are several Tones to choose from such as; Neutral, Expert, Daring, Playful, Sophisticated, Persuasive, and Supportive.

If you're satisfied with the initial response, click the "Insert" button (1) to insert the copy into the text field on your page. Otherwise, you can request a rewrite by clicking on the "Rewrite" button (2) and choosing from one of the options (Rewrite, Simplify, Shorten, Make longer) depending on your preference. You can also alter the Tone of the rewrite by choosing a new one from the dropdown menu:

Important Notes

  • The AI Copy Generator is in Beta. Please check the generated text for inaccuracies and adjust as needed.

  • There are limits to the number of prompts that can be generated per month. Trial plan gets 10 prompts/month, Basic - 50 prompts/month, and Plus (v1), Enterprise (v1), Advanced (v2) plans have unlimited.
    ๐Ÿ“1 prompt is used each time the "Generate" button is clicked (each rewrite doesnโ€™t count as a new prompt).

  • A minimum of 5 characters can be entered into the "Generate prompt" input field. A maximum of 1,000 characters can be generated by the AI per prompt.

Page Styles

Page Styles can be applied to the text types and links above, which apply to the same text type across the entire page. You can also set default styles on a device-type basis: Desktop, Tablet and Mobile.

First, select the Device type and then the Text type. Set the default styles you want used for each device and text type below:

The default styles you set per device type are independent from one another I.e. you can set 20px for "Regular" text on desktop, 18 px for "Regular" text on tablet and 16px for "Regular" text on mobile and so on.

Keyboard Shortcuts

The inline text editor supports many common keyboard shortcuts enabling you to work faster, more efficiently and with increased precision, saving you time and improving your productivity.

Copy

Ctrl + C

Paste

Ctrl + V

Undo

Ctrl + Z

Redo

Ctrl + Y

Bold

Ctrl + B

Italicize

Ctrl + I

Underline

Ctrl + U

Increase/Decrease Font Size

Ctrl + Shift + +/-

Left Align

Ctrl + Shift + L

Center Align

Ctrl + Shift + E

Right Align

Ctrl + Shift + R

Justify

Ctrl + Shift + J

Did this answer your question?