Content elements are the building blocks you drag onto a funnel or website page in the Aesthetix CRM page builder. Each element — a headline, paragraph, button, form, video, and more — carries its own set of customizable settings that appear on the left side of the editor once the element is placed. This reference covers every content element available in the builder: what it does, how to add it, and the key options you can adjust.
To open the builder, go to Marketing → Funnels (or Websites), open the page you want to edit, and use the editor to add and style your elements.
The element menu is where you choose which content elements to place on your page. Selecting the right elements is the final and most important step when building a page in the editor.
How to add an element
Step 1: Go to Marketing → Funnels and open the page you want to edit.
Step 2: Click the Add Element button, or click the "+" icon that appears when you hover over an empty element space, to open the elements panel.
Step 3: Browse the available Elements in the panel.
Step 4: Select an element, then drag and drop it into the editor. As you drag, an orange box appears to show where the element will land. Release to drop it into place.
Each element you add comes with its own set of customizable settings. After placing an element, click its orange border to open those settings on the left side of the editor.
How do I add an element without dragging? Hover over an empty element space and click the "+" icon to insert an element directly.
Where do I find an element's settings after adding it? Click the element's orange border. Its settings panel opens on the left side of the page.
The Headline element adds a primary heading to your page. After dropping it into the editor, click its orange border to open the full range of text and styling settings.
How to add and edit a headline
Step 1: From Marketing → Funnels, open your page in the editor.
Step 2: Add the Headline element and drop it onto the page.
Step 3: Click the orange border of the headline to access its settings.
Key options
Element Name/Title — Shows the default name of the element you are editing. Keep it as-is or rename it.
Background Color — Click the content and choose a background color. If your color isn't listed, type in a color code and click Add color to save a custom color.
Opacity — Adjust how much the content fades, from None to Heavy.
Shadow — Add a text shadow and adjust its thickness.
Letter Spacing — Increase or decrease the spacing between letters.
Text Align — Align text left, center, right, or justified.
Mobile Font Size / Desktop Font Size — Set separate font sizes for mobile and desktop using the size bars.
Typography — Choose the font for your text.
Icon — Add an icon by selecting one or searching the icon search bar.
Color Options — Set the color of regular, bold, italic, underlined, and link text, as well as icon color.
Padding — Adjust spacing inside the element box: Padding Left, Right, Top, and Bottom.
Margin — Adjust the Margin Top and Margin Bottom of the element.
Advanced options
Border — Customize border style (solid, dashed, dotted), width, color, radius, and radius edge.
Line Height — Increase the height of the element box.
Text Transform — Set text to uppercase, lowercase, or capitalize each word.
Visibility — Choose whether the element shows on desktop, mobile, or both.
Class Name — Add a custom CSS class by pressing Enter or Space.
CSS Selector — Copy the element's CSS selector by clicking the copy icon next to the reference number.
What's the difference between font-size settings? There are separate size bars for mobile and desktop, so your headline can display at different sizes on each device.
The Sub-Headline element adds a secondary heading beneath a headline. Drag and drop it into the editor, then adjust its settings to match your page's design.
How to add and edit a sub-headline
Step 1: From Marketing → Funnels, open your page in the editor.
Step 2: Drag and drop the Sub-Headline element onto the page.
Step 3: Click its orange border to open the settings panel.
Key options
Element Name/Title — Displays the default element name; rename it if you wish.
Background Color — Click the content and choose a color, or enter a custom color code.
Opacity — Choose a fade level: None, Light, Half, or Heavy.
Shadow — Add a shadow and set its thickness or lightness.
Letter Spacing — Set how far apart the letters display.
Text Align — Position text Left, Center, Right, or Justified.
Mobile Font Size / Desktop Font Size — Set font size separately for mobile and desktop.
Typography Type — Choose a font style to match your page design.
Icon — Add an icon from the options or search for a specific one.
Color Options — Adjust color for Bold, Italic, Underline, and Link text, plus Icon color.
Padding — Shift content using Padding Left, Right, Top, and Bottom.
Margin — Adjust Margin Top and Bottom.
Advanced options
Border — Choose Solid, Dashed, or Dotted and set border style, width, color, radius, and radius edge.
Line Height — Increase or decrease the height of the text/content.
Text Transform — Set to Uppercase, Lowercase, or Capitalize Each Word.
Visibility — Display on desktop, mobile, or both.
Class Name — Add a custom class.
CSS Selector — Click to copy the CSS selector for further customization.
When should I use a sub-headline versus a paragraph? Use a sub-headline for short supporting headings under a headline, and a paragraph for longer body copy.
The Paragraph element is used for sentences and the main body content of a page.
How to add and edit a paragraph
Step 1: From Marketing → Funnels, open your page in the editor.
Step 2: Click Add Element, select Paragraph, then drag and drop it onto the page.
Step 3: Click the orange border to access its settings.
Key options
Element Name/Title — Shows the default element name; keep or rename it.
Background Color — Click the content and adjust its background color.
Opacity — Set the fade level from None, Light, Half, to Heavy.
Text Shadow — Choose the thickness or lightness of the shadow.
Letter Spacing — Adjust the spacing between letters.
Text Align — Move text Left, Center, Right, or Justified.
Box Shadow — Add a shadow to the element box.
Mobile / Desktop Font Size — Set font sizes for mobile and desktop with the size bars.
Typography Type — Choose the font for your text.
Icon — Add an icon from the options or search for one.
Color Options — Set color for regular, bold, italic, and underlined text, plus link text and icon color.
Spacing (Padding & Margin) — Adjust Padding Left, Right, Top, and Bottom, and Margin Top and Bottom. These settings apply only to the content within the element you're editing.
Advanced options
Border — Choose solid, dashed, or dotted, and set border style, width, color, and radius, plus which edges to curve.
Line Height — Increase the height of the element box.
Text Transform — Set to uppercase, lowercase, or capitalize each word.
Visibility — Show on desktop, mobile, or both.
Class Name — Add a custom class.
CSS Selector — Click the copy icon to the right of the reference number to copy it.
Do paragraph spacing settings affect the whole page? No. Padding and margin settings apply only to the content within the specific element you're editing.
The Button element adds a clickable call-to-action to your page, with support for main text, sub-text, icons, link actions, and themes.
How to add and edit a button
Step 1: From Marketing → Funnels, open your page in the editor.
Step 2: Select the Button element and drag and drop it onto the page.
Step 3: Click the orange border to access its settings.
Key options
Element Name/Title — Shows the default element name; keep or rename it.
Background Color — Click the button and adjust its background color.
Letter Spacing — Set how far apart the letters appear.
Text Shadow — Choose how intense or light the shadow is.
Mobile / Desktop Font Size — Set the main text font size for mobile and desktop.
Sub Text Mobile / Desktop Font Size — Set the sub-text font size for mobile and desktop.
Typography Type — Change the button's font.
Icon Picker (Before) — Add an icon placed before the button text.
Icon Picker (After) — Add an icon placed after the button text.
Button Align — Set the button's alignment.
Text Color — Adjust the color of the main button text (for example, "Click to Sign Up").
Sub Text Color — Adjust the color of the button's sub-text.
Padding — Adjust Padding Left, Right, Top, and Bottom.
Margin — Adjust the top or bottom margin.
Text — Add or edit the button's main text.
Sub Text — Add sub-text in the designated field.
Button Actions – Link To — Choose where the button links to.
Themes
Theme Settings — Apply a preset theme to the button.
Advanced options
Text Transform — Change the text's case.
Full Width — Make the button span the full width.
Button Effects — Add a hover or click effect to the button.
Shadow — Adjust the button's shadow.
BG Styles — Keep or remove the button background.
Vertical Space / Horizontal Space — Adjust the button's height and width.
Visibility — Set visibility for desktop and mobile separately.
Custom Class — Add a class by pressing Enter or Space.
Border Options — Set the border type, style, width, color, radius, and radius edge.
CSS Selector — Click the copy icon to copy the CSS selector.
Can I put an icon on both sides of the button text? Yes. Use the first Icon Picker to place an icon before the text and the second to place one after it.
What is sub-text used for? Sub-text is a secondary line of text on the button, with its own font size and color settings.
The Bullet List element displays page content as a clear, concise list.
How to add and edit a bullet list
Step 1: From Marketing → Funnels, open your page in the editor.
Step 2: Select the Bullet List element and drag and drop it onto the page.
Step 3: Click the orange border to open the settings panel.
Key options
Element Name/Title — Shows the default element name; keep or rename it.
Background Color — Click the content and adjust its color.
Opacity — Adjust the fade from None to Heavy.
Text Shadow — Add a shadow and set its thickness or lightness.
Letter Spacing — Adjust the spacing between letters.
Text Align — Move text left, center, right, or justify it.
Mobile / Desktop Font Size — Set font sizes for mobile and desktop.
Typography Type — Choose the font for your text.
Icon — Add an icon from the options or search for one.
Color Options — Set color for bold, italic, underline, link, and icon.
Spacing — Adjust Padding Left, Right, Top, and Bottom, and Margin Top and Bottom. Settings apply only to the element you're editing.
Advanced options
Border — Select a border type to reveal its settings.
Border Style — Choose solid, dashed, or dotted.
Border Width — A higher width creates a thicker border.
Border Color — Click the color icon to change the border color.
Border Radius — Increase the radius for more curved corners.
Radius Edge — Choose which corners to curve — all edges, top only, or bottom only.
Line Height — Increase the line height to adjust the element box height.
Text Transform — Set to uppercase, lowercase, or capitalize each word.
Visibility — Control visibility on desktop and mobile.
Class Name — Add a custom class by pressing Enter or Space.
CSS Selector — Click the copy icon next to the reference number.
How many items can I add to a bullet list? Add as many list items as your page needs; each follows the styling set in the element's settings.
The Form element embeds one of your existing forms onto the page so visitors can submit their information.
How to add and configure a form
Step 1: From Marketing → Funnels, open your page in the editor.
Step 2: Click Add Element and select the Form element.
Step 3: If you have no forms yet, click Select your form to choose from the list, or click click here to create a new one.
Step 4: Open Form & Settings to configure the embedded form.
Key options
Form (Element Name/Title) — Shows the default element name; keep or rename it.
Padding — Move content left, right, top, or bottom with the toggle bars.
Margin — Adjust the top or bottom margin.
Select Form — Replace the embedded form by selecting a new one from this section.
Redirect Action — Set what happens after the form is submitted.
Advanced options
Visibility — Choose whether the form shows on mobile, desktop, or both.
Class Name — Enter a custom class.
CSS Selector — Click the copy icon to the right of the reference code to copy the custom CSS.
How do I create a new form from inside the builder? When adding the Form element, click the click here link to create a new form instead of selecting an existing one.
Can I change which form is displayed? Yes. Use the Select Form setting to swap in a different form.
The Blog Post element displays educational, long-form content from your blog. It's an opportunity to share articles your audience wants to read about your business.
How to add and configure blog posts
Step 1: From Marketing → Funnels, open your page in the editor.
Step 2: Click Add Element and select Blog Posts.
Key options
Element Name/Title — Shows the default element name; keep or rename it.
Blog Type — Choose Standard (grid view) or Compact (list view).
Choose Category Page — Select which blog category to display.
Pagination — Set how many posts appear on the page; 6 or 9 posts is recommended.
Button — Customize the post's button.
Advanced options
Padding — Move content left, right, top, or bottom with the toggle bars.
Margin — Adjust the top or bottom margin.
Border — Select a border type to reveal its settings.
Border Style — Choose solid, dashed, or dotted.
Border Width — A higher width creates a thicker border.
Border Color — Click the color icon to change it.
Border Radius — Increase the radius for more curved edges.
Radius Edge — Choose which corners to curve — all edges, top only, or bottom only.
Box Shadow — Set the strength or lightness of the box shadow.
Visibility — Show on mobile, desktop, or both.
Class Name — Enter a custom class.
CSS Selector — Click the Copy icon to copy the custom CSS.
What's the difference between Standard and Compact blog types? Standard shows posts in a grid view, while Compact shows them in a list view.
How many blog posts should I show per page? It's recommended to keep pagination at 6 or 9 posts per page.
The Video element embeds a video on your page from a URL, with playback and sizing controls.
How to add and configure a video
Step 1: From Marketing → Funnels, open your page in the editor.
Step 2: Click Add Element and select Video.
Key options
Element Name/Title — Shows the default element name; rename it if you like.
Padding — Move content left, right, top, or bottom with the toggle bars.
Margin — Adjust the top or bottom margin.
Background Color — Click the content to change the video's background color.
Box Shadow — Add a shadow to make the border visible.
Video Type — Choose the preferred video type from the available options.
Video URL — Enter the video URL to display it on the page.
Autoplay — Toggle on to start the video automatically.
Control — Toggle on to enable playback controls.
Width — Set the video to full width, 3/4 width, or half-width.
Advanced options
Border — Choose the border type.
Border Style — Select the border style.
Border Width — Choose how thick the border should be.
Border Color — Select a border color.
Border Radius — Choose how curved the edges should be.
Radius Edge — Select which edges to adjust — all edges, top only, or bottom only.
Visibility — Show on mobile, desktop, or both.
Class Name — Enter a custom class.
CSS Selector — Click the Copy icon to the right of the reference code to copy the custom CSS.
Where do I paste my video link? Enter it in the Video URL field, and the video will appear on the page.
How do I make the video play automatically? Toggle the Autoplay switch on.
The Image element adds and customizes an image on your page, with sizing, SEO, action, and styling options.
How to add and customize an image
Step 1: From Marketing → Funnels, open your page in the editor.
Step 2: Click Add Element and select Image.
Step 3: In the settings, click the image icon and upload your image from your storage page. Copy the image URL with the copy to clipboard icon, then paste it into the editor space so the image appears.
Key options
Element Name/Title — Shows the default element name; rename it if you like.
Padding — Move content with the Padding Left, Right, Top, and Bottom toggle bars.
Margin — Adjust Margin Top and Bottom with the toggle bars.
Background Color — Click the content to change its background color.
Opacity — Set the fade from None, Light, Half, to Heavy.
Align — Position the image Left, Center, Right, or Justified.
Add Image — Upload the image and paste its URL to display it.
Optimize Image Load — Toggle to optimize image loading. Turning it off may slow page speed; optimizing images can cut total page load time by up to 80%.
Width and Height — Enter your desired image dimensions.
Alt Text — Add alternative text for SEO.
Image Actions — Choose Open the popup or Go to website URL.
Themes
Theme Settings — Select a preset theme from the available options.
Advanced options
Image Radius — Set the corner radius of the image.
Image Border — Add and style the image border.
Image Shadow — Add a shadow to the image.
Image Effects — Apply visual effects to the image.
Visibility — Show on mobile, desktop, or both.
Class Name — Add a custom class.
CSS Selector — Click the copy icon next to the reference number to copy it.
Why should I add alt text? Alt text describes the image for SEO purposes and helps search engines understand your page.
Should I keep Optimize Image Load on? Keeping it on is recommended — optimizing images can reduce total page load time by up to 80%.
