Journal v.3.2.0-rc.99 : Theme
Changelog
=========
New in RC.98
Introducing Color Schemes.
Color Schemes are a new variable type which makes use of the existing color variables (now named Color Tokens).
New demos will come with at least 4 pre-defined color schemes, but you can create more. Each scheme comes with a set of color utilities such as foreground and background shades, border, buttons, branding colors, etc.
Each color option in Journal is now given a color scheme utility color, for example a foreground element like text or icon would get the "Foreground Primary" or "Foreground Secondary" or "Foreground Tertiary", etc. while elements where a background color would be normally used would get the corresponding "Background Primary", "Background Secondary", etc.
With color schemes assigned throughout the admin, it's very easy to switch entire sections to a different scheme by simply choosing it from the Color Scheme selector. Color Scheme selector can be found in various places such as entire rows, columns, headers, menus, certain individual modules, etc. So if you want to make an entire row dark you would simply apply the corresponding Color Scheme to that row (provided individual color option use the new color scheme mechanism).
New in RC.98 Introducing Text Styles.
Text Styles are a new variable that makes use of the existing Font Family and Font Size variables. Setting up Text Styles streamlines the design process and keeps text more consistent.
Text styles can be applied wherever Font options are available, a new selector before the Font Family is now present. Text Style can be overridden in place by the Font Family and/or Font Size of any font option, while preserving other text options from the Text Style.
Major code changes and improvements
- Demo Variants. New demos in Journal 3.2 come with multiple variants to showcase the multi-purpose nature of each demo. Demo variants will use different images and branding colors with different categories and product niches.
- Major Recode for better overall performance and integration with core Opencart principles. Journal now uses the Opencart Events system. (This may affect past 3rd party extensions that might have been modified to work with previous Journal versions (3.1.8 or lower). Please consult with your extension developers in such cases).
- Core Web Vitals improvements (better pagespeed scores). This heavily depends on your store setup as well as various 3rd party extensions and your hosting plan performance.
- Web Accessibility improvements across the board.
- PHP 8 compatibility (for Opencart 3.0.3.7 and later, previous Opencart versions don’t work with PHP 8 anyway).
- Google Fonts. Added Display option and removed previous Async / Swap Fonts options.
- Icons Pack. Removed all unused icons from the pack for a much smaller footprint. If you need extra icons, follow our documentation on how to add them to the pack.
- Stepper Mechanism. Added dedicated options in Journal > Skins > Edit > Stepper, including the option to display buttons on each side.
Major layout design features
- Auto Grid. A new auto-responsive repeater grid system that makes responsive design much easier and replaces the existing Items per Row mechanism. The feature appears wherever Items per Row options are available. (Items per Row still work as usual, but now it can be replaced with the new Auto Grid system). See documentation for more details.
- Auto Carousel. New and simple carousel mode for repeater grid modules. Works seamlessly with the new Auto Grid system. It is scroll-based and leverages browser scroll snapping for best possible performance. Allows natural clipping of the last item to clearly indicate there are additional items to be scrolled into view and also provides support for multi-row carousels. This replaces the old Carousel Mode mechanism that is part of the legacy Items per Row system. See documentation for more details.
- Journal Builder. Added a container-aware column stacking option in each row to auto-stack all columns within that row (make them 100% width) at a given custom row width (not screen width via breakpoint rules - so breakpoints aren't necessary if you just want to stack all columns at once at a given width). This can have profound implications in designing layouts much faster (and safer - preventing columns from getting too small on smaller screens if breakpoint rules aren't added). Also added a Columns Gap option to add spacing between columns. The new Gap option is auto-adaptive, meaning that the same gap value is used for horizontal and vertical spacing automatically. This improves upon the previous approach of adding column paddings on different sides on a per breakpoint basis.
Headers Improvements
- Mobile Header. Added custom breakpoint option in Journal > Skins > Edit > Header > Mobile Header At, at which to activate the entire mobile header for desktop or tablet type devices. (not applying to actual phones, mobile header is always rendered on phones). Additionally, a new option in the same place Mobile Header on Tablet allows for the mobile header to be rendered on tablet type devices regardless of the above Mobile Header At screen width rule (in cases where an actual tablet may have a wider screen than the activation rule).
- Sticky Header. Improved sticky header mechanism (across all headers) with option to include the entire header, the logo/search/cart area + menu, or menu only (as was before).
- Compact Header. Added option to an additional main menu in the main menu bar below the logo area (similar to the main menu bar from the Classic/Mega headers).
Admin System and Styles Improvements
- Bulk Delete. Added option to bulk select and delete in admin listing instances (Modules, Styles, Blog Posts, etc.). A checkbox is available in each instance with select-all option.
- Browser Alert. Added Notification style in skin for Contact Form and Newsletter modules notifications.
- Page Buttons Style. Improved style options and provided container-aware button stacking (when the parent container of dual buttons reaches a certain width, buttons will stack automatically without necessitating breakpoints).
- Form Style. Improved form label position mechanism to be consistent with the new container-aware system. Labels can be displayed on the side and automatically move to top position (relative to input) at a certain parent container width.
- Product Page Buttons. Improved display mechanism and added a new option for the fixed button to be shown only on scroll (not at all times). Also the new fixed buttons are displayed along the optional Bottom Menu (which was previously disabled on product pages with fixed buttons).
- Out of Stock Added option to exclude out of stock products from Related Products.
- Out of Stock Added opacity option for Add to Cart button when product is out of stock so the disabled button can be faded out.
- Out of Stock Added option to replace Add to Cart button text with Stock Status in Journal > System > System.
- Show In Stock Products. Added option to show products in stock first in Journal > System > System.
New Modules and Features
- New Image Module. Simple image module for quick use in builder columns where a single image might be needed (replaces the old approach of adding background images in empty columns).
- New Text Module. Simple text/code module for quick use in builder columns where such content might be needed.
- New FAQ Module. Dedicated FAQ module. (To replace the larger Blocks module used for such purpose).
- Catalog Module. Added option for custom menu item with custom image and custom sub-links.
- Product Tabs. Added Journal Builder as display option in each tab - can now add any layout modules inside product page tabs.
- Popup Module. Improved overall popup system and added auto height mechanism, removing the requirement of a height for popups such as Login, Register, Quickview, Required Options, Layout Modules.
Blog New Features and improvements
- Added Blog comments Captcha
- Added Blog meta robots field
- Added Blog Comments admin notifications
- Added Blog Comments pagination
- Added Blog Comment submit alert style
Other Fixes and Improvements
- Fixed Selected item set to None for accordion displays, it is now possible to have all accordions closed in categories, manufacturers, products and blog posts modules
- Fixed an issue with split attribute values feature
- Fixed auto-update price reward points
- Fixed Quickview description Show Less button issue
- Fixed One Page Checkout guest checkout email already in use error
- Fixed admin re-login issue
Other small fixes and improvements throughout the entire framework, for a faster and better user experience.
