How do I add a Div Block on top or under a Collection List in Webflow?

Published on
September 22, 2023

To add a Div Block on top or under a Collection List in Webflow, you can follow these steps:

  1. Open the Designer: Log in to your Webflow account and open the project in which you want to add the Div Block.

  2. Navigate to the desired page: Go to the page where you want to add the Div Block on top or under the Collection List.

  3. Select the Collection List: Find the Collection List on the page and select it. You can easily identify the Collection List by the blue outline around it.

  4. Add the Div Block on top: To add the Div Block on top of the Collection List, click the + icon that appears on the top-left corner of the Collection List. This will create a new element just above the Collection List. Choose the Div Block option from the dropdown menu.

  5. Add the Div Block under: To add the Div Block under the Collection List, select the Collection List and scroll down to the bottom of the Style panel. Here, you will find a blue "+" icon. Click it to insert a new element just below the Collection List and choose the Div Block option.

  6. Position and style the Div Block: Once you have added the Div Block, you can position and style it according to your requirements. You can adjust its dimensions, apply background colors or images, add content, or customize it using Webflow's visual design tools.

  7. Preview and publish: After making any necessary changes, preview the page to see how the Div Block appears on top or under the Collection List. If you are satisfied, save the changes and publish the site for the alterations to be visible online.

Adding a Div Block on top or under a Collection List in Webflow is a straightforward process that enables you to further customize the layout and design of your website's dynamic content.

Additional Questions:

  1. How do I add a Div Block in Webflow?
  2. Can I customize the appearance of a Collection List in Webflow?
  3. What other elements can I add above or below a Collection List in Webflow?