Welcome to the Instapage Support Center

|

Instablocks

 

 

Quickly build hundreds of personalized landing pages by using individual page blocks that you can modify, save, and reuse. Choose from a selection of pre-designed block templates, like headers, footers, testimonials, and more, or create your own customized blocks from scratch.

Saving Blocks

Saving the blocks is done by clicking on any block on the page. This will open a menu in the top left corner of the block in question. From the menu, click on more, then choose Save to My Blocks.

Instablocks_-_Google_Docs_2018-01-16_16-06-56.png

In order to access the Instablocks manager, click on the Instablocks icon from the top menu in edit mode:

instablocks-new.png

This will open a menu where you can add block templates from Instapage or page blocks you previously saved:

Instablocks_-_Google_Docs_2018-01-16_16-11-47.png

When you're on the Block templates tab, you can filter them by choosing from the categories on the left:

Instablocks_-_Google_Docs_2018-01-16_16-14-15.png

Based on your needs, you can choose Headers, Benefits, Descriptions, Steps, Testimonials, Pricing Tables, and Call to Action blocks.

The blocks you save are shown in the My Blocks tab, where you can organize them into folders. You can create folders from the left side menu, by clicking on +ADD NEW FOLDER.

Afterward, all you have to do is drag any blocks over the folder's name, in order to move them to that specific folder.

Inserting Blocks

In order to add a block to your page, hover your mouse over the one you need, and click on Insert Block.

Instablocks_-_Google_Docs_2018-01-16_16-17-45.png

When clicking anywhere else on the block, a preview will be opened to see the block in detail, where you can see the mobile version as well. You can also add the block to your page by clicking on the Insert button. For blocks you have saved from your pages, you can also edit their name in the detailed view menu.

Instablocks_-_Google_Docs_2018-01-16_16-18-57.png

After you've inserted an Instablock, you can move it by clicking on Move and dragging it:

instablock11.png

To edit the background image, click on the corresponding icon and you will be presented with the options.

instablock12.png

instablock2.png

You can adjust how your custom image background is positioned on your landing page by clicking the white dot on the image and dragging it around. If you'd like an image to repeat you'll need to select one of the Tile options.

positioning_background.gif

Stretch to edges will make the image responsive to the edges of the visitor's browser.

You can make the background image of the Instablock have a parallax effect against the page background by turning on the toggle on the right.

bckg_img_3.jpg

To add an overlay color over the background image of the Instablock, select the color and the opacity on the right, above the parallax toggle:

bckg_img_6.jpg

Have more questions? Submit a request
Was this article helpful?
5 out of 6 found this helpful

Need Further Help?

Tell us what you need and we will be happy to assist you.

Our team of expert support staff and our community can answer your questions. Submit a ticket, or reach out on live chat!