Have you ever felt the need to style radio buttons and checkboxes in your Gravity Forms? We have introduced Radio Button and Checkbox Styling options.
Please make sure following things on your website –
1. You have installed minimum version 1.5.0 or greater of Ultimate Addons
2. You have installed & activated Gravity Form plugin
3. Gravity Form Styler module is enabled in UABB Modules settings
4. Gravity Form Styler module is enabled in Beaver Builder Module settings
Many times, you would want to display all the posts using an Advanced Post module. But, at the same time you might want to exclude a post which is current. You can do this using the Advanced Post Module action with the Ultimate Addons for Beaver Builder.
You can paste the following code in the functions.php file of your theme / child theme to exclude the current post from rendering.
// Helps one exclude current post form the loop.function uabb_advance_post_custom_args( $args ) { // Do any operation with the $args. $args['post__not_in'] = array( get_the_ID() ); return $args; } add_filter( 'uabb_blog_posts_query_args', 'uabb_advance_post_custom_args', 10, 1 );
Advanced posts are loved by a lot of people due to its flexibility to modify query parameters. But, in some cases, developers need to modify the query parameters which are not specified in options. Let』s say you are displaying events using Advanced posts module and you want to disregard past events. Let』s assume that the event date is specified in meta with key `event_date`. Also we are checking with HTML id `events-list` before modifying the parameters so that this won』t be applied to all blog post modules on the site.
/* Advanced Query Parameters filtering for UABB Posts module */ function your_prefix_uabb_blog_posts_query_args( $args, $settings ) {// Give an HTML id and check it before modifying arguments so that it will not be applied to all blog post modules on the site. if ( $settings->id == 'events-list' ) { $args['orderby'] = ''; $args['meta_key'] = 'event_date'; $args['nopaging'] = true; $args['posts_per_page'] = '2'; $args['meta_query'] = array( 'key' => 'event_date', 'compare' => ' date( "Ymd" ), 'type' => 'DATE' ); } return $args; } add_filter( 'uabb_blog_posts_query_args', 'your_prefix_uabb_blog_posts_query_args', 20, 2 );
We are using `uabb_blog_posts_query_args` filter to accomplish this. You can take a look at all our filter reference.You need to put the above code snippet in functions.php file of your theme/child theme.
This is just one example. You have lots of possibilities to filter posts with WP Query Parameters.
Featured Product option allows highlighting specific products that can be promoted easily on site. A flash bubble can be set for a featured product with UABB Woo Products Module.
A product can be set as featured by three methods-
1. From WordPress backend, navigate to Products > All Products and select the Star in the featured column. Make sure to enable Featured option from Screen Options.
2. From a WordPress backend, navigate to Products > All Products and Quick Edit the product. Tick the checkbox for featured.
3. From a WordPress backend, navigate to Products > All Products and Edit the product. In the right sidebar, search for the Catalog visibility option and Edit it. Tick the checkbox for This is a featured product.
UABB』s Sticky Video feature allows sticking the video on page scroll. Your video will float along the left or right side of the browser window. So, as the reader scrolls the content both the video and your marketing messages will stay in focus.
To make the video sticky, enable it from Sticky Video tab.
For sticky video feature you get different alignments options for the video, Call to Action Bar and settings to control every part of the sticky video. Below are the key features –
Different alignments for sticky video across the edgesAdd a background for the video and manage its spacing and styleInfo bar to display the description for the videoResponsive supportClose button customizationsDrag sticky video across the window in the frontend
VIDEO SIZE
Specify the width of the Video in px. The video height and width will apply as per the Aspect Ratio set for the video. The aspect ratio for video can change from General > Video > Aspect Ratio.For example – If 16:9 ratio is set for video then the sticky video width and height will apply as per the selected ratio.
STICKY ALIGNMENT & SPACING
Sticky Alignment: Manage the position of the sticky video across the edges of the window. Below are the available positions –
Top Left Top Right Bottom Left Bottom Right Center Left Center Right
Spacing from Edges: You can manage the spacing around the video. This spacing will apply from the edges of the screen. Note: Spacing will depend on Sticky Alignment selected. For example – For Top Left alignment, only spacing will apply from the top and left edges of the video.
BACKGROUND SIZE & STYLE
You can add the background to the sticky video. Background size and color option will be available.
MANAGE STICKY VIDEO ON RESPONSIVE DEVICES
Under Sticky Video section, you get an option to Hide the Sticky Video on responsive devices. Here, you can select multiple devices on which you want to hide the sticky video.
CLOSE BUTTON
You can Enable/Disable the close button for the sticky video. Controls to manage the style of the close button are available.
INFO BAR
This option allows adding informative text under the sticky video. Here, you can display the description of the sticky video which provides information about the video currently playing on the page.
You can manage the color, background color, typography and padding to the Info bar. The text field supports the HTML content so, you can apply the custom style to the Info Bar content.
DRAGGABLE SUPPORT
The sticky video can be dragged anywhere on the screen using this feature. You can move the sticky video anywhere within the viewport by clicking and dragging it. The sticky video supports the draggable functionality by default.
Note: The drag functionality do not work in the backend editor of the Beaver Builder and on Mobile devices.
Many users would want to filter and showcase WooCommerce Products on their website. The Woo – Products Module provides an inbuilt Query Builder that allows you to either display All Products or filter them by applying Custom Query or even select each product Manually.
Below are the options available for product selection-
1. Custom Query > Products: This allows choosing exact products to display. You can manually choose products by entering product name.
Match these products – Select this option and start typing name for the products in the input field below. Only entered products will display.Match all products except – Select this option and start typing a name for the products in the input field below. All products will display excluding the products entered here.
2. Custom Query > Other options:This option allows filtering products depending on the Category, Tag or Author. Below are the available options –
Product categoriesProduct TagAuthors
Above all option have drop-down. Select a related option from the list and enter a name for the Category/Tag/ Author in the input field available below drop-down. A query will be formed on the basis of the option selected from the drop-down and name entered in the input field.
Note: Try different combinations with above settings to display exact products.
3. Filter
Filter By
Featured – Choosing this option will display WooCommerece Products from the above list that are set as featured. (?)Sale – Choosing this option will display WooCommerece Products from above list that are set for sale. (?)
Order, Order by
Choose an option from the drop-down menu to arrange products and the order you wish to display them in.
Offset
It is a number of products that should be excluded from the above Products or Custom Query list.For example – If you have 15 products and set offset to 5 then products from number 6th to 15th will be displayed. That means the first 5 products will be excluded and the rest 10 products will be displayed.
4. Exclude Current Product
If you wish to exclude currently displaying product from all product list to avoid a duplicate appearance, use this option.For Example – If available products are X, Y, Z and they come under same category A. If products from category A set to display on all single product page. Then while viewing X product, all products including X will be displayed at the bottom of the page. To avoid the duplicate appearance of X select to Exclude Current Product. So that only Y and Z will be displayed on X product page. Similarly, Y will be excluded from its single product page and X, Z will display.This option is useful when you design a template.
The General tab in the Woo – Products Module allows you to select a layout and skin for your WooCommerce products.
Below are the available options:
Layout
Query Builder will allow you to choose products to be shown. And with the layout option, one can arrange them well.
1. Grid
This layout will display products in a 「rows and columns」 structure.WooCommerce products will display in the Grid layout.More options like a number of Columns and number of Products Per Page will be available under Grid Options. (?)Based on the Grid Options, you can set pagination style using the Pagination tab. You can set the Pagination Type and Alignment.
2. Carousel
This layout will display products in a slider.More options will be available under Slider Options. (?)Choose Arrows and/or Dots for navigation.Select Total Product number, Products to Scroll at a time.Choose slide to Autoplay and to activate an Infinite Loop.Manage the Transition Speed.
Skin
Skin is predefined style options for products. Choose a Classic or Modern style for the product. Both will display Add to Cart button, Sale Flash, and Quick View option at different positions.
Many times, you would want to display all the products. But, at the same time, you might want to exclude some particular products. You can do this using the Woo – Products module.
The Query Builder of the Woo – Products module allows you to either display All Products or filter them as per your requirements. You can exclude particular products from a particular list using options listed under the Query tab.
Below are the available options:
Exclude Product
Start typing the product name and select it manually to exclude from the product list.For Example- If available products are X, Y, and Z. Selecting All Products option will display X, Y, Z products. But if you wish to exclude Y product then type Y in the text box. It will exclude the Y product from the list and will display only X and Z.
Exclude Current Product
If you wish to exclude currently displaying product from all product list to avoid a duplicate appearance, use this option. Set the toggle to exclude current product.For Example- If available products are X, Y, Z and they come under same category A. If products from category A set to display on all single product page. Then while viewing X product, all products including X will be displayed at the bottom of the page.To avoid the duplicate appearance of X opt to Exclude the Current Product so that only Y and Z will be displayed on X product page. Similarly, Y will be excluded from its single product page and X, Z will be displayed
WooCommerce product category group the similar products together. Category description display more information about the created group.
One can add a description to the category at the time of creation or can edit the already created categories to add it.
Option 1. From WordPress backend navigate to Products > Categories. Add a new category and description to it.
Option 2. From WordPress backend navigate to Products > Categories. Edit the already created category and add a description to it.
Woo – Categories Module allows to showcase categories on any page with great designs.
