How can I create a paragraph block with a picture next to it in Webflow?

Published on
September 22, 2023

To create a paragraph block with a picture next to it in Webflow, you can follow these steps:

  1. Open your Webflow project in the Designer.
  2. Create a new section or select an existing section where you want to place the paragraph block and the picture.
  3. Drag and drop a "Div Block" onto the section. This will serve as the container for the paragraph and the picture.
  4. Inside the Div Block, add a "Rich Text" element. This element will be used for the paragraph.
  5. Type or paste your paragraph text into the Rich Text element. You can apply formatting such as bold, italics, or links using the toolbar.
  6. Next, add an "Image" element adjacent to the Rich Text element inside the Div Block.
  7. Click on the Image element and upload the desired image from your computer or choose it from your Webflow assets.
  8. Once the image is uploaded, you can adjust its size, position, and styling using the appropriate options in the right sidebar.
  9. To ensure that the image sits next to the paragraph text, you may need to adjust the width and float properties of the elements. To do this:
  • Select the Div Block and go to the Styles panel.
  • Set the width of the Div Block to a percentage or a fixed pixel value, depending on your design preference.
  • Set the float property of the Div Block to "left" or "right", depending on where you want the image to be positioned.
  • Adjust the margin and padding values of the Div Block to create the desired spacing between the elements.
  1. Lastly, you can further customize the styling of the paragraph and the image by using the various options available in the Styles panel.

By following these steps, you can easily create a paragraph block with a picture next to it in Webflow, allowing you to add visually appealing content to your website.

Additional Resources:

Three additional questions:

  • How do I adjust the size and position of an image in Webflow?
  • Can I use custom fonts in the Rich Text element in Webflow?
  • How do I add alt text to an image in Webflow for SEO purposes?