Build your first page with MaxiBlocks
If you're looking to create a new page for your WordPress website using MaxiBlocks, follow these steps:
Step 1: Install MaxiBlocks plugin
Before getting started, make sure you have the MaxiBlocks plugin installed on your WordPress site. Your hosting account should be running PHP 8.0, 8.1, or 8.2 (not 8.3 as of June 2024). You can install the plugin directly from your WordPress dashboard by searching for "MaxiBlocks" in the Plugins section and clicking "Install Now."
Alternatively, you can use a local development tool like LocalWP to build your site locally before deploying it to your live hosting account.
Step 2: Watch tutorial videos
It's a good idea to invest just 30 mins to watch the MaxiBlocks tutorial videos to familiarize yourself with the plugin and builder:
These videos will provide you with a foundation for using MaxiBlocks and answer many common questions.
Step 3: Create a new page
Log in to your WordPress administrator dashboard, go to the "Pages" section on the sidebar, and click "Add New" to open the page editor.
Step 4: Browse MaxiBlocks patterns
See that little icon that looks like a Maxi logo? That's the "master toolbar" button. Click on it and you'll see the option to launch the template library.
Check out the MaxiBlocks pattern library to find pre-designed sections and pages that suit your needs. You can find full pages or patterns, the same which are shown at https://maxiblocks.com/demo/
Remember to sign on the top right to insert the cloud templates on your page. Here, you'll find patterns for different sections like hero areas, testimonials, and footers. Click on a pattern to load it onto your page.
Step 5: Customize your page
Once you've selected a suitable pattern, customize it using MaxiBlocks' various blocks. To edit a block, hover over it and click. Alternatively, click the plus sign on the toolbar to open the block library, where you'll find elements like text, image, and buttons. For better results, use Maxi's foundation blocks indicated with orange icons. To add a block to your page, click the + icons to insert, then customize its settings and design.
Tip: When starting out, it's best to work with the patterns or pages we have already created for you.
Our experienced team knows what works. Familiarize yourself with our structure, including containers, rows, columns, and responsive design.
This is a great video for understanding Element hierarchy WordPress document view.
By learning from our examples, you'll gain a better understanding of how everything fits together. Once you've mastered the basics, you can start experimenting by building your own patterns from scratch.
Step 6: Apply style cards
Style cards allow you to apply global styles across your website for a consistent look. Choose from pre-made style cards or create your own, then activate your chosen style card by clicking the "Activate Now" button.
To make your own style card edits, you must first copy to customize (save as new) and then you can edit the card. The original style card will remain as a backup in case you want to revert to it.
See the short video Loading and customising style cards for more.
Important: As a final step, activate the card to transfer the changes to all the MaxiBlocks elements on your website. Style cards only affect MaxiBlocks foundation blocks or plain Gutenberg blocks placed inside of Container Maxi block.
Custom changes made on the block level will not be overridden by the activated style card. That is the purpose of the "custom" toggle button. When you toggle that "custom" option MaxiBlocks knows you created a custom style and it should stay that way. .
Step 7: Save and publish
When you're satisfied with your page design, save your changes and click the "Publish" button to make your new page live on your website.
For more help with styling blocks, refer to the MaxiBlocks documentation on blocks, sidebars, and toolbars.
If you need further assistance, feel free to reach out to the MaxiBlocks community or support team.