Paragraph Block

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent sit amet feugiat arcu. Donec mattis, justo id dapibus congue, felis nulla maximus arcu, et convallis enim odio et risus. Vestibulum imperdiet, sem et mattis iaculis, purus felis ullamcorper dui, vel consectetur felis dui nec nunc. In non velit vitae ligula mollis dapibus. Nunc blandit congue tortor sed aliquam. Quisque consectetur est at est rhoncus, vitae tincidunt odio pharetra. Vestibulum pulvinar nisl eu elit auctor, a eleifend neque egestas. Vivamus semper lobortis vehicula. Aenean id eros nec nisl fringilla vulputate. Maecenas felis nulla, sagittis quis erat eu, dignissim tempor neque.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent sit amet feugiat arcu. Donec mattis, justo id dapibus congue, felis nulla maximus arcu, et convallis enim odio et risus. Vestibulum imperdiet, sem et mattis iaculis, purus felis ullamcorper dui, vel consectetur felis dui nec nunc. In non velit vitae ligula mollis dapibus. Nunc blandit congue tortor sed aliquam. Quisque consectetur est at est rhoncus, vitae tincidunt odio pharetra. Vestibulum pulvinar nisl eu elit auctor, a eleifend neque egestas. Vivamus semper lobortis vehicula. Aenean id eros nec nisl fringilla vulputate. Maecenas felis nulla, sagittis quis erat eu, dignissim tempor neque.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent sit amet feugiat arcu. Donec mattis, justo id dapibus congue, felis nulla maximus arcu, et convallis enim odio et risus. Vestibulum imperdiet, sem et mattis iaculis, purus felis ullamcorper dui, vel consectetur felis dui nec nunc.In non velit vitae ligula mollis dapibus. Nunc blandit congue tortor sed aliquam. Quisque consectetur est at est rhoncus, vitae tincidunt odio pharetra. Vestibulum pulvinar nisl eu elit auctor, a eleifend neque egestas. Vivamus semper lobortis vehicula. Aenean id eros nec nisl fringilla vulputate. Maecenas felis nulla, sagittis quis erat eu, dignissim tempor neque.

Suspendisse molestie mi eget lectus convallis malesuada. Suspendisse in consequat lorem, quis euismod urna. Donec eu venenatis justo, ac fringilla odio. Duis neque ante, fringilla eu vulputate et, vehicula vel eros. Aenean volutpat sem at risus convallis dapibus vitae sed velit. Nunc sit amet turpis dui. Mauris interdum lorem est, eget venenatis elit aliquet vel.

Cras sagittis erat eu sapien hendrerit, in ultricies neque congue. Phasellus tempus tempus leo, sit amet lacinia nunc elementum sit amet. In non velit vitae ligula mollis dapibus. Nunc blandit congue tortor sed aliquam. Quisque consectetur est at est rhoncus, vitae tincidunt odio pharetra. Vestibulum pulvinar nisl eu elit auctor, a eleifend neque egestas. Vivamus semper lobortis vehicula. Aenean id eros nec nisl fringilla vulputate. Maecenas felis nulla, sagittis quis erat eu, dignissim tempor neque. In non velit vitae ligula mollis dapibus. Nunc blandit congue tortor sed aliquam. Quisque consectetur est at est rhoncus, vitae tincidunt odio pharetra. Vestibulum pulvinar nisl eu elit auctor, a eleifend neque egestas. Vivamus semper lobortis vehicula. Aenean id eros nec nisl fringilla vulputate. Maecenas felis nulla, sagittis quis erat eu, dignissim tempor neque.

In nec ullamcorper tortor. Aenean vitae viverra nisi. Etiam in lacus ut eros dignissim commodo. Curabitur a semper neque. Aliquam ac turpis luctus, dictum ipsum vel, faucibus nibh. Pellentesque malesuada consectetur congue. Integer a condimentum lorem. Vestibulum ultricies enim a eros malesuada, eget viverra odio mollis. Ut dictum porttitor magna, faucibus dictum erat euismod at. Integer quis mi nec lacus fringilla tristique vel id enim.

Settings

This section will help you set up the block. Let’s check out the available options.

  1. Font Size: Control the font size of the paragraph text either via a drop down of preset values or by setting an exact pixel value in the input.
  2. Drop Cap: Makes the first letter of the paragraph larger.
  3. Alignment: Controls the alignment of the paragraph text.

Notice that the Font Size and Alignment options have three icons next to the label. These are the Desktop, Tablet and Mobile icons. By clicking each icon you can separately modify the control’s values for each device.

Block Appearance

Under the block appearance tab you can control how the block looks. Let’s check out the options.

  1. Text Color: This option allows you to set the color for the paragraph’s text.
  2. Background Color: This option controls the paragraph’s background color.
  3. Border: This option allows you to select the border style via the drop down and then select the border color and width.
  4. Border Radius: This option allows you to round the paragraph container’s corners.
  5. Box Shadow: This option allows you to apply an inset/outset box shadow, its color, spread, blur radius and offset.
  6. Padding: With this option you can individually (or collectively) control the padding on each side of the block.
  7. Margin: With this option you can individually (or collectively) control the margin on each side of the block.

Notice that the Padding and Margin options have three icons next to their label. These are the Desktop, Tablet and Mobile icons. By clicking each icon you can separately modify the values of padding/margin for each device.

Visibility Settings

Via the Visibility Settings you can hide the block for certain type of device or user.

The Viewport visibility toggles allow you to hide the block on desktops, tablets and mobiles. You can choose to hide it on more than one device type.

The Authentication visibility toggles allow you to display the block only to logged in or logged out users.

Animation Settings

Via the Animation controls panel you can set up how you want the block to animate upon entering the viewport as your visitors scroll.

  1. Animation type: Choose the animation type for the block. You can select from Fade, Slide Up / Down / Left / Right, Zoom In / Out, and Flip Up / Down / Left / Right. Set to None if you want to disable the animation.
  2. Duration: Controls how long the animation will take from start to finish. Defaults to 0.7 seconds.
  3. Delay: Controls the delay from the moment the element enters the viewport to the moment when the animation will begin.
  4. Easing: Controls the animation’s easing. Refer to the easings page for a visual representation.
  5. Repeat animation: Repeat the animation for the block every time it enters the viewport. While your users scroll down the animation will fire, and when they scroll back up it will fire again. Every time the block leaves the viewport the animation will be reset.

Note: If you don’t plan on using animations you can turn them off globally in Settings > GutenBee settings. You can disable the “Enable block animation controls” checkbox and the animation panels and scripts will stop showing up and loading.