Easy Widget Columns vs Epitome Gallery

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. Genesis Framework users, be sure to check out the Widgetized Page Template plugin, which helps you create full-page widget areas to use as a “blank canvas” with Easy Widget Columns. Works With Most Themes Easy Widget Columns is optimized for use with the Genesis Framework, but it is not required. It uses the Genesis Framework Column Classes 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. ewc_include_widgets – This whitelist filter is used to add the width control ONLY to the specified widgets. ewc_exclude_widgets – This blacklist filter is used to remove the width control from the specified widgets. ewc_color_palette – This filter allows you to add a custom color palette to the color picker control in the ‘Widget Row’ widget. ewc_preset_classes – This filter allows you assign preset CSS classes that display as a checkbox list in the ‘Widget Row’ widget. ewc_advanced_options – This filter allows you to remove specific or all advanced options from the ‘Widget Row’ widget. 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 ewc_include_widgets filter will always take precedence over the ewc_exclude_widgets filter and overwrite it. The examples below demonstrate how you can implement these filters on your theme. 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; } 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. 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; } 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. 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; } 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 (decisions, not options). The following example demonstrates how to completely remove all advanced options. // Remove all advanced options from the Widget Row widget. add_filter( 'ewc_advanced_options', '__return_false' ); The example below demonstrates how to disable or enable specific advanced options. The display parameter toggles the advanced option and the active parameter determines if the panel will display open (1) or closed (0) when the Widget Row widget is first added into a widget area. 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; }

Epitome Gallery aims to bring new possibilites to the native WordPress gallery. From the Edit Gallery panel in the Gallery Settings sidebar, you will find new fields for selecting the gallery type and optionaly applying a custom class. Available gallery types are the following: Slider, Featured Slider, Callout. You manage your gallery (selection, sorting, description) as usual. Epitome Gallery is great to create complex layouts based on a simple WordPress gallery. When saving, the plugin add custom attributes in the WordPress gallery shortcode. The first one is epitome_type="name" that define the type of gallery (optional if the type is set to default). The second one is optional epitome_class="name" and contains one or more class names to apply. Gallery types Slider – Transform a WordPress gallery to a interactive slider. Works fine in the body of an article. Featured Slider – Same as Slider, but provides titles, caption and/or description. Works fine at the top of an article as a featured content. Callout – Transfom a WordPress gallery to a set of columns containing images with title, caption and/or description. No need to use a column shortcode or a composer, just use this type of gallery for building this kind of layout. JavaScript Epitome Gallery use a JavaScript file (coded with jQuery) to handle the slider. You can use to customize your own slider. Parameters are the following: `javascript pauseTime: 3000, // Delay between 2 slides pauseOnHover: true, // Pause slider on hover autoSlide: false, // Start sliding automatically startSlide: 1, // Initial slide number at start width: 640, // In pixel, or keyword ‘auto’, ‘viewport’ height: 360, // In pixel, or keyword ‘auto’, ‘viewport’ prefetch: true, // Load adjacent slides sitOnTop: false, // Scroll at the top on slider when clicking on it prevText: “Prev”, // Direction of previous button label nextText: “Next”, // Direction of next button label directionNav: true, // Display direction button (arrows at the egdge of slider) paginationNav: true, // Display pagination button (dots at bottom of slider) prevHandle: null, // Callback function when clicking previous button nextHandle: null, // Callback function when clicking next button itemHandle: null, // Callback function to filter dot elements beforeChange: null, // Callback function to launch action before a slide changes afterChange: null, // Callback function to launch action after a slide changes resize: null // Callback function when catching a window resize event. ` Usage You can replace the default event initialized by the Epitome Gallery in the main JavaScript file of your theme. Instanciate the EpitomeSlider JavaScript object through a custom event and with custom parameters used for this theme. This is similar to the WordPress function do_action(). That’s important to declare this event outside a ready event. `javascript $(document).on(‘epitome_slider_init’, function(e) { // Instanciate for a regular slider $(‘.gallery.slider[data-type=”regular-slider”]’).EpitomeSlider({ width: ‘auto’, height: ‘auto’ }); // Instanciate for a featured slider $(‘.gallery.slider[data-type=”featured-slider”]’).EpitomeSlider({ width: ‘auto’, height: ‘viewport’ }); }); `