Blog

Magento 2 extensions and themes – Latest News, Updates, Tutorials and much more

PWA Tutorial: Override & Extend Venia components

0

This tutorial guides you through overriding and extending a Venia component in order to display specific custom content in your custom React component on a custom Magento PWA site.

By the end of this tutorial, you will know how to:

  • Create a simple custom React component with simple custom content for your Magento PWA Studio site
  • Override Venia components to display that newly created custom content on your custom Magento PWA Studio site:
    • Sample 1: Display a Masthead at the Main Top Content position on all pages of Magento PWA Studio site
    • Sample 2: Display a Slideshow at the Main Top Content position on the homepage of Magento PWA Studio site

Once you master them, you can create your own complex React components beyond these small sample pieces.

Let’s get started. Continue reading →

Magento PWA Menu: Hamburger vs Tab Bars

0

When it comes to the PWA Studio project, should we stick with the classic Hamburger Menus or switch to Tab Bars on mobile?

Even though there are a few alternatives for navigation on mobile, we’re going to lay out all the pros and cons of the hamburger menus and tab bars (bottom navigation) only. We hope it gives you evaluation criteria to find which one is right for your Magento PWA project.

Hamburger menu

The hamburger menus are often listed as #1 choice and become the go-to icon for traditional responsive eCommerce websites. The hamburger menu is the ‘3-bars’ icon on mobile that typically opens up into a side menu or navigation drawer.

However, from an app perspective, during a talk at the Worldwide Developers Conference in 2014, Mike Stern -- designer and Apple UX Evangelist -- was against using the hamburger menu for their apps, saying:

“Remember, the [two] key things about an intuitive navigation system is that they tell you where you are, and they show you where else you can go.”.

So, is the hamburger menu really effective and the best way to display your Magento PWA Studio project’s navigation? To answer this question, first, we need to dive into the effectiveness and usability of this UI element in mobile navigation. Continue reading →

Time to care - combat Coronavirus

0

We all have known the huge impact of the coronavirus pandemic on almost every aspect of our daily life and business. It has caused a significant disruption.

At Ubertheme we care about all of our team safety so our team has moved remote for 2 weeks now -- quite frankly that’s okay with us. We are lucky enough to have business continuity as normal.

Time to care - Combat Coronavirus

Time to care -- Let’s combat Coronavirus

However, we know the months ahead are going to be really freaking tough if the coronavirus pandemic continues to spread. Even though our team can’t change the world, we want to help our partners and merchants navigate this tricky period where possible. Continue reading →

PWA Megamenu Installation Guide

0

In the previous article on Magento PWA Studio tutorial, we walked you through how to have a working copy of the Venia storefront installed and running on top of Magento 2 using @magento/create-pwa command. In this second article on setting up a Magento PWA project, we’ll give you step-by-step instructions for merging our UB Mega Menu storefront into your existing Magento PWA Studio project, so you can get started with your PWA project as quickly as possible.

Before you get started…

If you’re new to UB Mega Menu module and new to Magento PWA Studio in general, get yourself familiar with the following terms first. Continue reading →

UB Trex Pro thumbnail

0

Changelog for (Magento 2 theme) UB Trex Pro -- version 1.0.2:
Latest update: Feb 14, 2020

1.0.2
  • Compatibility testing with Magento 2.3.4
  • Fixed: Updated the style for default category description and static block on the category pages.
  • Fixed: Added the language file for all the texts of core Magento 2 and UB Trex Pro theme
  • Fixed: Adjusted the position of ‘Print receipt’ link in the Order confirmation page.
  • Fixed: Improved the ‘My Cart’ icon when no items are added to the cart.
  • Fixed: Removed the space between the Header and system message on the product detail pages (V4 & V5 types)
  • Fixed: The magnifier was not displaying properly on the 1280×1024 screen.
  • Fixed: Update the style for the Pagination on the Shopping cart page.
  • Fixed: Changes in the image size of the product grid on the homepage was not applied properly.
  • Fixed: The style issue of the Review tab when changing the theme’s color.
  • Fixed: Applied the ‘Primary Button’ style to the ‘Go to Product’ button on the Quickview popup.
  • Fixed: Changed the position of the Review’s count number on the Product detail page V3.
  • Fixed: Improved the style of product page V2
  • Fixed: [iPad] highlighted the active menu item on the horizontal screen.
  • Fixed: [mobile] style issue on the Quickview of the Bundle product page.
1.0.1
  • Compatibility testing with Magento 2.3.3
  • Fixed: adjust center-align for product thumbnail in the Category List View
  • Fixed: ‘My Cart’ heading section was missing when clicking to view the attributes in the Minicart
  • Fixed: zooming the product images on product pages did not work properly when scrolling down to the page bottom.
  • Fixed: style issue with the Bundle product when using Product V2 layout
  • Fixed: [iPad] adjust font size for the quickview of Bundle Product.
  • Fixed: [Mobile] hide ‘My Wishlist’ block on the Guest mode
  • Fixed: [Mobile] missing navigation on the horizontal view
  • Fixed: [Mobile] adjust the alignment of the ‘Close’ icon on the quickview popup
  • Fixed: Mobile] adjust the alignment of the text on the quickview popups (Left to Right & Right to Left)

Continue reading →

Magento PWA Studio tutorial

0
Note: At the time of writing this tutorial, the Magento PWA Studio version was 5.0.0. We’ve just tested the tutorial with the latest PWA Studio v5.0.1 as well.

As you might know, Magento PWA Studio v5.0.0 officially introduced a new handy command -- @magento/create-pwa -- that allows for getting a new PWA Studio project up and running way easier. Actually, our team noticed that this command was in place before and we did try this command successfully with PWA Studio 4.0.0 for an experimental setup.

This tutorial will walk you through all steps to use this command to set up an initial project structure using the Venia storefront as a template. Continue reading →

Update extensions and themes for Magento 234

0

On January 28th, Magento released version 2.3.4 -- the latest addition to Magento Open Source and Magento Commerce.

The version has addressed over 275 contributions from the community that cover significance enhancements and functional fixes. This big release also covers over 30 security enhancements that address vulnerabilities like cross-site scripting, deserialization of untrusted data, security bypassing etc.

Magento 2.3.4 Updates

Magento 2.3.4 Updates

In the meantime, Magento introduces new integrations, such as Adobe Stock image galleries and Live Chat from dotdigital. It also deprecated some payment gateways from the Magento core platform, such as Authorize.net.

Apart from the upgrades mentioned above, there have been enhancements with the release of Magento PWA Studio 5.0.0. The latest update of PWA Studio now includes new tools to help get a new project up and running quickly. You can see detailed changes in the PWA Studio Release Notes. In case you’re using our UB PWA Mega Menu, you can get started with PWA Studio 5.0.0 now (it’s fully compatible).

Continue reading →

UB Bookshop for Magento 2

0

Changelog for (Magento 2 theme) UB Bookshop -- version 1.1.0:
Latest update: Feb 5, 2020

1.1.0
  • Compatibility testing with Magento 2.3.4.
  • Fixed: Missing pagination in the Review tab on the Quick View popup
  • Fixed: The issue when clicking ‘Add to cart’ on My Wishlist of a Bundle product
  • Fixed: Clicking the ‘Review’ link did not direct to the Review Tab on the Product detail page
  • Fixed: “Shopping Cart” popup still shows when scrolling the menu.
  • Fixed: The issue when reloading quickview popup of a Configurable product
  • Fixed: [ipad] Broken style of Bundle Product on the quick view popup (type: Right to Left)
1.0.9
  • Compatibility testing with Magento 2.3.3.
  • Fixed: quickview popup (type bottom) did not display properly on screen 1280x1024px
  • Fixed: adjusted the highlight border upon hover the product thumbnails on the product detail page
  • Fixed: adjusted the position of Add to cart / Quickview icons on the Special Books block
  • Fixed: [iPad] quickview popup (type bottom) of the Bundle product did not display properly on the horizontal view
  • Fixed: [iPad] Tab was missing when clicking the Review link in the Quickview popup (type: Left to Right)
  • Fixed: [mobile] the Review tab was overlapped when clicking to open or close.
1.0.8
  • Compatibility testing with Magento 2.3.2 (bug fixes for M2.3.2 are listed below)
  • [Fixed] Fix the style issue of Popular Books block
  • [Fixed] Fix the style issue when Quickview title is enabled.
  • [Fixed] Update the color of Slider navigation dots when the Color theme is changed.
  • [Fixed] Update the alignment of Add to cart / Add to Compare icons in accordance with product image thumbnail on Deals of The Week block.
  • [Fixed] Highlight the menu items on Mega menu upon hover
  • [Fixed] Adjust the alignment of Related Products and Upsell product blocks on product detail page.
  • [Fixed] Adjust the alignment of the headings on category page.
  • [Fixed] Gallery product configuration via Themehelper does not apply on the frontend.
  • [Fixed][iPad] Update style for Quickview popup (Center popup modal) on Bundle product page
  • [Fixed][iPad] Quickview popup (Left to Right modal) did not display properly on Downloadable product page
  • [Fixed][iPad] Update alignment of Add to cart / Add to Compare icons in accordance with product image thumbnail.
  • [Fixed][iPad] Update the width of slider image on horitonzal view
  • [Fixed][iPad] Fixed the style issue of ‘Back to Top’ button when sidebar is enabled
  • [Fixed][mobile] Adjust the ‘Update’ button on MiniCart popup
  • [Fixed][mobile] Fixed the style issue of Quickview popup (Center popup modal) on Bundle product page
  • [Fixed][mobile] Update the style issue of Quickview popup (Center popup modal) on horizontal view
  • [Fixed][mobile] Adjust the alignment of the Review tab on horizontal view
  • [Fixed][mobile] Missing paging on My Product Review and My Wishlist sections
  • [Fixed][mobile] Update alignment of Add to cart / Add to Compare icons in accordance with product image thumbnail on horizontal view.

Continue reading →

UB QuickView for Magento 2

0

Changelog for (Magento 2) UB Quick View extension -- version 1.0.5.
Latest update: Feb 3, 2020

1.0.5
  • Testing for compatibility with Magento 2.3.4
  • Fine-tuning codebase
  • Added new Mobile Modal
  • Added new modal types: Right to left, Left To right, Slide -- Up (Desktop Only), Slide -- Down (Desktop Only)
  • Support Hotspot and lookbook integration with UB Content Slider module -- see details.
1.0.4
  • Testing for compatibility with Magento 2.3.1, 2.3.2.
  • Improved: update the codebase to be fully compatible with our new UB Base extension that manages all Ubertheme’s extensions under one backend UI dashboard.

Continue reading →

0

Changelog for (Magento 2) UB Instant Layered Navigation extension (version 1.0.6)
Latest update: Feb 3, 2020

1.0.6
  • Testing for compatibility with Magento 2.3.1, 2.3.2, 2.3.4
  • Improved: update the codebase to be fully compatible with our new UB Base extension that manages all Ubertheme’s extensions under one backend UI dashboard.
1.0.5
  • Testing for compatibility with Magento 2.2.7 and Magento 2.3.0
  • Added: Allow to apply instant layered navigation on Magento 2 search pages
  • Fix: Get wrong product’s data URLs when enabling the store code in the base URL
  • Added: Allow to show products’ pricing with tax information.
1.0.4
  • Compatibility testing with Magento 2.2.3, 2.2.4, 2.2.5, 2.2.6
  • Improved: product’s image showing, handling the case that products have no images, specific placeholder images from back-end configuration will be loaded in the product listing in layered navigation.

Continue reading →