Flatsome vừa tung ra bản cập nhật 3.16 beta với nhiều thay đổi đáng kể. Cùng leekhoa.com tìm hiểu chi tiết về bản cập nhật thử nghiệm này và những tính năng sẽ được update trong phiên bản chính thức.
Chi tiết bản cập nhật Flatsome 3.16 beta
📖 Changelog:
— 3.16.0 —
NEW: Product additional variation images.
NEW: Product gallery grid layouts (stacked).
NEW: UX Builder: Resize handle for banner height.
NEW: UX Builder: Copy as shortcode element context menu item.
NEW: UX Builder: Show all registered image sizes.
NEW: UX Builder: Responsive max width for column.
NEW: Google Fonts served locally instead of CDN. (location: wp-content/fonts/)
NEW: Option to serve Google Fonts from CDN.
NEW: Option to enable or disable sale bubble.
NEW: Option to show product review count in catalog.
NEW: Option to disable single blog post category.
NEW: Option to disable single blog post title.
NEW: Status panel (environment, template overrides, …).
NEW: Status overview widget.
NEW: Fade-in hover style in element text options.
NEW: Backup and Import: Delete options backup button.
NEW: Swatches: Display value on swatch hover on single product page.
NEW: Include/exclude out of stock products in Product Flip element.
NEW: Blog posts: filter by multiple post tags.
NEW: Products: filter by multiple product tags.
NEW: Products flipbook: tag filtering.
NEW: Products element order by price.
NEW: Image: Title attribute option.
NEW: Vertical menu opener color option.
NEW: Vertical menu fly-out width option.
NEW: Vertical menu fly-out nav divider option.
NEW: Vertical menu fly-out nav height option.
NEW: Vertical menu fly-out nav color option.
NEW: Vertical menu fly-out nav color:hover option.
NEW: Vertical menu fly-out nav bg color:hover option.
NEW: All in One SEO breadcrumb integration.
NEW: SEOPress PRO breadcrumb integration.
ENHANCEMENT: Reduced CSS by 20%.
ENHANCEMENT: UX Builder: Scrub inputs vertically.
ENHANCEMENT: UX Builder: Improved paste values in inputs.
ENHANCEMENT: UX Builder: Improved responsiveness of scrub inputs.
ENHANCEMENT: UX Builder: Improved resizing of text boxes.
ENHANCEMENT: UX Builder: Reduced navigation animations.
ENHANCEMENT: UX Builder: Removed some interaction appending to browser history.
ENHANCEMENT: Disable some animations when “Reduced motion” is enabled for better accessibility.
ENHANCEMENT: Render open accordion on the server.
ENHANCEMENT: Disabled sticky add to cart on stacked layouts.
ENHANCEMENT: Swatches: Catalog picture tag support.
ENHANCEMENT: Swatches: Ensure variation image on inactive variations.
ENHANCEMENT: Swatches: Disable initially out of stock.
ENHANCEMENT: Improved scrolling performance.
ENHANCEMENT: Improved cache busting compatibility on chunk files.
ENHANCEMENT: Improved tabs accessibility.
ENHANCEMENT: Improved button accessibility.
ENHANCEMENT: Improved accordions accessibility.
ENHANCEMENT: Removed active filter title on the filter button.
ENHANCEMENT: Outline the focused element when pressing the tab key.
ENHANCEMENT: Improved keyboard usage with the main menu.
ENHANCEMENT: Improved WPML configuration.
ENHANCEMENT: Various CSS improvements.
FIXED: PHP Error: must be of type array, string given in ux_instagram_feed.php in some cases.
FIXED: Incorrect google CDN link win combination with ‘default Browser Font-Family’.
FIXED: Synchronous DOM mutation listener to a ‘DOMNodeInserted’ event violation.
FIXED: Exiting full-screen mp4 video navigated the browser back on iOS.
FIXED: UX Builder: Keep scrubbing when the pointer enters the canvas.
FIXED: PHP notice: undefined offset on menu items class in some cases.
FIXED: Catalog swatches with non ASCII (f.ex: Arabic) attribute slugs.
FIXED: Backslash in Advanced → Custom CSS fields should now be kept.
FIXED: WooCommerce One Page Checkout quantity compatibility.
FIXED: Sticky column when inner height dynamically changed.
FIXED: Backup option double description.
DEV: Updated FB graph API to v14.0.
DEV: Added flatsome_loop_review_count_html filter.
DEV: Added flatsome_icon filter.
DEV: Added flatsome_single_product_thumbnails_classes filter.
DEV: Added flatsome_single_product_thumbnails_render_without_attachments filter.
Note: add_action( ‘wp_head’, ‘flatsome_prefetch_scripts’, 5 ); changed to add_filter( ‘wp_resource_hints’, ‘flatsome_prefetch_scripts’, 10, 2 );
Note: UX Builder: To scrub and input value (margin, padding, …) press the mouse key down upon an input, then move the mouse.
Hướng dẫn trải nghiệm bản cập nhật Flatsome 3.16 beta
Để cài đặt và sử dụng phiên bản 3.16 beta hoặc các phiên bản về sau, bạn chỉ cần thực hiện theo các bước sau:
- Từ trang quản trị → Flatsome → Advanced → Updates.
- Tại mục RELEASE CHANNEL, Chuyển lựa chọn từ “Stable” thành “Beta”. Sau đó nhấn save (lưu) là xong.
Nếu sau khi lưu mà không thấy hệ thống tự update thì bạn xem lại đã điền key flatsome chính chủ chưa hoặc cần clear cache. Nếu bạn sử dụng cách active flatsome mà leekhoa hướng dẫn thì sẽ không thể update tự động được.
Mặc định thì Flatsome sẽ ưu tiên update bản chính thức. Các bản beta (thử nghiệm) vẫn được cung cấp nhưng không khuyến khích sử dụng bởi các bản này vẫn còn nhiều lỗi. Vì vậy, nếu bạn thực sự muốn trải nghiệm phiên bản flatsome 3.16 beta thì vui lòng sao lưu dữ liệu website trước khi nâng cấp để tránh trường hợp gặp lỗi không khắc phục được.
Những tính năng mới ở Flatsome 3.16 beta
Ở bản flatsome 3.16 beta này, studio đã có nhiều thay đổi đáng kể, mời bạn xem chi tiết dưới đây.
1. Google font sẽ được tải về hosting thay vì load trực tiếp từ google
Một điểm mới là sẽ có tùy chọn để bạn tải phông chữ của Google về hosting/vps của mình thay vì tải chúng từ Google CDN. Điều này sẽ giúp trang web của bạn tải nhanh hơn 1 phần và tăng điểm tốc độ trang của google. Và như Flatsome nói, “Việc tải xuống Google Fonts từ CDN của Google sẽ làm lộ địa chỉ IP của khách truy cập. Tệp phông chữ webfont được lưu trữ cục bộ cho phép người dùng tuân thủ GDPR. ”
2. Có thể copy shortcode khi nhấp chuột phải vào element
Giờ đây, bạn có thể nhanh chóng sao chép các phần tử riêng lẻ để sử dụng nhanh hơn, ví dụ: sao chép mã từ nơi này sang nơi khác dễ dàng hơn, điều mà trước đây chúng ta muốn copy thì phải chuyển sang chế độ HTML.
3. Sản phẩm biến thể có thể thêm nhiều hình hiển thị hơn (Flatsome + WooCommerce)
Đối với những ai đang sử dụng flatsome và woocommerce để làm site bán hàng thì các sản phẩm có biến thể trước tới nay thường chỉ hiển thị được một hình ảnh. Tuy nhiên, ở phiên bản mới 3.16 trở đi, các biến thể có thể hiện thị nhiều hơn một hình ảnh.
Để mở tính năng này, bạn vui lòng làm theo các bước sau:
- Từ trang quản trị → Flatsome → Advanced → WooCommerce.
- Tại mục WOOCOMMERCE PRODUCT GALLERY bạn hãy tick bật tính năng lên.
Giờ đây, khi điền thông tin biến thể sản phẩm, bạn đã có thể thêm hình ảnh biến thể vào gallery riêng của biến thể.
4. Thêm tuỳ biến cho mục Single Post
Trước đây, bạn chỉ có thể tắt hoàn toàn mục Header Meta đi (tắt hiển thị ngày đăng, chuyên mục, người đăng). Điều này đôi khi không đúng ý của người sử dụng. Vì vậy, ở bản flatsome 3.16 beta trở đi, người dùng đã có thể ẩn từng mục riêng biệt theo ý muốn.
