Image Feature Overview

The Image Feature allows you to integrate an image with a headline and descriptive text. It's ideal for showcasing team members or promoting products and services on your funnel and website pages. On the left side of the editor, you’ll find various customization options for your Image Feature, which we’ll explore below. General Settings Element Name/Title In the General Settings section, you will notice the Element Name/Title field. By default, a name will be assigned to the element, but you can rename it for better organization and easy reference as you work on your page.   Text Shadow This feature enables you to apply shadow effects to your text. You can choose from options such as light fade, mid-level shadow, or strong shadow effects.   Letter Spacing With the letter spacing tool, you can adjust the space between individual letters. You can either increase the spacing or use a negative value to reduce the space and bring the letters closer together.   Background Color You can change the background color by selecting the specific content you want to modify and choosing a color from the palette. If you need a specific shade, you can manually input the color code.   Text Alignment The Align option allows you to position your text as you like within the Image Feature box, choosing between left, right, center, or justified text alignment.   Typography Settings With the typography options, you can select from the headline or content fonts defined in your settings or opt for a custom font from the dropdown menu.   Image Settings Image Upload Clicking the image icon on the right side of the image placeholder brings you to the storage page where you can upload an image. Once uploaded, you can copy its URL by clicking the clipboard icon next to the delete button. Then, return to the editor and paste the URL to display the image.   Optimize Image Loading For better page performance, you can optimize image loading by toggling this feature. However, disabling it may affect page speed, so use caution. Image optimization can significantly reduce page load times.   Dimensions (Width & Height) Input custom width and height for your image by entering values in pixels in the respective fields. Alt Text for SEO Adding Alt text helps with SEO, so be sure to input a relevant description of your image. Icon and Color Customization Add Icon To enhance your image feature, you can add an icon next to the headline. Search for an icon by name, or browse through the available options.   Color Settings You can modify the colors of different elements: Headline Color: Adjust the color of your headline text. Text Color: Customize the text color for the body of your content. Link Text Color: Specify the color for any links within the text.  Spacing and Layout Padding and Margins You can fine-tune the positioning of your content using padding controls (left, right, top, bottom) and margin adjustments (top and bottom).  Column Configuration Adjust the column sizes to make the text or image larger. You can also change the order in which the image and text appear, choosing either “text before image” or “image before text.”  Actions Image Actions Decide what happens when someone clicks on the image. You can choose to open a popup or redirect users to a website URL. If you select a URL, you can also enable the option to open it in a new tab.  Font and Theme Adjustments Font Size (Desktop & Mobile) Adjust the headline and body text font sizes for both desktop and mobile views to ensure your content is responsive.   Themes Select a pre-designed theme for your image feature. However, keep in mind that choosing a theme may override some of your previous customizations.   Advanced Settings Height Line Adjustment This tool allows you to control the height of your element’s container by adjusting the size bar.  Feature Image Border & Radius You can apply a border to your feature image and customize its appearance. Additionally, you can control the curve of the image border by modifying the image radius setting.   Image Shadow and Effects If you wish to apply shadow to your image, the Image Shadow feature allows you to adjust its intensity. You can also apply effects like Full Color or Black & White.   Additional Customization Visibility Options Choose whether the element should be visible on mobile devices, desktops, or both by toggling the visibility settings.   Custom Class and CSS Selector For advanced styling, you can enter a custom class name and copy the corresponding CSS code if needed.