Editing Page Blocks (section)

= Page Blocks =

== Overview of page blocks ==
You can use drag-and-drop blocks to customize any page you create in ActiveCampaign. Doing so will allow you to add and edit text, display images and videos, collect contact information, and more. In this article, you'll learn about the different blocks available in the Page builder.

== Block types ==
You can choose from any of the blocks below to create and customize your landing page.

{| class="wikitable"
|-
! Name !! Description
|-
| Section || Add a section to your page and add other content blocks to it.
|-
| Row || Add a row to your page and add other blocks to it.
|-
| Column || Add a column to your page and add other blocks to it.
|-
| Navigation || Add navigation to your page and guide visitors around.
|-
| Text || Add, edit, and style text.
|-
| Headline || Add an attention-getting headline to your page.
|-
| Button || Add a button that lets visitors download files or redirect them to your website.
|-
| Inline Form || Add your ActiveCampaign form to your landing page. Recommended.
|-
| Pages Form || Add a form to your page that collects contact information. Available on ActiveCampaign accounts created before August 2, 2022.
|-
| Image || Add an image to your page.
|-
| Image & Caption || Add an image with a caption.
|-
| Divider || Add a horizontal line to your page.
|-
| Follow Links || Add social icons to your page so visitors can follow you on social media sites.
|-
| Countdown || Add a countdown clock to your page to create a sense of urgency.
|-
| Bulleted List || Add a bulleted list to your page.
|-
| Embed || Add custom code to your page.
|-
| Video || Add a video to your page.
|-
| PayPal || Add a PayPal button to your page so visitors can make purchases.
|}

== Add, move, and delete page blocks ==
=== Add blocks ===
To add a component to your page, drag it to your page layout.

=== Move blocks ===
Once you add a content block to your page, you can easily move it. To do so, hover your mouse over the block you wish to move. Then drag the component to your desired spot on the layout.

=== Duplicate blocks ===
You can duplicate any block you add to your layout. To do so, click the component you wish to create a copy of then click the "Duplicate" button on the top right bar.

=== Copy and paste blocks ===
You can copy and paste content blocks by using the keyboard shortcuts ⌘C and ⌘V on Mac and Ctrl-C and Ctrl-V on PC.

=== Delete blocks ===
To remove a component from your design, click the block to select it, then click the trash icon in the top right bar.

== Edit page blocks ==
Many blocks have functions and settings unique to them, but all blocks contain a similar set of styles you can edit in the right pane of the page editor when selected.

=== Edit option ===
{| class="wikitable"
|-
! Option !! Description
|-
| Visibility || Make the block visible only on mobile view, desktop view, or both. Click the icon to enable or disable its visibility on the device. Switch your Viewing Mode to see what your block will look like on a mobile device.
|-
| Width || Width is either relative (a percentage) or absolute (to the pixel). By default, it's set to a percentage. Click the "%" in the input field if you want to change it to “PX."
|-
| Background || Add as many backgrounds to your block as you please. Backgrounds stack in the order in which you add them. You can change their order by dragging-and-dropping them.
|-
| Inner Spacing || Increase or decrease the amount of inner spacing by typing the number or dragging the input field left or right.
|-
| Border || Borders are set as a pixel value. You can choose which sides have borders. You can pick one of the three types of border styles: solid, dashed and dotted.
|-
| Corners || You can round the corners of components by setting px or %.
|-
| Drop Shadow || Add as many drop shadows as you please - they stack in the order in which you add them. You can change their order by dragging-and-dropping them.
|-
| Inner Shadow || Add as many inner shadows to your block as you please. They stack in the order in which you add them. You can change their order by dragging-and-dropping them.
|-
| Opacity || Drag the slider left or right to change opacity.
|}

== See Also ==
[https://help.activecampaign.com/hc/en-us/articles/360016067000-Overview-of-page-blocks Overview of page blocks]
```