Add rows

```mediawiki Navigation: Main_Page > Pages > Landing Pages > Add rows

Add rows to your ActiveCampaign page

Introduction

The ability to add rows to your ActiveCampaign landing pages is an essential feature for customizing your page layout. The Row block allows users to create structured sections within their pages, enabling the placement of different content blocks such as text, images, and buttons. This capability matters because it provides flexibility in design, enhances user experience, and allows for a more visually appealing presentation of your content. By understanding how to effectively add and manage rows, you can improve the overall quality of your landing pages and engage your audience more effectively.

How to Access This Feature

To access the functionality of adding rows, you will need to navigate to the landing page editor within ActiveCampaign. Once you have created or selected a landing page, the right pane of the editor will display various blocks, including the Row block, which you can drag into your page layout.

Step-by-Step Instructions

To add a row to your page layout, follow these steps:

1. Open the page editor for your existing landing page or create a new one. 2. Locate the Row block in the right pane of the page editor. 3. Drag and drop the Row block to your desired location on the page layout. 4. Click on the row you just added to open editing options in the right pane.

Editing and Styling the "Row" Block

Once you have added a row, you can customize its appearance through several configuration options which can be found in three tabs: Column, Row, and Section. Here’s a breakdown of each:

Column Styling

1. **Width**: You can set the row width using either pixels (px) or a percentage (%). 2. **Background**: Customize your row's background by adding colors, gradients, images, or videos. These backgrounds will stack in the order you add them, and you can rearrange them by dragging and dropping. 3. **Inner Spacing**: Determine the spacing between blocks within the row by entering a value in the inner spacing field. This can affect the overall height of the row. 4. **Border**: Add borders using pixels and specify which sides should have the border (top, bottom, left, right). You can choose between styles such as solid, dashed, or dotted, and apply different colors. 5. **Corners**: Radius settings for corners can be adjusted in pixels or percentages, affecting the roundness of the borders. 6. **Drop Shadow**: Set drop shadows for the row, with adjustable Offset, Blur, and Spread. 7. **Inner Shadow**: Similar to drop shadows, you can configure inner shadows for a more nuanced design.

By default, rows are mobile responsive, meaning they automatically stack on mobile devices.

Row Styling

The row’s horizontal settings include options for: - Selecting mobile visibility versus desktop visibility, - Adjusting the appearance of the row on mobile, - Setting background styles, - Adjusting overall spacing, borders, and shadows.

Section Styling

Access the section settings where your row is located. You can: - Assign an ID to the section, - Choose visibility options, - Configure background effects and spacing, as well as styling options similar to those available for the row.

Configuration Options and Settings

When utilizing the Row block, various configuration options are available, including: - **Column Width**: Adjust width in px or %. - **Background Customization**: Color, Gradient, Image, Video options. - **Inner Spacing**: Numeric values for space between inner blocks. - **Borders**: Select which side to apply a border, choose style, and add color. - **Corner Radius**: Control corner aesthetics via px or %. - **Drop Shadow and Inner Shadow**: Multiple shadows can be configured as per design preference.

Best Practices and Tips

- **Mobile Responsiveness**: Always check how your row appears on mobile devices to ensure a seamless user experience. - **Visual Hierarchy**: Use spacing and background colors strategically to create a visual hierarchy that guides users' attention. - **Consistency**: Ensure that the design of your row blocks aligns with your overall brand aesthetic, including colors and fonts. - **Content Balance**: Maintain a balance between text, images, and other elements within your rows to avoid clutter.

Common Use Cases with Examples

1. **Multi-Section Landing Pages**: Utilize multiple Row blocks to separate distinct content topics or sections, enhancing readability. 2. **Promotional Banners**: Create dedicated rows for time-sensitive promotions or announcements to capture visitors' attention immediately. 3. **Call-to-Action (CTA)**: Use rows to group CTAs with relevant text and images, leading to higher conversion rates.

Troubleshooting

If you encounter issues adding or editing rows: - Ensure you are accessing the feature from the correct landing page editor. - Refresh your browser if the row block is not appearing as expected. - Consult the ActiveCampaign support documentation for detailed error descriptions related to specific issues.

Related Features

To learn more about the various blocks available for use in your landing pages, please reference: - Text Block - Button Block - Image Block - Video Block

FAQ

Q1: What types of content can I add inside a row?

You can add a variety of content blocks including text, images, videos, buttons, and forms to the Row block.

Q2: Can I have more than one row in my landing page?

Yes, there is no limit to the number of rows you can add to a landing page.

Q3: How do I duplicate a row?

To duplicate a row, click on the desired row and then click the duplicate icon located in the top right corner of the editor.

Q4: Can I delete a row once it has been added?

Absolutely. Click on the row you wish to delete and click the trash icon in the top right corner to remove it.

Q5: Are there any restrictions on what can be added to a row?

While you can customize rows heavily, you cannot add other rows or sections directly into a single row.

Q6: Is the row structure mobile-friendly?

Yes, by default, rows are mobile responsive and will stack when viewed on mobile devices.

Q7: How can I access additional resources for creating effective landing pages?

You can explore more in the ActiveCampaign Help Center for detailed guides and best practices for using various landing page features. ```