Saturday, April 18, 2020

MotoPress Page Builder + Zerif Lite / PRO Integration How to Do It

This is a guest contribution by MotoPress. The guys from MotoPress have built a completely custom plugin to help with the integration of our most popular free one-page theme Zerif Lite and the MotoPress Page Builder one of the most popular drag-and-drop builder plugins out there. The new plugin adds Zerif styles to all content elements available  via the  MotoPress Page Builder.Enter  MotoPressIts not much a surprise that the Zerif theme for WordPress is one of the trusted leaders in the industry. Its stylish, flexible and feature-rich. Chances are, you noticed that its both PRO  and Lite  versions constantly appear in a variety of roundups. And probably youre one among thousands of users who are already successfully using it for a startup or an established company.Now, how can you get even more from your beautiful Zerif theme? Many ways, I believe. But the one I want to present today is a significant enhancement of your customization experience.Meet a powerful free plug in to empower your version of Zerif: MotoPress Page Builder Lite. WordPress Page Builder by MotoPress Author(s): MotoPressCurrent Version: 3.0.5Last Updated: October 15, 2019motopress-content-editor-lite.zip 96%Ratings 233,197Downloads WP 3.6+Requires And its custom add-on plugin that enables you to use Zerif styles: Zerif MotoPress Page Builder Integration Author(s): MotoPressCurrent Version: 1.0.1Last Updated: May 13, 2019mp-zerif.zip 0%Ratings 4,193Downloads WP 3.6+Requires Whats MotoPress Page Builder Lite?In short, thats a great user-friendly tool to provide a customization leg up for any WordPress site. To rephrase, MotoPress Page Builder is one of the strong competitors among currently popular WordPress drag-and-drop builders aiming to help non-techs create professional pages and posts with all the necessary functionality.Apart from tons of features and available content elements, its main standout is an ability to edit a website right on the front-end. It giv es you a chance to instantly see how your live website page will look after publishing.Need more details of how it can enhance your work with the Zerif theme? Lets elaborate:The builder offers multiple predefined layouts, the shape of which can be easily changed by simple stretching plus an ability to build your own layouts with drag drop using a range of available elements.It comes with a built-in Style Builder to perfect all needed content elements with the needed styles visually without any technical help Zerif styles included.Collection of Google web fonts at your hand.Multiple ready-to-use content modules that are added to the page by simple dragging.Full height and width of the rows/columns available.Parallax effects.WPML compatibility.WooCommerce ready.And yes, all this is free! You can download the plugin  from  the official WordPress.org repository (links above). If you have  any questions, you may address a detailed documentation any time. If you like how it works, remember that a Pro version ($29) is also available: it includes more options and comes with an ability to extend your editor with more multipurpose premium addons.Show me some examples!Okay, lets illustrate the main advantages of the builder and Zerif theme integration with examples.Multiple content elements are at your disposal:1. Text, title, quote, icon, paragraph, list, members content, etc.Each of the elements is supplied with the appropriate toolkit to help you personalize it.  The following screenshot shows a couple of features combined: text, different titles and image (full-width):2. Image, slider, grid gallery, MotoPress slider.These elements will help you structure your imagery, portfolio, galleries, sliders literally in minutes: just choose the needed element, drag it to the page and fill in with custom content and additional elements (if required).As an example, choosing a full-width page template, you can add your images or a gallery to a clutter-free page. Like th is one (tasty grid gallery):Depending on your requirements, you can set the images to be equal in sizes or to show their initial sizes in a grid gallery.3. Button, button group, download button, social share buttons, social buttonsWhen you add and edit any button, open a button style editor and switch between the Settings and Styles tabs to apply the needed changes: change button text and link, set icon and alignment, choose the style, and set spaces.For example, I chose one of the predefined MotoPress Page builder layouts called Product page and added  some test content (CC0 images, default text and buttons). In the screenshot below, you can see some settings of the button style, including Theme Red, Theme Yellow and other Zerif theme styles (this is the Full width with no title template):4. Video, audioYou can either embed your Youtube /  Vimeo video into the page or set it as a background still one of hot web design trends to engage your visitors! As for background video, th e format of video sources may be different (WEBM, MP4, OGV). You can also select a specific image to cover your video and apply more settings (e.g. repeat, mute, etc.).This example shows a couple of added videos, plus some default content with read more pages:5. Posts grid, accordion, call to action, space, service box, table, Google map, charts, tabs, splash screen, countdown timerThose  aim to satisfy your conversion-boosting purposes, create responsive tables and charts to properly show all needed business statistics, advertise smartly with non-blatant splash screen widgets, increase traffic and conversions with a countdown timer, etc.To show some example, this time I chose a standard blog template, so all of the archives are visible on the right. These are slider plus services box elements you are able to change the icons, colors, spacing and almost everything to properly present your ideas:Here is another example of a feature box on the full-width background (plus tabs):Moto Press Page Builder also lets you add some clean-looking calls-to-action, where you are free to update all text content, pick shape and style (choosing from the builder custom styles and Zerif theme styles), set width or manually stretch the block, select button position, apply a link, choose button shape size, apply animation, and more.Just a couple of quick examples:If you deal with online shopping and use discounts, a countdown timer can come in handy. It creates a sense of urgency and makes your shoppers act  faster. With the free version of the builder, you get the following style of the countdown timer (colors are customizable):By the way, all of that is free. Why not grab it for a  test-drive?How to get started? Download, install and activate:The  Zerif Lite theme.The  MotoPress Page Builder Lite plugin.The  Zerif MotoPress Page Builder Integration  plugin to adjust the builder to Zerif  theme styles.Then, open a new page/post  » from the drop-down menu choos e a page template  » click the Edit with MotoPress button.Youre done!Some useful pieces of info:Both the  MotoPress Page Builder  plugin and the Zerif MotoPress Page Builder Integration plugin  fully support Zerif Lite and Zerif PRO.You get Zerif integration no matter if youre using the  MotoPress Page Builder Lite or Pro.Apart from that, both MotoPress Page Builder Lite  and  Pro  can be used with any other WordPress theme.If something still looks fuzzy, speak your mind in the comments!