David N.

One of the areas we have reviewed in Commerce is the way that we handle custom items. Previously, many of our features were limited to Commerce Products. Even items such as Subscriptions and Download Files were not fully integrated. In Invision Community 5, we have looked at ways to improve the overall experience.
 
Icons and Images
A small, but important change: displaying the item icon when an image is not available. In previous versions, if no image was available, the checkout and client area displayed a standard "box" icon for all items. In IC5, we now show the icon defined in your Item extension.

 
Product Details
Line item details are displayed on the checkout screens, as well as on the Invoice. However, this functionality was restricted to custom package fields, which are only available for Commerce Products. This logic has been moved to a new extension method, detailsForDisplay.

 
Coupons
A very popular request is to create coupons for specific items that are not Commerce Products. Previously, coupons could either be applied to the entire purchase or to specific packages. We have added the following methods to the Item extensions to allow you to integrate your items with the coupon form.
couponFormElements
Returns an array of elements that will be shown on the coupon form. If no elements are returned, your item will not be listed. saveCouponForm
Process the values of the fields defined in your couponFormElements method. This method returns an array of data that will be stored with the coupon. isCouponValid
Check if the coupon is valid for this item. New default coupon form:

 
 
Autopay
When Commerce generates renewal invoices, we attempt to take a payment if a user has a card on file. We have moved this functionality to \IPS\nexus\Gateway::autopay(). Your gateway must also have the SUPPORTS_AUTOPAY constant set to true in order for this to work.
With the new logic, when a renewal invoice is generated, the task will loop through all available methods. If autopay is supported, it will attempt to take payment using that payment method.

 
We've tried to include the most popular requests that we've seen for custom items and payments. What do you think? Have we missed anything? What are some of the requests you've received for custom item integration?

Theming has been a core component of Invision Community since its inception, and this continues with Invision Community 5, but in a very different way.
If you haven't already seen Ehren's blog on the new Theme Editor, please do take the time to watch it. The all-new theme editor reduces the complexity of theming by taking complex concepts like HSL CSS variables into a pretty slick UI that almost any Invision Community owner can use to personalise or brand match to any existing properties.
Ehren will talk more on the technology behind the theme editor in another developer blog soon, but the short version is that the CSS framework has been completely rewritten from scratch with a new approach to how CSS classes interact with page elements.
Of course, if you're reading this, you'll want to know what tools you have for more advanced theming in v5.
Custom templates and template hooks
Invision Community 5 merges the concepts of custom templates and template hooks into a single feature. In the past, you could edit templates directly and create theme hooks. With Invision Community 5, these features are replaced with the new custom template system.

You can create new templates, which you can use in other custom templates via the short tag: {customtemplate='key'}. 
You can also hook into specific areas with a custom template allowing you to insert code before the opening tag, after the opening tag, before the closing tag or after the closing tag.
 
CleanShot 2023-10-19 at 13.17.16.mp4
For example, if you wanted to add something custom before the reply editor when viewing a topic, you would target that area like so:

The result, when viewed on the front end, is as follows:

These hookable areas are defined by a special tag that we add to the core templates. We would expect a lot of requests through the beta release and will likely create a request form so we can process them. We will try and accommodate as many areas as possible.
While direct template editing is no longer possible in Invision Community v5, the new custom template and hook system allows you to add new functionality, while the new CSS framework makes it easier to target and change elements without the need to edit templates.
We also added a suite of new development tools to enable you to target menus, data attributes and other areas where developers commonly had to edit templates before.
The good news is that now custom templates are not built on top of our 'master' template engine; they are virtually upgrade-proof and do not require manual merging.
Theme Designer Mode
Those who create themes for others have some extra tooling to enable them to build truly custom themes.
Even though the theme editor has space for custom CSS, there is always a need for CSS that your customers cannot edit, and Invision Community 5 has a special area for that once Theme Designer Mode has been enabled.

You also can add any ad-hoc javascript for when you want to hide elements or provide custom interactions.
As direct CSS editing and direct template editing are no longer possible with Invision Community 5, there is no need for a 'sync' tool to copy from the filesystem.
Conclusion
The new front-end theme editor is now the primary way to manage themes. This is where you upload logos and toggle settings.
As you can see, theming may look different in Invision Community v5. Still, the new custom templates, theme designer tools and UI extensions provide a lot of functionality that means you can do nearly everything you did in v4, but often in an easier way.
I'm sure you'll have many questions, so please add them below, and we'll do our best to answer them for you.