Otter Blocks Pro Build innovative layouts with Otter Blocks and Gutenberg
Otter Blocks Pro is a lightweight, dynamic collection of page building blocks and templates for the WordPress block editor.
A Better Page Building Experience
Otter can be used to build everything from a personal blog to an e-commerce site without losing the personal touch. Otter’s ease of use transforms basic blocks into expressive layouts in seconds.
Otter Blocks Pro Innovative Blocks for the new WordPress era
Advanced Heading Block
Headings with more customization options, like the ability to change the font, highlight parts of the text and more.
Use this block to insert items from posts, pages and custom post types into the current page being edited.
Create a responsive section with up to 6 columns that have advanced customization and style options.
Button Group Block
Easily create multiple buttons and show them vertically or horizontally based on the device.
Contact Form Block
Add contact forms on your site. Optionally, start generating leads by integrating them with Sendinblue or Mailchimp.
With Otter’s Lottie Animation Block, you can display Lottie animations anywhere in Gutenberg.
Creates a card with a flip effect, where you can insert any content or blocks available in Gutenberg.
Add to Cart Block (PRO)
Drop an Add to cart button block for any WooCommerce product anywhere on the post or page that you’re editing.
Pricing Block and Section
Use this block to quickly create beautiful pricing tables and sections for your services/products.
A New Collection of Patterns COMING SOON
We are working on a new Patterns Library, containing a range of different elements in a variety of styles to help you build great pages. All of your website’s most important areas are covered: headers, testimonials, pricing tables, sections, content and more.
OTTER ADVANCED FEATURES
Powerful Features to Build Impressive Websites
Customize Every Block with Custom CSS
The Custom CSS feature makes it possible to directly customize the CSS properties of any Gutenberg block on the page. You can add media queries, change colours, and add borders all in one easy-to-follow area.
Otter Blocks Pro Visibility Conditions
The Visibility Conditions feature by Otter allows you to set which conditions should be met for your chosen blocks to be displayed on the page. The following conditions are available now, and more are on the way:
- User Roles, Logged In/Out Users
- Post Type, Author, Meta, Category and others
- Date Range and Recurring Events
- WooCommerce Products in Cart, Purchase History
- LearnDash compatibility
- Query String
This feature makes it quick and easy to add animations to any block, enhancing the appeal of your different page blocks and sections. This feature adds more than 55+ motion effects, including:
- Flipping & Rotating
- Special Animations
WooCommerce Builder Blocks PRO
Build custom Single Product Pages using WooCommerce Builder Blocks by Otter. All the new features are designed to maximize your conversion rate and bring more improvements.
Advanced Otter Blocks Pro
Enhance your website’s design with powerful blocks, like the Add to Cart, Business Hours, Review Comparison, and dozens of WooCommerce blocks.
Otter Blocks Pro is a powerful collection of page-building blocks and templates for the WordPress block editor. The expanding library of page building blocks incorporates all the necessary elements to build your website.
Combine the blocks with Otter to build stunning pages and posts with the simplicity of design.
To download and install the Otter plugin, make sure you follow the steps below:
- Navigate to the WordPress Dashboard > Plugins.
- Click the Add New button and type in the Search Bar ” Otter“.
- When the plugin appears, click on the Install button and then on Activate.
📝 Note: For further information about installing the plugin, check this dedicated doc.
🦦 Otter Blocks Pro Otter Settings
After installing the plugin, there is an onboarding section in Dashboard > Settings > Otter that contains options for the Modules, Section, and API Keys.
The Modules accordion contains the following options, enabled by default:
- Enable Custom CSS Module – allows you to add custom CSS to each block of the library.
- Enable Blocks Animation Module – allows you to add CSS animation to each block within the library.
- Enable Visibility Condition Module – allows the visibility conditions of the blocks to work correctly.
Other options offered by the Otter blocks are:
- You can also set the Section block as the default block for Pages so that every time a new Page is generated; the Section block will be appended there.
- Optimize Animation CSS – load CSS only of animations are used on the page for better loading.
- Anonymous Data Tracking – allows the user to become a contributor, with the condition of not collecting private data.
- Regenerate Styles – deletes all the Otter-generated CSS files.
From the Integrations tab, you can configure the API Keys to use the Google Maps block or the Google reCaptcha for the Form block. Also, saving Google Fonts Locally can be enabled from this place too.