Munir Kamal

essamamdani

Andrew Worsfold

Enclavely

<a href="http://gettailor.com/" rel="nofollow ugc">Tailor</a> is a free frontend page builder for WordPress that features a simple and intuitive drag and drop interface.
<iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/tfMyLMuaXjI?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe>
<blockquote>
Check out the <a href="https://wordpress.org/plugins/tailor-advanced/" rel="ugc">Advanced Features extension</a> for new elements and features. Like Tailor, it’s absolutely free!
</blockquote>
To get started:
<ul>
<li><a href="https://support.gettailor.com/hc/en-us/categories/202586427" rel="nofollow ugc">Read the user documentation</a>.</li>
<li><a href="https://github.com/Enclavely/tailor/blob/master/readme.md" rel="nofollow ugc">Read the overview of features and elements</a>.</li>
<li><a href="https://medium.com/@tailorwp" rel="nofollow ugc">Keep up-to-date with the blog</a>.</li>
</ul>
<h4>Easy to use</h4>
<ul>
<li>Add elements and create <a href="https://medium.com/@tailorwp/columns-on-steroids-df5a5a957d89" rel="nofollow ugc">nested columns</a> instantly in a single drag and drop movement.</li>
<li>Copy elements anywhere on the page by dragging and holding the Shift key.</li>
<li>Move content independently and have it adopt the style of its parent elements!</li>
<li>Save one or more elements as templates, then drag and drop them onto any page.</li>
<li>Change the appearance of any element using a set of carefully selected options.</li>
<li>Undo and redo actions using the History panel (or keyboard shortcuts).</li>
<li>Control global layout settings in the Customizer.</li>
<li>Control page specific layout settings and add custom CSS and JavaScript.</li>
<li>Preview your layouts on different device sizes and manage responsive behavior.</li>
<li>Supports WordPress features (multimedia, shortcodes and more).</li>
<li>Supports built-in and third-party widgets.</li>
<li>Supports multi-language and RTL layouts.</li>
</ul>
Because Tailor works with any theme, choosing one that you like is now the hardest part of creating a website.
<ul>
<li>Need to show off your creative side? Try the free <a href="https://wordpress.org/plugins/tailor-portfolio/" rel="ugc">Portfolio extension</a>.</li>
<li>Have an online store? Check out the free <a href="https://wordpress.org/plugins/tailor-woocommerce/" rel="ugc">WooCommerce extension</a>.</li>
<li>Are you a power user? The free <a href="https://wordpress.org/plugins/tailor-advanced/" rel="ugc">Advanced Features extension</a> is for you!</li>
</ul>
<h4>Easy to extend</h4>
Tailor is open source and built based on WordPress’ coding standards and best practices. Everything from the code base to the user interface integrate perfectly with WordPress. The plugin features:
<ul>
<li>A comprehensive set of <a href="https://github.com/Enclavely/tailor/blob/master/actions.md" rel="nofollow ugc">actions</a> and <a href="https://github.com/Enclavely/tailor/blob/master/filters.md" rel="nofollow ugc">filters</a>.</li>
<li>An API for adding, changing or removing elements.</li>
<li>An API for adding, changing or removing settings and controls.</li>
<li>A <a href="https://github.com/Enclavely/tailor/blob/master/api.md" rel="nofollow ugc">REST API</a> to manage elements, templates and models.</li>
</ul>
<h4>Need more information?</h4>
<ul>
<li>Check out our example of how to extend Tailor <a href="https://github.com/Enclavely/tailor-sample-theme" rel="nofollow ugc">using a theme</a>.</li>
<li>Check out our example of how to extend Tailor <a href="https://github.com/Enclavely/tailor-sample-extension" rel="nofollow ugc">using a plugin</a>.</li>
<li><a href="https://support.gettailor.com/hc/en-us/categories/203117247" rel="nofollow ugc">Read the developer documentation</a>.</li>
</ul>
<h4>Want to help?</h4>
<ul>
<li>Contribute to the <a href="https://translate.wordpress.org/projects/wp-plugins/tailor" rel="nofollow ugc">WordPress Translation project</a>.</li>
<li>Provide your feedback and suggestions through <a href="https://www.facebook.com/tailorwp/" rel="nofollow ugc">Facebook</a> or <a href="https://twitter.com/tailorwp" rel="nofollow ugc">Twitter</a>.</li>
<li>Get involved in the <a href="https://github.com/Enclavely/tailor" rel="nofollow ugc">GitHub project</a>.</li>
<li>If you like the plugin, please <a href="https://wordpress.org/support/view/plugin-reviews/tailor?rate=5#postform" rel="ugc">submit a review</a>.</li>
</ul>

Tailor Page Builder

Young and upcoming page builder that looks to have a promissing future!

Very Promissing

Build beautiful layouts for your content faster and easier than ever before using your favourite theme!

Alexis J. Villegas

Easy Widget Columns makes it really easy to arrange your widgets in rows of columns. It works by adding a new ‘Column width’ select option at the bottom of your widget’s form that allows you to set a width value for each widget.
You can define new rows and sub-rows of widget columns with the ‘Widget Row’ widget and the ‘Sub-Row’ widget respectively, allowing you to create complex layouts directly from within your widget area or sidebar.
<blockquote>
Genesis Framework users, be sure to check out the <a href="https://wordpress.org/plugins/widgetized-page-template/" rel="ugc">Widgetized Page Template</a> plugin, which helps you create full-page widget areas to use as a “blank canvas” with Easy Widget Columns.
</blockquote>
Works With Most Themes
Easy Widget Columns is optimized for use with the Genesis Framework, but it is not required. It uses the <a href="https://gist.github.com/studiopress/5700003" rel="nofollow ugc">Genesis Framework Column Classes</a> to display your widgets in rows of columns. If your theme already incorporates the Genesis Framework Column Classes, or you want to manually add or edit the CSS, you can choose not to load the CSS under ‘Settings’ > ‘Widget Columns’ and rely on your theme’s stylesheet instead. This option is recommended for most Genesis users or those concerned with loading additional assets on their website.
Translation and RTL Ready
The plugin supports RTL layouts and is translation ready.
Filters for Developers
The following filters are available for you to take full control of the plugin on your themes.
<ul>
<li><code>ewc_include_widgets</code> – This whitelist filter is used to add the width control ONLY to the specified widgets.</li>
<li><code>ewc_exclude_widgets</code> – This blacklist filter is used to remove the width control from the specified widgets.</li>
<li><code>ewc_color_palette</code> – This filter allows you to add a custom color palette to the color picker control in the ‘Widget Row’ widget.</li>
<li><code>ewc_preset_classes</code> – This filter allows you assign preset CSS classes that display as a checkbox list in the ‘Widget Row’ widget.</li>
<li><code>ewc_advanced_options</code> – This filter allows you to remove specific or all advanced options from the ‘Widget Row’ widget.</li>
</ul>
1. ewc_include_widgets / ewc_exclude_widgets
Both filters accept the widget’s ID base as parameters. Please note that you cannot use both filters at once. The <code>ewc_include_widgets</code> filter will always take precedence over the <code>ewc_exclude_widgets</code> filter and overwrite it.
The examples below demonstrate how you can implement these filters on your theme.
<pre><code>add_filter( 'ewc_include_widgets', 'myprefix_add_ewc_control' );
/**
 * Filter to add the EWC control to specified widgets.
 *
 * @param array An empty array.
 * @return array An array containing the widget's ID base.
 */
function myprefix_add_ewc_control( $ewc_widgets ) {

 $ewc_widgets = array(
 'meta', // WP Meta widget
 'archives', // WP Archives widget
 'calendar', // WP Calendar widget
 'categories', // WP Categories widget
 );

 return $ewc_widgets;

}

add_filter( 'ewc_exclude_widgets', 'myprefix_remove_ewc_control' );
/**
 * Filter to remove the EWC control from specified widgets.
 *
 * @param array An empty array.
 * @return array An array containing the widget's ID base.
 */
function myprefix_remove_ewc_control( $ewc_widgets ) {

 $ewc_widgets = array(
 'recent-comments', // WP Recent Comments widget
 'recent-posts', // WP Recent Posts widget
 'rss', // WP RSS widget
 'tag_cloud', // WP Tag Cloud widget
 );

 return $ewc_widgets;

}
</code></pre>
2. ewc_color_palette
This filter allows you to add a custom color palette to the color picker control in the ‘Widget Row’ widget. It accepts an array of hex color values as parameters.
The example below demonstrates how you can implement this filter on your theme.
<pre><code>add_filter( 'ewc_color_palette', 'myprefix_ewc_color_palette' );
/**
 * Filter to edit the color palette in the color picker control.
 *
 * @param array An empty array.
 * @return array An array containing hex color values.
 */
function myprefix_ewc_color_palette( $color_palette ) {

 $color_palette = array(
 '#252724',
 '#ce6b36',
 '#31284b',
 '#a03327',
 '#3b3e3e',
 '#67b183',
 );

 return $color_palette;

}
</code></pre>
3. ewc_preset_classes
This filter allows you assign preset CSS classes that display as a checkbox list in the ‘Widget Row’ widget.
The following example demonstrates how you can implement this filter on your theme.
<pre><code>add_filter( 'ewc_preset_classes', 'myprefix_preset_classes' );
/**
 * Filter for predefining EWC Widget Row classes.
 *
 * @param array An empty array.
 * @return array An array containing new values.
 */
function myprefix_preset_classes( $classes ) {

 $classes = array(
 'hero',
 'parallax',
 'slider',
 'content',
 );

 return $classes;

}
</code></pre>
4. ewc_advanced_options
This filter allows you to remove specific or all advanced options from the ‘Widget Row’ widget. This can be useful for limiting design functionality on a client website (<a href="https://wordpress.org/about/philosophy/#decisions" rel="ugc">decisions, not options</a>).
The following example demonstrates how to completely remove all advanced options.
<pre><code>// Remove all advanced options from the Widget Row widget.
add_filter( 'ewc_advanced_options', '__return_false' );
</code></pre>
The example below demonstrates how to disable or enable specific advanced options. The <code>display</code> parameter toggles the advanced option and the <code>active</code> parameter determines if the panel will display open (1) or closed (0) when the Widget Row widget is first added into a widget area.
<pre><code>add_filter( 'ewc_advanced_options', 'myprefix_display_advanced_options' );
/**
 * Filter to remove specific advanced options from the Widget Row widget.
 *
 * @param array An array containing default values.
 * @return array An array containing new values.
 */
function myprefix_display_advanced_options( $display ) {

 $display = array(
 'ewc_background' => array(
 'display' => true,
 'active' => 1,
 ),
 'ewc_margin' => array(
 'display' => false,
 'active' => 0,
 ),
 'ewc_padding' => array(
 'display' => false,
 'active' => 0,
 ),
 'ewc_class' => array(
 'display' => true,
 'active' => 0,
 ),
 );

 return $display;

}
</code></pre>

Easy Widget Columns

Great plugin. Works well with your Widgetized Page Template plugin.

Lightweight and works

Easily display widgets in rows of columns.

Tailor Page Builder vs Easy Widget Columns