Rapid Magento 2 site development with UB Trex Pro


Jun 25 Update: UB Trex Pro theme has just been updated with a new Furniture Homepage, fully compatible with Magento 2.3.5-p1. It’s also improved with Infinite Scrolling/Load More, Advanced Product Tabs

The creation of different Magento 2 stores is a time consuming and costly process. What if you could lay one strong Magento 2 bundle that can help get you started with any Magento 2 project faster and more stable development?

With UB Trex Pro, you have a new theme and pre-integrated extension package that can speed up the development on the Magento 2 platform. It contains one core theme, built-in extensions, and theme helper covering essential Magento 2 theme elements -- many of which are easily extendable.

Here are five of the key improvements of UB Trex Pro that you are sure to benefit the most from:

Let’s start with one of the simplest solutions to build your Magento 2 store:

Enhanced Marketing & Content Management

Mega Menu

The UB Mega Menu extension built in UB Trex Pro comes with 7 different layout options for mega menu. Depending on the complexity and depth of your product category, you can select one of these options to create a beautiful finished mega menu for your projects. It’s easy to turn mega menu into a promotional space with featured banners, product thumbnails or icons. You can also present the user with the depth of product categories right up front, either in a horizontal or vertical navigation.

Rapid Magento 2 Site Development Bundle - UB Mega Menu

For use on mobile devices, the off-canvas flyout menus is displayed with options for expanding into sub-categories.

Enhanced Product & Content Widgets

UB Content Slider is another handy extension packed with UB Trex Pro that allows you to create and manage unlimited responsive banner slideshows, product carousels (eg. Bestseller Products, Latest Products, Hot Products etc.), video sliders, (NEW) Product Image Hotspot & Lookbook and place them anywhere on your Magento 2 store. Here’s a step-by-step guide on how to set up 5 types of slideshow & carousels using UB Content Slider extension.

Rapid Magento 2 Site Development Bundle - UB Content Slider

Enhanced Usability

Ajax Add to Cart

UB Trex Pro enables Ajax add to cart feature by default. No matter what page a user is on, the product is added without a page reload when it is chosen to be purchased. This plays a big role in motivating users to go through your store’s contents and saving time shopping on your store.

Automatically activated mini-cart

Automatically activated mini-cart is another usability improvements available in UB Trex Pro.

In default Magento 2, the mini cart (also called the Cart Sidebar) is actually based on HTML-template loaded and filled by the Knockout js library and only appears when you click the number of items in the Cart link.

Rapid Magento 2 Site Development Bundle - Automatically activated mini-cart

With UB Trex Pro, whenever a user adds a product to their cart, the mini cart panel will display instantly in addition to the ‘Success’ message. This makes it possible for the user to examine the new product added in detail, edit the quantity, delete items, view the full-size cart, or go to checkout.

Sticky menu

Navigation menus are changing and one of the growing trends is for sticky menus. With UB Trex Pro, the main menu is made sticky by default. No coding is required, just turn it on via UB Trex Pro admin panel. If enabled, sticky navigation menus float as users scroll down and are always visible on screen. This makes the Magento store quicker to navigate from anywhere on the website without having to scroll.

Quickview

Have you noticed that many popular websites are now using a quick view these days, and with good reason? Quick view in UB Trex Pro helps to create a more fluid checkout flow. By clicking on the Quick View icon for a product, it enables the user to get product detail information faster and add it to their cart without having to go to the individual product page.

Rapid Magento 2 Site Development Bundle - Quick View

Enhanced Product / Category Pages

Product labels

Product labels, also known as product stickers or product badges, are an effective way to highlight the products in your store. At the moment, UB Trex Pro supports 3 pre-designed product labels -- New, Hot and Sale. For each of the product label, you can set the Background as: Background Color; Background Image; or Background Image and Color.

Product tabs

With this built-in feature, you can easily create multiple custom tabs with dynamic content from product attributes or CMS static blocks where you can load up embedded information, such as images, HTML content, custom blocks etc. These tabs are additional to the default ‘Description’, ‘More Information’ and ‘Reviews’ tabs that Magento has available by default. You can assign the tabs to any individual products and reorder tabs using a visual drag and drop interface right from your Magento 2 admin dashboard.

Rapid Magento 2 Site Development Bundle - Advanced custom product tabs

Infinite Loading

UB Trex Pro implements Infinite Scrolling out of the box which provides the best user experience for the following pages or widget:

  • Category page
  • Search page
  • Catalog product list widget

Infinite scrolling pulls the next products automatically into view when the user scrolls beyond a page point, eliminating the need for pagination. So instead of having to click a link to get to the next set of products, the products are loaded continuously when the user approaches the bottom of the page. You can flexibly configure to apply different infinite loading options: Infinite scrolling, Infinite scrolling with page limit or Load More button.

Enhanced Layered Navigation

Integrating UB Instant Layered Navigation module into UB Trex Pro is optional. If enabled, it provides many advantages over the default Magento navigation, including:

  • Visual color swatches
  • Price slider
  • Multi-select, checkboxes etc.

Rapid Magento 2 Site Development Bundle - Layered Navigation

In addition, Shop By Brand is also packed for free with UB Instant Layered Navigation module. This combination provides a richer user experience for your users and let them browse your product catalog by any number of filters via vertical and horizontal navigation menus without full page reloads. The extension preserves the attribute links for you and ensures all category pages visible to search engines and avoid drawbacks of duplicated content.

Enhanced Checkout

As ecommerce stores are all about improving sale conversion, with the help of UB One Step Checkout, you have a great alternative for native Magento 2 checkout. You can simplify and place all checkout steps on one responsive page for your store. The module gives you full control over setting up one step checkout page via a rich backend configuration panel -- flexible layout types (2- or 3-column), checkout fields, delivery date & time, delivery notes, gift wrap, GeoIP API integration, and much more.

Rapid Magento 2 Site Development Bundle - Layered Navigation

There has been a number of ways to reduce shopping cart abandonment rate, and integrating UB One Step Checkout into UB Trex Pro (optional) is one of those handy solutions for speeding up the checkout process way faster. Please bear in mind that almost 28% of people abandon the checkout cart due to a long or complicated checkout process (source: The Baymard Institute).

Enhanced Customization

Customization or modification of a Magento 2 site is a very large subject and can be very complex. With UB Trex Pro, there are a few ways that serve as a starting point to customize the theme to meet your needs:

Rapid Magento 2 Site Development Bundle - Customization

  • Adding custom CSS: you can simply upload your own custom CSS file or specify your custom CSS directly to the Custom CSS field within your theme admin panel.
  • Editing the custom file at: [magento_root]/app/design/frontend/Ubertheme/trex_pro/web/css/_custom_styles.less (an empty file packed with the core theme UB Trex Pro) in which you can add both custom CSS and LESS.
  • Creating a child theme: UB Trex Pro is based on a parent / child theming concept which allows you to change aspects of your site’s appearance by overriding any part of the parent theme. UB Trex Pro’s ‘base’ theme serves as a parent theme for any custom child theme.

Please refer to this step-by-step guide to learn more about those customization options.

Conclusion

We wanted to give you an overview of how UB Trex Pro package can deliver a fast time-to-market Magento 2 site building solution at an affordable fixed cost. UB Trex Pro is not one-size-fits-all solution, however it is a robust pre-developed design and well-built extension package when it comes to building a typical Magento 2 store.

How to get UB Trex Pro package?

  • You can get UB Trex Pro theme here with three default extensions -- UB Mega Menu, UB Content Slider and UB Quick View.
  • Alternatively, you will get UB Trex Pro for free when purchasing our M2 Extension Bundle.

If you have any questions or want to share your suggestion with us, we love to hear from you!

Written By

Comments