PostX - Gutenberg Post Grid Blocks

  2. Home
  4. Docs
  6. PostX – Gutenberg Post Grid Blocks
  8. Image – Blocks

Image – Blocks

Image – Blocks

Display Image with lot of style, button and overlay in Gutenberg Post Blocks.

Plugin Details
Buy Pro
See Image Demo

Settings

  • Image
    • Upload Image: Upload your image via WordPress default media uploader.
    • Image Alt Text: Change your image Alt text in here.
    • Link Type: Type of link you want to use. “Link” and “Button” type is used in here.
    • Link: Put the link in here.
    • Link Target: Set your link target.
    • Button Text: Change your button text from here.
    • Button Link: Set your button link in here.
    • Button Link Target: Set your button target.
    • Button Position: Set position of the button over image.
    • Caption Enable: Enable caption of the Button.

Style

  • Image
    • Hover Animation: Use this Dropdown to choose an image on hover animation.
    • Image Align
    • Width: Use this slider to overwrite image width.
    • Height: Use this slider to overwrite image height.
    • Gray Scale: Use this slider to change the image  grayscale.
    • Radius: Use this field to change the border radius.
    • BoxShadow: Use this group field to select shadow, inset & color in this option.
    • Margin: Use this field to change the margin of the image.
    • Overlay: Use this switch to show the overlay.
    • Overlay Type: Use this dropdown to show the overlay type.
    • Custom Color: Use this color picker to pick overlay color.
    • Overlay Opacity: Use this slider to change the overlay opacity.
  • Caption
    • Alignment: Choose alignment of the Caption.
    • Caption Color: Use this color picker to pick caption color.
    • Caption Typography: To change font family, font weight, font size, line height, letter, spacing, transform, text decoration.It support for responsive settings.
    • Caption Margin: Use this field to change the margin of the image.

Advanced

  • General
    • ID: Use this field to add an ID to the block.
    • Z-index: Use this field to change the z-index of the block.
    • Margin: Use this field to change the margin of the block.
    • Padding: Use this field to change the padding of the block.
    • Background: Use this color picker to pick a background color.
    • Border: Use this group field to change border width, style and color.
    • BoxShadow: Use this group field to select shadow, inset & color in this option.
    • Border Radius: Use this field to change the border radius.
  • Custom CSS: Add Custom CSS via this field.
  • Advanced
    • Additional CSS class: Add CSS class to the block.
Was this article helpful to you? Yes No