Hatsu

Finally, one of the most requested features for clubs in Invision Community is coming with our March 2024 release: Pages databases in Clubs.
You may be surprised to see a new feature being introduced for Invision Community 4 during our flow of news for Invision Community 5, but as we're committed to Invision Community 4, we wanted to continue to bring optimizations and improvements to the platform.
What is the benefit of this new feature?
Clubs enable communities to host multiple micro-communities with many benefits. Clubs allow more specialized and focused discussions on specific topics. This can lead to higher-quality content and a deeper exploration of niche subjects that may get overlooked when posted on a busy forum. Clubs also offer the ability to tailor the community experience based on the needs of that community. That customization is what this feature focuses on.
Pages is a powerful application that allows truly custom layouts for content areas. Simply by adjusting templates, you can create a news feed layout (it is what we use for this news blog area!) or something even more customized to your needs.
The March 2024 release allows you to create Pages database categories directly inside clubs, including custom fields and templates.
How does it work?
Setting up your Pages database to allow clubs to use categories is simple. Simply allow categories to be created within clubs when creating or editing a database.

Once that is done, club owners can add a Pages database category to their club in the same way they can add topics, galleries, etc.

Once the Pages database category has been added, you can then add content as you would any other club area with the added features of Pages, including custom templates and custom fields.
This example club uses a custom Pages database listing template to show the articles in a custom format along with custom field data.

Likewise, viewing an article in this example club showcases the use of custom templates to present the content differently from the standard topic templates Invision Community uses elsewhere.

Allowing Pages database categories inside clubs brings the opportunity for more complex custom areas making use of multiple custom fields along with truly custom layouts using templates. This is a great way to bring additional areas, such as news articles, into your club areas to compliment discussions.
We hope you enjoy this feature, and if you have any comments, please leave them below!

Welcome to the third video of our sneak peak series! Today, we're really excited to introduce you to the new Theme Editor!
Built entirely from scratch, the new editor provides an instant, live preview of your theme, as soon as you modify a setting. It's a zero-code approach to creating themes, and has been designed to ensure your theme adheres to your color scheme and looks great on every device, with very little effort. Let's take a closer look!
 
Paragraph 1.mp4
 
To the left of the editor, you’ll see a live preview of your community. You can navigate to any page, as if you were browsing your site normally. At the top left of the editor, you’ll find icons which change the theme between the light and dark color schemes. Below that are buttons which change the viewport size, from desktop, to tablet, to mobile. This is a really convenient way to ensure your theme looks great on every device, without needing to manually resize your browser window.
Lets take a closer look at the Color Palette.
Editing colors in version 4 was a fairly time consuming process. For example, modifying the color scheme from the default blue to another color meant that 26 theme settings needed to be changed. In contrast, the Version 5 theme is powered by just 3 colors: Primary colors are responsible for styling the main elements on your page, such as the Start new topic button. Secondary colors control minor elements, such as pagination links, while the Base color is responsible for controlling the overall tint on your site.
Clicking on these colors opens a color picker. Let’s change this blue color to yellow.
 
Video 2.mp4
 
You’ll notice two things have happened here. First, the preview window updated as soon as we modified the color. All elements which were previously blue, now use yellow, such as the Start new topic button. Secondly, the text color in our button has changed from white to black. This is our automatic contrast feature and it ensures our text is easy to read on our new yellow background, since white text may be more difficult to read for some viewers.
Below the color picker is a text box, with our color displayed in HSL. You can paste your own colors in this box, in any color format and that color will be applied to your elements.
 
Video 3.mp4
 
The Base color controls the tint of your backgrounds and text colors. Let's try a few examples to demonstrate how easy it is to recolor your theme.
 
Video 4.mp4
 
Next up are Logos! Invision Community 5 has three logo types: a text logo, an image logo for desktops and an image logo for mobiles. Let’s edit our text logo.
 
Video 5.mp4
 
After changing the text to “Theme Editor Demo”, we can see that the logo in our preview window updates instantly with our new text. Below that, we have multiple options to help us style the text logo, such as font-family These fonts are a combination of system fonts and web fonts. The web fonts are hosted locally on your site for optimal performance. Additionally, we can also change the font-weight and font-size. We might want a different font-size for mobile logos, so that can be edited too. We can see a live preview by changing our viewport to the mobile option.
If you’d prefer to use an image logo, you can assign it using the Image Logo options. Image logos are made up of 2 upload fields, one for the light theme and one for the dark theme. Below these upload fields, a slider lets you resize your logo so it fits neatly.
 
Video 6.mp4
 
Layout options let you assign the default layouts in your community. In our first sneak peak video, we showcased the new side panel layout, feed view for forum categories, and compact view for topics. These can all be enabled via the theme editor using a simple select menu.
 
Video 7.mp4
 
Lets explore some Color options! In the Header panel, we can see a list of elements we can customize. Clicking on an element opens the Swatch List, which is a list of 22 colors that are powered by the Base, Primary and Secondary colors from earlier. We have 6 "light" base colors, 6 "dark" base colors as well as various shades of our primary and secondary colors. Clicking on any of these swatches will apply that color to your element.
But what if none of these colors suit your requirement? That’s where the Color Picker comes in handy. Here, we can easily choose any color, or even paste in our own color like before.
 
Video 8.mp4
 
A major hurdle with themes in version 4 was customising the header. Depending on the complexity, this would typically involve modifications to both the CSS and HTML. That is a thing of the past with version 5! If we flick over to our Settings tab, you’ll see a brand new interface for customising the header. A new drag and drop feature allows you to easily reposition header elements without touching a single line of code.
 
Video 9.mp4
It’s an incredibly fun tool to play with, and we’re really excited to hear what you think!
Below the drag and drop area, we can customise the header further by using sliders to adjust its height, or we can enable navigation icons with a single click. Body settings let you can customise global elements such as the body background color, text colors, the max-width of your site, the font-family, font-size and more.
Editing Content boxes has always required code modifications in the past. Using this new editor, we can adjust not only the colors of the boxes, but also the borders and shadows. Theme editing has honestly never been this easy!
 
Video 10.mp4
And there you have it! Our brand new theme editor. With a few simple clicks and drags, we've been able to create a customised theme that looks great on desktops and mobiles, with a new color scheme, new logos, a customised header, new page layouts and restyled content boxes - all without touching a single line of code.
Speaking of code, for those of you who want to apply more advanced customisations, we’ve added a really convenient way to access your custom CSS file, via a new dialog box.
Video 11.mp4
And last but not least - the new theme editor is fully responsive, so even if you’re away from the desk, so you’ll be able to change colours and settings, upload new logos, redesign your header and even add your own code!
 
Video 12.mp4
 
Developing this new editor has been a lot of fun, and it’s even more fun to use. Themes have never been easier to edit and we're really excited for you all to get your hands on it so you can have a play for yourself - but for now, let us know what you think the comments, and we’ll see you next time!

Welcome to the second video of our sneak peak series! Today we'll be taking a closer look at the new Invision Community interface, including dark mode, accessibility improvements, performance improvements and the mobile layout! Before we begin, I should mention that this is a pre-alpha version of Invision Community 5, so some areas of the design may change before the official release.
 
New traditional header design
In our previous video, we showcased our new, optional side panel which formats your navigation into a vertical list. For those who prefer a traditional, horizontal header, here it is!

A much more compact header compared to version 4, the new design condenses the navigation bar into a single row, moving all sub-navigation items into dropdown menus. A new, optional area below the text logo allows you to add your website slogan or announce events such as anniversaries or holidays, and our new search modal provides convenient access to the advanced search filters from any page on your community.

 
Accessible interface
The main content area has been designed with accessibility as a priority. High contrast text colours and larger font-sizes help to make reading more comfortable and clickable table rows (which can be enabled or disabled via the Theme Editor) allow you to navigate between pages more easily. A visible focus ring significantly improves navigation for visitors who find it more comfortable to browse with their keyboard TAB key, instead of using their mouse (ie. visitors with conditions such as Parkinson's disease, or those who have temporarily lost function due to a broken arm).
 
Focus.mp4
Elements are highlighted while navigating with the keyboard
 
Dark mode
Dark mode has become increasingly popular over the past few years - so it's no surprise that Version 5 has been designed from scratch with both light and dark mode in mind. With version 4, it was necessary to manage two themes in order to provide a light and dark colour scheme. In version 5 though, all of that is handled by a single theme.
By default, your members will be able to choose their own color scheme preference: either light, dark, or system. System assigns a color scheme based on your system preferences - so if your device automatically switches to dark mode at night, your community will too! With that said, as an administrator, you also have the option to restrict your site to a single color scheme - so if you ONLY want to offer a dark theme, that's easily achieved.

 
 
Performance
Despite all of these new inclusions, the version 5 UI has been coded with significant reductions in both CSS and Javascript. We'll dive deeper into code reductions in a future blog entry, however two great examples are:
- Grids: which have had a 100% removal of Javascript and are powered by only a few lines of CSS, resulting in a faster rendering time, especially for users on slow connections.
- And carousels: which have had a 95% reduction in Javascript and now rely on native browser scrolling, for a much smoother experience on both desktop and mobile!
Additionally we've removed a number of helper libraries that are no longer needed with modern browsers saving even more.
 
Mobile UI
With an incredible amount of mobile visitors accessing the web, we’ve placed a huge priority on redesigning the interface to ensure it lives up to todays standards.
A new navigation bar at the bottom of the page provides convenient access to your activity feed, notifications, messages, a search panel, and navigation links. A conscious effort was made to ensure that this information was available within a single tap, and we found that a bottom bar like this was easier to interact with compared to icons in the header.

The mobile navigation bar from Invision Community 5
 
A goal of the mobile UI was to display elements that were previously only available on larger devices, while still maintaining a clean interface. For example, to improve navigation, we've added a scrollable breadcrumb list to the top and bottom of the page. To improve guest participation, we added Sign In and Sign Up links to the bottom navigation bar. These links were previously hidden within the hamburger menu, so we feel like this will really benefit those looking to improve registrations. And as demonstrated in last weeks video, profile information is now available within posts, comments and reviews on small devices.
We’re really excited for you to literally have a hands on experience with the new mobile interface of Invision Community 5, and we're interested to hear your feedback in the comments!

We are excited to announce that the Invision Community GraphQL API is now available.
This blog takes you through what GraphQL is and what makes it better than existing APIs present in Invision Community. It does get a bit technical, but you don't need to be a developer to appreciate how GraphQL will make life easier for those that do develop.
What is GraphQL?
GraphQL describes itself as a query language for APIs that gives clients the power to ask for precisely what is needed and nothing more.
GraphQL was created by Facebook in 2012 and is now an open-source project governed by the GraphQL Foundation, which operates independently of Facebook.
What makes GraphQL better than existing REST APIs?
GraphQL has several advantages over the existing REST API present in Invision Community, and these include:
Flexibility: GraphQL allows clients to request only the data they need, reducing over-fetching or under-fetching data. Getting data from a REST API often means receiving many fields and values you don't need to complete the operation you're creating.
Versatility: GraphQL can query multiple databases or APIs, making it a more versatile solution than REST, which often requires multiple endpoints for multiple data types.
Strong Typing: GraphQL has a robust type system, making it easier to understand the capabilities of an API and catch errors early in the development process.
Better Performance: By allowing the client to request only the data it needs, GraphQL can improve the performance of an application compared to REST, which often returns more data than necessary.
Easier to evolve: The schema-based nature of GraphQL allows for more straightforward and less-breaking changes to the API compared to REST.
Let's look at an example
You're building a dashboard that uses Invision Community data for your Node.js application that shows the latest topics, latest registered members and calendar events. With the REST API, you need to make three requests to get all the data you need. With GraphQL, you can fetch the exact data you need with a single request.

Modern Web Development
GraphQL is now the standard for modern web development, including building mobile apps. A modern web app has a "front-end" and a "back-end".
The front-end refers to the user-facing part of the web application. The front-end is typically written in client-side languages such as HTML, CSS, and JavaScript and is responsible for rendering the user interface and handling user interactions. It communicates with the back-end to retrieve and display data.
The back-end refers to the server-side part of the web application. The back-end is typically written in server-side languages such as PHP, and is responsible for performing business logic, managing data, and serving API responses to the front-end.
Using GraphQL as the interface between the front-end and back-end, the development and deployment of each component can be done independently, improving the overall efficiency and scalability of the application.
At Invision Community, we know that some clients use REST to pull data from Invision Community for use in bespoke web and mobile apps. So we hope you're even more excited about the possibilities with GraphQL.
A list with all currently available queries, mutators and data types can be found in our developer documentation section.

Extending Invision Community Functionality
Of course, you also have full access to the GraphQL API in the Invision Community framework, so you can use GraphQL inside your controllers to run your queries, which has the advantage that you won't need to worry about future changes to the API. 
In addition, we have also created a GraphQL template plugin, which can be utilized inside templates to fetch any data.
This is a more technology-heavy blog than usual. The main takeaway is that we continue to invest in ways to allow your Invision Community data to be used by your own applications. GraphQL makes that job a lot easier and much more efficient.
Let me know if you have any questions!

Humans are visual beings. Images attract our attention, can communicate ideas faster than the written word and can trigger meaningful discussions. At Invision Community we recognised this very early in the company history and have included a Gallery application for many years. During this time online communities have evolved substantially so we thought it was time to re-assess what it means to offer a community gallery and have some exciting developments to share.
Visual Refresh
The first thing we wanted to do was to give the look & feel a modern overhaul. @Ehren has done a fantastic job with modern design ideas. We took inspiration from the recent overhaul of the Events app and included a brand new Gallery overview page. This view better highlights featured and new images but also brings recent image comments in to focus to promote discussion.

Better Video Support
Video support has been included in Invision Community for a while but browser support has varied wildly. This often led to a poor experience where viewers were prompted to download plugins or forced to download the video in its entirety. Browser support for MP4 playback has moved on however and we have been able to update Gallery with some new functionality.
Frames from the video can be extracted for the preview thumbnail automatically. We have retained the option to upload a separate preview image however for people that want manual control over the image shown. Skipping ahead in videos is now also supported without the need to download the entire file or use plugins.
For communities that are able to leverage our cloud platform non MP4 videos will be automatically converted to support these features.
Searchable Image Contents
Another benefit for Cloud Communities is images can now be optionally analysed to make their contents searchable. For example, if an image of a tree or woodland scene is uploaded, this would previously only be searchable if the title or description of the image contained specific words or phrases. Now images can be identified solely by their visual contents.
NSFW (Not Safe For Work)
Invision Community contains tools to automatically moderate sensitive images to prevent them being posted. Some communities with more mature audiences may wish to allow these to be posted however but with some protection. We have therefore added the ability for images to be optionally set as NSFW when uploading. This will cause images to be blurred until the viewer opts in to viewing them.

Performance & Usability
Images by their nature can be slow to load (particularly on mobile connections) so we took some time and removed lots of redundant javascript and CSS. Where appropriate we have also added support for prefetching the next and previous images in an album or category and lazy loading is handled by the browser natively. We combined this with an improved image navigation experience using an image carousel when viewing individual images and removed the confusing Lightbox overlay. The Lightbox is now used solely for full screen image previews without the visual clutter of comment counts and other meta data.

These changes are the start of further Gallery improvements to come and as always we will continue to develop based on your feedback.
Let us know what you think in the comments.

As the deadline slowly comes down, two last feature additions race towards the descending door and slide in underneath with seconds to spare. 
If you've never seen "Raiders of the Lost Ark", then you probably think this is a weird way to start a blog.
As we wrap up development for Invision Community 4.5, we squeezed in two extra features that I want to talk about today.
Per Topic Post Approval
The first is a way to cool down a heated topic without locking it. Right now you can put an entire forum on post-approval. This means that moderators must review and approve all new posts before they are allowed to be publicly displayed.
As of Invision Community 4.5, you can now choose to set a single topic to post-approval regardless of the forum setting.

This is a great way to let a topic cool off but still receive new replies to review before adding to the topic.
Club Terms and Conditions
The ways that clubs are used throughout the many communities that run Invision Community are becoming increasingly varied.
A popular request is to allow members to agree to a set of club-specific terms and conditions before they can contribute to the club.

Invision Community 4.5 now allows the club owner to set up its own terms and conditions. You can optionally enforce that members agree to them before continuing.
That's it for feature announcements. We're excited to be closing development on Invision Community 4.5 and move towards a beta in the coming weeks.

Ever since Invision Community 4.0, there has been a huge focus on making communities multi-lingual by providing translation features inside the AdminCP.
We have received a lot of feedback on our multi-lingual and translation tools over the past year, and we're happy to announce these new features coming to Invision Community 4.5.

Pages Phrase Tools
If you have the Pages application, you can also use these phrases in HTML pages and HTML Blocks without needing to visit the translation tools area. Simply use the tag editor in the sidebar when editing a page or block's contents.



The new phrases sidebar options
You can quickly create new multi-lingual phrases by clicking the + icon.

The new add phrase dialog
Additionally, WYSIWYG Blocks have now been made translatable, so you can now create WYSIWYG blocks that will display their content in specific languages.
Translation Tools
Language pack creators can now set a version update URL which is checked to notify admins within the AdminCP that an update available, just like the theme system. This is a great way to notify customers when fixes are available.

Finally, you can now quickly add a new phrase from the Translation Tools page without the need to use the developer tools.

The new "Add Phrase" option

These little changes should make a huge difference in your workflow, and make it easier than ever to create fully multi-lingual pages throughout your site.

If you've been around Invision Community for a while, you'll know our frontend default theme hasn't significantly evolved since the early days of 4.0. Indeed, the last significant refresh came with 4.2.
With the upcoming release of 4.5, we wanted to revisit the default theme and give it a facelift for 2020, as well as make incremental improvements to the underlying codebase as a stepping stone to a bigger re-engineering in a future version.
In this entry, I want to talk a little about some of the design decisions that went into building the new theme.
Goals
Redesigning for the sake of it is never a good idea, so we first laid out what we wanted to achieve:
A brighter UI with more saturation & contrast and simpler overall color scheme Improved typography Better, more consistent, spacing around and between elements, especially on mobile Better logical grouping of sections of each page Reducing underutilized links/buttons on the page and finding alternative ways of making them available Improving how post states are displayed Modernizing and enhancing the underlying code that powers the default theme Let's talk a little about each of these.
 
Brighter UI
The most obvious change will be that our default colors are brighter and more saturated than before. Before making any changes, we first created a color scale for both neutrals and the brand color (blue, of course). This gave us a flexible but consistent palette of colors to choose from, with appropriate contrast built in. Neutrals have a touch of blue too to avoid seeming washed out.
We've simplified the style, in particular reducing reliance on background colors to differentiate sections within cards (a card essentially being an ipsBox, for those who are familiar with our framework). Instead, we use spacing, borders and appropriate typography to achieve visual separation.

Brighter default colors
 

Simplifying the UI by removing block backgrounds
 
Improving typography
We've felt our typography has been somewhat muddled for some time - with a mixture of sizes, weights and colors used depending on the particular context.
The first step to improving it was to create a typography scale that we could refer to and implement, to ensure we remained consistent throughout the product.

Our typography scale
(The keen-eyed amongst you may also notice we've switched our default font to Inter. Inter is a fantastic open source font that is ideal for text on the web, and was recently added to the Google Web Fonts project making it super simple for us to incorporate it into our default theme.)
We've been much more deliberate about applying type styles, especially for titles, ensuring that they are always visually distinct from surrounding text. We've done this through both color and weight. As a result, pages should instinctively feel more organized and logical than before.

An example of improved typography, from the Downloads app
 
Improved spacing (especially on mobile)
We identified that spacing (padding and margins) needed some improvement. A lot of spacing values were arbitrary and inconsistent, leading to poor visual harmony across any given page.
Most troubling of all, on mobile sizes we simply halved desktop padding values. While this was a reasonable approach in the days of phones with small screens, it has felt decidedly dated for some time. Phone screens are now typically larger and able to accommodate roomier UIs without appearing comical.
In 4.5, we have done away with that approach, and the impact was immediate. Mobile sizes now get a much more pleasant interface, with elements having room to breathe. In addition, we've also made most cards full-width to provide additional breathing space for content.

Posts can finally breathe on mobile
 
There are numerous other tweaks across the product too: default spacing has been increased a little, data tables (e.g. topic listing) get extra vertical spacing, and spacing between elements has become more consistent.
 
Improved grouping of related elements
Prior to 4.5, most content areas existed inside cards. However, one notable exception to this was page headers and as a result, they could feel particularly disorganized, especially for users who had many controls in this part of the page (such as staff).
To solve this problem, we've developed a new, standardized design for content item page headers, giving them their own cards and consistent button placement.

Topic view header
 
Some areas don't necessarily fit into the same design pattern above. In those areas, we've tweaked styling to suit the context, while still adhering to our overall aesthetic.

Calendar header

Messenger conversation header
 
Reducing underutilized links/buttons
Finally, another area we identified as needing improvement is the abundance of tools, made up of links and buttons, across pages. Many of these are only used occasionally and so would be better moved out of the main view to simplify the page.
Two particular areas we focused on were share links and postbits (both forum posts and comments in other apps).
Research shows social share links are used by a vanishingly small percentage of users, so even though they were at the bottom of the page, it was unnecessary to make them so prominent (given their eye-catching colors). To solve this, we've added a share link to the page header, with the social network links themselves in a popup menu. The result is ideal: sharing functionality is unobtrusive but obvious.

Share links in content items
Comment areas have also suffered from 'button creep' over the years. A typical comment will contain a report link, a share link, a quote link and multiquote button, reactions, plus IP address, checkbox, edit and options links for certain users. That is a lot of visual noise around the important part: the content.
We've therefore simplified comment boxes as much as is reasonable. Reporting and sharing comments/posts is now available in the post options menu, as are any tools for the author/staff. Quoting and reacting are two primary interactions for users, so they of course retain their position in the control bar.

Simpler postbits, even for staff
 
Improving post states
Posts/comments in Invision Community can have many states - sometimes more than one. Posts can be hidden/unapproved, popular, recommended, solved (new in 4.5!) or highlighted because of the author's group. It's always been a challenge to indicate these statuses well.
In previous versions, we added a border but the most prominent indicator was a flag in the top-right corner of the post. This had three problems:
Due to the lack of space (thanks to report/share links), showing more than one flag was difficult. Showing any flags on mobile was messy because of the space constraints. The meaning of the flags was not obvious, especially to new users. Group-highlighted posts had no flag, just a border, which made them even more difficult to understand. With the top-right corner of posts now tidied up and free from fluff, we were able to much more effectively use this space to indicate post statuses.
In 4.5, posts and comments will show badges when they have a particular status, as well as a more attractive semi-transparent border. For group-highlighted posts, we show the group name instead (the colors of this highlight are still controllable via theme settings).

A post with two states: group highlighted and popular
This works much better on mobile too, where the status badges get the prominence they deserve:

Mobile post statuses
 
Modernizing the underlying code
I wrote about the technical improvements behind the theme in a previous entry. If you're a theme designer or edit the theme for your own community, go and check it out now!
 
Wrapping up
As well as these large-scale concepts, you'll notice many other smaller enhancements as you start using the new theme.
I've shown some snippets of pages in the screenshots above, but I've included some full-page views below so you can see the overall aesthetic and how these pieces fit together.
Modernizing and refreshing our default theme has been needed for some time, but we view this as just a stepping stone to future work that will be reserved for a major version bump, and we're excited to figure out where we go next.
 
Screenshots
  
Desktop forum views (click to expand)
 
    
Mobile forum views (click to expand)
 
 
Activity streams & messenger (click to expand)
 

Invision Community introduced drag and drop widgets many years ago. These widgets allowed anyone to add blocks to existing views, and to build up entirely new pages.
These widgets were great for quickly adding content to a page, but they weren't incredibly customizable. 
For Invision Community 4.5, we've added three new Page Builder widgets which allow you a little more control.
For an overview of this new feature, please take a look at the video below.
As you can see, these new widgets offer a lot of customization without the need to code any CSS or HTML. You can add background colours and images, adjust padding and borders and even add colour overlays right from the widget menu.

The new Page Builder widget options
Blandness be gone! Now you can let your creativity loose on your pages and all other views that have the drag and drop zones.
I'd love to know what you think of this new feature; please let me know below!

A topic is more than a collection of posts; it's a living entity that ebbs and flows over time.
Evergreen topics can see month-long gaps between posts and longer topics spanning numerous pages can end up hard to navigate through to find useful content.
With this in mind, we've added numerous improvements to the topic view to bring context and summaries key areas within the topic.

Topic view updates
Topic Activity
The first thing you likely spotted in the above screenshot is the new sidebar. This acts much like a summary of activity within the topic. It very quickly lets you know how old the topic is and how long it has been since the last reply. This context is essential if you are unwittingly replying to an older topic.
Most topics are driven by a handful of key members. The topic activity section shows you who have been most active, which may influence which posters you give greater authority to.
Likewise, popular days lets you dig into the 'meat' of the topic which may have evolved quickly over several days.
More often than not, a single post attracts more reactions if it is particularly helpful or insightful, and this is shown too.
Finally, a mini gallery of all upload images allows you to review media that has been attached to posts.

The topic activity summary under the first post
This activity bar can be shown either as a sidebar or underneath the first post in a topic. If you enable it for mobile devices, then it will show under the first post automatically.

The topic activity summary on mobile
As with many new features in Invision Community, you have several controls in the Admin CP to fine-tune this to your communities needs.

AdminCP settings
Other improvements
The eagle-eyed among you will have spotted a few other changes to the topic view.
The first is the badge underneath the user's photo. The shield icon notes that this poster is part of the moderation team. Of course, this badge can be hidden for communities that do not like to draw attention to all their moderators.

You will also notice that when the topic starter makes a reply to a topic, they get an "author" badge as their reply may carry more authority.
When you scroll down a topic, it's not often apparent that there has been a significant time gap between replies. For some topical topics (see what I did there) this may alter the context of the conversation.
We have added a little identifier between posts when a period of time has passed between posts.

These changes add a little context to the topic to give you more insight into how the replies direct the conversation.
The new topic activity summary gives you an at-a-glance overview of key moments and posters to help you navigate longer topics.
We hope that you and your members enjoy these new features coming to Invision Community 4.5!

Who remembers the earlier days of the internet? Back when you popped your logo at the top left of your site and you were largely done?
Invision Community has continually developed to account for all the new services that have been built during our 16 years.
We now have social media sharing images, favicons and more to consider.
Invision Community 4.4 also adds mobile application icons, Safari mask icons and data for an application manifest. Handling of these logos and icons was a prime candidate for improvement in 4.4.
Moving our current options
Step one for improving our handling of these images was to move our current options out of themes and to allow them to be managed suite-wide from a single area. You can still upload a logo image per-theme (which shows in the header area), but the rest of the options have now been relocated to a new area: Customization > Appearance > Icons & Logos.

Adding new options
After giving favicon and share logo management its own dedicated area, we took a look at enhancing the configuration options made available through the interface without requiring theme template edits.
Multiple share logos
You can now upload multiple share logos. If you elect to upload more than one share logo, Facebook and similar sites will generally either show a carousel to allow you to choose which logo to use when sharing, or simply use the first image referenced.
Application icons
You can now upload an image to represent your website which will be used to generate the "home screen" icons for iPhones and Androids automatically. Uploading a single image will result in several different copies of the image (in different dimensions) being generated, and mobile devices will automatically choose the best option from the list as needed.
Safari mask icon
You can also now upload a Safari Mask icon, which is used to represent your website in certain areas on Apple computers (such as on the "touchbar" of certain keyboards). This image must be an SVG image with a transparent background, and all vectors must be 100% black.
Additionally, you can specify the mask color which is used to offset your image when necessary (e.g. to represent it as "selected" or "active").
Application manifest
In order for devices to support the application icons that you upload, a file known as a web manifest must be generated and delivered to the browser. This now happens automatically, using details and icons specified in the AdminCP. Certain details, however, can be configured explicitly from the Icons & Logos page:
Short name
This is a short name to represent your site in areas with limited screen space, such as below your application icon on a mobile phone home screen. Site name
This is the name of the site. The "Website name" setting is automatically used if you do not explicitly override it when configuring the manifest. Description
A short description of your site Theme color
You can choose a (single) color to represent the general theme of the site. This color may be used by devices in areas such as the address bar background. Background color
You can also choose a (single) color to use as the background color for your site when the application is launched from a shortcut saved to the user's device home screen. Display mode
Finally, you can specify the display mode your site should launch in. For our more astute designers and developers, you may have already realized that generating the manifest file lays the groundwork for future PWA (Progressive Web App) development and support. Additionally, some Android devices will automatically prompt users to add your website to their home screen now that a manifest file is generated by the site.
Oh, and for the sake of completeness, we also generate the special browserconfig.xml file that Microsoft products (including Microsoft Edge, Internet Explorer, X-Box, and Microsoft-based mobile devices) look for when pinning sites and generating live tiles. There are no additional configuration options for this file - everything is automatically generated from the aforementioned options.



The end result?
Your community can now better convey, automatically, certain details to the myriad of devices out there that may be accessing your site, and you now have much better control over those details. You can more easily fine-tune the "little things" that help paint a complete picture of your web presence, and the groundwork has been laid for bigger and better things in the future as standardization and adoption of PWA functionality improves.
This blog is part of our series introducing new features for Invision Community 4.4.

Do you recall that scene in Harry Potter where young Harry is sitting in his Uncle’s living room when hundreds of letters from Hogwarts burst through the fireplace, filling the room?
Sometimes, when you log into the administrator’s control panel, it can feel a bit like that.
As the administration control panel has evolved, there has been more of a need to display notifications, alerts and warnings to the administrators.
There are several things which may require an administrator's attention which may show a notice on the AdminCP dashboard, a banner on the community, or send an email. For example:
When a new version of Invision Community is released. A new member registers and requires administrator validation. A configuration issue is detected, for example if dangerous PHP functions are enabled on the server. There are items Commerce which require manual action, such as transactions pending manual approval or items to be shipped. Up until now, each such area would manage how these notifications show and are sent independently. In 4.4 we have introduced a new section of the AdminCP which shows all things which require administrator attention in one place, easily accessible from any AdminCP page.

AdminCP Notification Menu
Clicking on any of these notifications will take you to the relevant area of the AdminCP, or there is also a full-screen Notification Center which allows you to quickly take common actions such as approving members.

AdminCP Notification Center
While the best approach is to take the appropriate action (which will automatically dismiss the notification) so you always have an empty Notification Center, most notification types can be hidden, either temporarily on a per-notification basis by clicking the cross in the top-right, or administrators can hide all notifications of a certain type from their individual settings. Administrators can also choose which type of notifications to receive an email notification about.

Notification Settings
Each notification has a severity indicated by the coloured bar on the side and certain notifications can also show banners either across the AdminCP, or also on the front-end (to administrators).
Notifications group automatically (so for example, if there are 5 members pending approval, you will see 1 notification rather than 5 separate ones) and where appropriate each administrator can choose if they want to receive a single email, or a separate email with each occurrence.
Now you won't miss an invitation to Hogwarts, or anything important again.
This is a blog about our upcoming Invision Community 4.4 release, due later this year.

Whether you run an existing community or are taking tentative first steps into setting up an online community forum around your brand, an important choice you need to make is between social networks like Facebook or having a community you own and control.
Let's take a look at the benefits of an owned community versus a Facebook group - as well as how you can still use Facebook (and other social media platforms) to your advantage.
 
You own your data
The biggest point to consider when using Facebook groups is that you do not own your own data. Facebook owns it and does not even allow you direct access to it. If you decide later to move to a different platform, need to run reports to extract meaningful insights, or otherwise work with your community data: you are out of luck.
In contrast, with an Invision Community, your data is your data. You can use it in any way that makes sense for your goals; be it analyzing trends, sending promotions to users, or generating reports and statistics. We never hold your data hostage and there's no fee to get it.
Beyond owning the data, you also control how it's used and presented. Facebook is notorious for changing algorithms for when (or even if) people see your posts. When you run your own community the experience for your and your users is in your control.
 
Branding opportunities
This is a big one. An owned community gives you the tools you need to make your community a seamless part of your user's interaction with your business. This naturally includes your brand styles (your logo, colors, site navigation and so on) but also your community web address (URL). With an owned community, your URL will be easy to find - customers normally opt for something like forum.yourname.com or community.yourname.com. 
Users will have more confidence that they're in the right place, and more closely associate your community and your message with your brand.
Emails sent out by your owned community can also carry your branding, consistently reinforcing that connection between your business and your community.
And, of course, when users share content from your community to Facebook and other social networks, they're sending users directly to your website where you have the opportunity to lead with your most important call to actions.
 
More control over user experience
All Facebook groups are, essentially, the same experience and yet your business needs almost certainly aren't the same as every other. One size doesn't necessarily fit all when it comes to community!
When you control your own community, you have the ability to control your user's experience. Need to show specific types of data in specific places? You can do that (and more) with Invision Community's easy to use Blocks feature. Need to create a custom community application to serve as a resource center for product support? You can do that too.
Another huge benefit of this control is that, unlike a Facebook Group, users won't be seeing ads and 'recommended content' from competing businesses and communities. With user attention being pulled in so many directions these days, the last thing your community needs is for users to leave because Facebook has suggested a competitor!
 
No barriers to monetization
Not all communities require a monetization strategy. In many cases, the community is part of a larger customer relationship strategy rather than a revenue-generating destination in its own right.
But for those communities that do plan to monetize, options with a Facebook group are at best difficult to act upon, and at worst practically non-existent.
In contrast, Invision Community gives you the opportunity to explore monetization strategies that work for you. These might include paid subscription plans (a particularly attractive option for fan club communities), traditional advertising through Google AdSense and other networks, or sponsorship deals with other businesses that might be relevant to your members. Invision Community has tools for each of these approaches built in, allowing you to start monetizing with minimum fuss.
 
Fine-grained permission controls
Facebook groups struggle to reflect the real-world roles that staff members play in your organization, limiting your choices to 'administrator' or 'moderator'. And the same is true of users, too - your options for recognizing different levels of user (such as VIPs, or brand ambassadors) are limited.
Invision Community is different. Since you are creating and configuring each member group, you can precisely control who can see what, and how they are recognized within the community. You can even sync these roles via Single Sign-On (SSO) making setup and assigning users to groups painless.
For staff groups, you can limit access to key community functions based on roles or responsibilities, ensuring access is granted on an as-needed basis only.
For users, you can get creative and find a group structure that works best for your specific needs. For example, support communities often find that recognizing the most knowledgeable and helpful members with a new member group (complete with elevated permissions) is a great way of engaging users.
And finally, with this control over access, it's very easy to create restricted areas of the community. Whether you want to create a private subforum that staff can use to coordinate tasks or a file repository that's only available to subscribers, Invision Community can achieve it.
 
You can still reap the Facebook benefits
Setting up your community within Facebook's walls might not be the best approach for you. That doesn't mean you should ignore Facebook, however. On the contrary, it's an influential platform and there's a very good chance your users are already using it.
Invision Community offers a number of tools that allow you to benefit from Facebook while avoiding the drawbacks we discussed. We'll go into more detail on utilizing social media in a future article, but to summarize:
Invision Community features social sign-in options, enabling users to register and log in using their existing social media accounts, substantially reducing onboarding friction. Content can promoted by staff back to your social network pages, automatically and on a schedule you decide. Invision Community supports automatic embedding of a wide number of social networks (and other services), allowing users to share their favorite Facebook and Twitter posts and spark a whole new conversation - but this time in your community.  
Summary
When you are creating an online community for your business or hobby it is important to think about your goals and future growth by choosing a platform that is there to work for your needs.
When you establish your community on Facebook, you're helping to grow someone else's business (including, potentially, your competitors!) and hoping that some of those spoils fall to you. With an owned community, the rewards of your hard work belong to you and your business alone.
Invision Community has been enabling users and businesses to communicate online since 2002, and we're proud of our reputation as a platform that puts control in your hands. Contact us if you'd like to discuss how we can help you too.
 

Our Pages CMS is one of our most popular applications as we are continuing to improve it based on feedback. New in 4.1.13 includes:
Designer’s Mode HTML Editing
This update allows you to edit your HTML mode pages inside the designer's mode file system. Any edits you make, once saved in your text editor are instantly available which makes it much faster to build HTML pages with Pages.

 
Database Template Improvements
We listened to a lot of feedback about templating within the AdminCP for Pages and one common request was for a way to delete a group of database templates and to rename those groups. When you import databases, the template group names are created unique but you may want to change this to something more memorable. You will see here that the dialog also shows you which databases this template is used.

 
Page titles when using databases
Currently, when you add a database to a page, the page title is replaced with the database name. This may not always be desirable, and you may want the page title to remain in all database URLs (such as record view). There is now an option for this per database.

Relational Field Improvements
Now when you create a relational link between databases, you can opt to show which records link to the relational record. To give you an example, say you had a database for actors, and a database for movies, and you created a link on the actors record to show which movies they star in; now when viewing the movie, it will show you a list of the actors.

 
More Filterable Fields
We added both "Date" and "YesNo" field types to be filterable when viewing a list of records. When you use the Date type, you can select a date range for listing articles.

We also added the ability to use any custom field set as filterable to be used when creating a database feed widget.

 
Unique Fields
Another popular request was to allow a way to force unique entries for custom fields. This means that when enabled, only one record per database can have the same value. This is enabled when creating or editing a field.

 
Other improvements
You can now quickly delete an entire media folder via the AdminCP.

You can now quickly see which databases are used on which pages via the AdminCP page list.

 
And we added a way to programatically fetch a custom field value via the $record object. Currently, you need to use something like $record->field_12 which works well until you import that database to another installation. The fields are renumbered so this syntax no longer works. We made it possible to use the field key like so $record->field_{my_key_name_here}. Not only does this solve the issue when importing databases, it is also much more readable and easier to remember!

Many of the regular visitors to our community won't have failed to notice the new look we launched last week. Now that the dust has settled, I thought it was a good time to explain why we've made the change.
Streamlined access to everything we offer
Ever since IPS was founded in 2002, our community has been distinct from our website. The community is also where we kept all kinds of resources, from guides to the Marketplace. For those customers who know us well and enjoy hanging out in our community (and we have many who have been with us since that day in 2002!), this is no problem. Unfortunately, the downside is many new and potential customers didn't see everything we have to offer: all the wonderful addons our contributors offer, additional support resources, plentiful advice from other community administrators, and more.
In addition, we've always used the default theme that our software ships with, but with our self-service demo system now being the primary way new customers get to try out our software, this has become less important.
So, we took the decision to move some parts of the community to the website for more exposure and easier discovery by new visitors. We made some tweaks to our navigation so that finding these areas is easier than before. And, of course, we've brought the website header over to the community, giving it a fresher look and more consistent navigation, wherever you happen to be on our website.
Of course, all of our website is built in IPS4, as you would expect. Whereas before our website existed on a separate installation, as part of the update we merged our community and website together. This means you can sign in from anywhere, see your notifications and so on.
This is just the first step we've taken on improving what we offer and how we offer it. We have many plans in progress. You may have seen the theme tip we posted this week, which is the first in a series of regular tips we'll be sharing to help you get the most out of the IPS Community Suite. We'll also be highlighting some of the incredible work our customers do, whether it's a unique use of our software, or something in our Marketplace that adds a great feature.
Stay tuned!