Meddysong

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!

It’s been a minute since our last blog post, but we have cooked up several epic projects in the interim.
To refresh your memory, we recently launched a new platform update, 4.6. It includes *takes a deep breath* Achievements, Zapier integration, web app and push notifications, anonymous posting, solved content, the ability to show when a team member has replied, a new health dashboard, spam improvements and more.
In the time since, we prepared a few special treats for you. Before we dive into the feature feast, sample our forthcoming website refresh. In the very near future, our entire website will slip into something a little more comfortable. Not only will the look and feel change, but we’re implementing new sections to explain how and why Invision Community is any business’ go-to- solution for community building. More on that to come, but for now take a bite out of this:



Onto the feature updates; hope you’re hungry!
Extended closed Club functionality
Clubs with ‘closed’ permissions have more flexibility than ever. 
Now, the owner of a closed club can opt to have the club’s forums, calendar, pages, gallery and downloads be visible for all to see (despite the club being set to closed). Previously, members could not access any part of a closed club unless they joined.
For example, a closed club leader could create a special landing page that’s viewable by members who have not yet joined the club, but the rest of the club is closed. This might be useful as a means to encourage someone to join, share information that’s pertinent to those in and out of the club or as a sales tool. 
Another example could be keeping the club-associated forums visible for all, but keep the club’s calendar and image gallery exclusive to the club’s members as an incentive to join. 
Gobble up this screengrab below:
 

 
Subscribe to Activity Streams
Never skip a beat! Members of a community can now subscribe to any default or custom activity stream (minus the All Activity Stream) and receive either daily or weekly email notifications with a roundup of content they may have missed. 
This is especially useful for die-hard community members and moderators who frequently consume content. By subscribing to an activity stream, members have important, need-to-know items they’re interested in delivered straight to their inbox. 
 


Community administrators have the option to limit how many activity streams a member can subscribe to. 
Because email notifications are inherently intimate, we have also implemented something called stream decay. If the user hasn't visited the site for a predefined amount of time, the activity stream email notifications they previously subscribed to will automatically stop until the member re-engages with the community by visiting. Pretty nifty, right?
 

 

Health Club
Since you’ve made it to the bottom of this blog post, sink your teeth into dessert. Sugar free, of course! 
We recently launched a new Health Club. It’s free to join and available for all Invision Community clients. This is a great opportunity for you to connect with other community leaders in the industry, as well as our own team, through the important modality of physical and mental health. The world is in a weird spot right now; please utilize this club to lean on one another for support, give advice, ask questions and share your health wins and missteps. As cheesy as it sounds, upping your general well-being will make you a better community leader and ultimately elevate your community as a whole. Just some food for thought!
 

The new Club and Activity Stream features will be made available in September.
Questions? Comments? Feedback? Drop us a crumb in the comments - we’d love to hear from you!
Header photo: Unsplash

Invision Community is growing! We're currently recruiting three new roles, one full-time and two part-time.
Applications are now closed, thank you to all those that applied. We'll be going through them over the next few weeks.
It's been a very busy year for all of us at Invision Community and our continued success means that we're looking to expand our team even further with three new roles to fill.
Invision Power Services, Inc. is behind the leading community software platform, Invision Community. Our tailored solutions serve clients of all sizes, from smaller communities to the world’s biggest brands.
We are looking to kick start 2021 with a tight-knit customer-obsessed support team to build a positive support culture for our clients.
All roles are fully remote-working.
Customer Service Superstar
We are in need of a full-time Customer Service Superstar, a new position within the company. You are solution-driven, customer-obsessed and passionate for cultivating a positive support culture for our clients. 
 
The person in this role:
Answers client questions in a public-facing forum. Triages client requests to developers according to our processes. Deescalates problem or potential problem communications.  Advocate for customers to our development team. Is comfortable with technology and willing to learn our platform.  Why should you apply? 
You are a Customer Service Star - solution driven when helping clients. You are confident in conversing via forum style, public-facing support. You can clearly communicate both in writing and verbally. We primarily provide customer service in English. You see opportunity to streamline improvements to help our team better serve our clients.  Excited about interacting with our clients within our community to build a vibrant support culture. You work well with a team remotely.  You are personally organized, suited to excel in a remote work environment. Part-Time Community Support Assistant
We are looking to add two part-time community support assistants to our growing team. You are self-motivated and focused on helping customers with support enquiries.
 
Your role will be in assisting customers via a public-facing support forum.
Ideally, you will have customer support experience, be familiar with our community platform and comfortable with technologies such as FTP, Amazon S3, PHP and MySQL.
Work Location:
Our company is headquartered in Lynchburg, Virginia with staff located around the world. These positions are remote working.
Interested?
Share your resume and characteristics that make you the best fit for this role. Please include your available work hours (timezone). As we are open to both entry-level and experienced applicants, you may choose to include a desired starting salary based on your own evaluation of your relevant skillset and experience.
Apply now!
Applications are now closed, thank you to all those that applied. We'll be going through them over the next few weeks.

For a long time, Invision Community has supported a Question and Answer mode within the Forums application which allows a reply to be flagged as the "best answer" to the question posed. With the release of 4.5, we also introduced a way to allow topics to be marked as "solved" which introduces similar functionality without transforming the look and feel or other behavior of the forum itself.
Based on the popularity of this new addition in 4.5, we have made some further improvements to solved topics and answered questions in our next release.
Notification to topic/question starter
While notifications were available to the poster who answered a question or solved a topic with the release of 4.5, this release also adds notifications for the topic or question starter so that they can be made aware that an answer is available to their question.

Topic and question starters now get notifications for solutions
AdminCP Statistics
Solved topics and answered questions provide for measurable statistics that can help you determine the health and direction of your community, particularly for support communities. To that end, we have introduced two new content statistic blocks that can help you measure how well areas of the community that support answers and solutions are faring.

New AdminCP statistics
You can now quickly see the percentage of topics/questions that have been solved (relative to the total number posted in areas that support solutions), as well as the average time it has taken for a solution to be marked on a topic or question (relative to the time the topic or question was initially posted). These statistic blocks support time period filter, time period comparisons, and node filtering to narrow down the statistical data for your specific needs.
User profile enhancements
User profiles now show the number of solutions the user has posted, and also allows you to view all of those solutions, in a manner very similar to reputation.

Prolific problem solvers will now be called out boldly

Answers can be quickly found on user profiles
These improvements should help reward the most helpful users on your community by giving them more prestige and helping other users find their answers quicker.
Collectively, we hope that these changes make the question and answer and topic solution features in the Forums application more useful for your community members, and the administrators behind the community.

We've been on a little journey together since we announced the first Invision Community 4.5 feature way back in November 2019.
The first feature we announced was a revamped Admin Control Panel interface which created more visual space and brightened it up. Actually, we made it so bright that the first feature request was to add a dark mode (which we did).
In the space of three short months, we had spoken about Club improvements, invites and referrals, RSS feed improvements, blog categories, the simple stock photo picker, search insights, security enhancements, user interface updates, new statistic views, and notification improvements.
Most will agree that March and April seemed to last months, thanks to a global pandemic. We used these extra days to talk about marking posts as a solution, topic view summary, Zapier integration, forum view updates, post-installation onboarding, private staff notes, page builder widgets, theme designer improvements, a new default theme, language system updates and everything else we missed.
We have also revamped the front end user interface to modernise the look and feel but also to introduce new CSS frameworks, variables and other time-saving features our design team have been eager to implement.

On the subject of modernisation, we've deprecated some legacy functionality. We've given up trying to make anything look good with IE11 which last saw an update in 2013. We've also deprecated older caching engines like Memcache, APC and Wincache and recommend using Redis instead. The web hosting and domain management features of Commerce are also deprecated as is BBCode. BBCode has its roots in the earliest bulletin-board systems long before rich text editors were common use. It's 2020; we should no longer be asked to type in special codes in square brackets to format text. BBCode is still functional in Invision Community 4.5, but it is likely to be removed in a future version.
Now that primary development has finished, we move onto the beta testing stage. This is where you get to try it out and evaluate the new features before scheduling your own upgrades.
As always, we do recommend that you only test early betas on staging sites or simple test sites. Many a weekend has been ruined by over-enthusiastic upgrading of live sites; so we don't recommend that.
You'll also notice that we're running Invision Community 4.5 on our own site. If you do spot an issue, please let us know in the bug tracker.
I've been creating and releasing products for close to twenty years now, and I still get a real buzz out of hitting the release button. It's always a pleasure to see the result of hundreds of hours of coding, dozens of meetings and numerous passionate exchanges among the team.

You can access the beta in your client area.
We hope you enjoy Invision Community 4.5!

Almost ten years ago we launched the Marketplace; a place to connect Invision Community owners with talented developers creating new functionality.
Over the decade, the Marketplace has grown to hold thousands of applications, large and small. For many Invision Community owners, the Marketplace has become an essential resource.
Our aim was always to have the Marketplace available inside your Admin Control Panel to make it even easier to purchase and install extra functionality.

I'm pleased to say that as of Invision Community 4.5, this is now a reality. You can browse the Marketplace and install new add-ons without leaving the Admin Control Panel.

Obtaining Resources
Paid resources can be purchased directly from the Marketplace and are available to install immediately after the payment is complete. You no longer need to download and install the files yourself.
You may also notice some additional information with the resource listing, we'll be introducing a new 'tab' to marketplace resources to allow the authors to provide more useful information such as answers to frequently asked questions, or configuration instructions etc.

The video below takes you through the purchase and installation of a Marketplace application.
marketplace-install.mp4
Installing an Application
Updates
Some of the eagle-eyed among you may have noticed in the first screenshot that there are more 'bubbles' showing in the menu on the left. These are supported for Applications, Plugins, Themes and Languages.
In Invision Community 4.5 every resource available via the AdminCP is automatically versioned, you will see update notifications for everything you have installed (previously, you would only see update notices if the resource author supports them).
Installing an update is as simple as clicking on the update notice, then clicking 'update' on the Marketplace listing.

Installing Updates
Downloads Changes
Our Marketplace is built on our Downloads application, during development of this feature we needed to add new functionality. We have included as many of these improvements as possible in our software for the benefit of our customers, some of these are:
Custom Fields can now be set to only show to members that have purchased a file. Files can now be set to accept a single file upload instead of multiple. New file versions can now be moderated without hiding the current version from view. Downloads REST API Performance Improvements New /download endpoint that counts the download Added more data to the /downloads/file/{id} response Ability to sort file results by last updated date We hope you're as excited about this feature as we are.

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)
 

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. Keep an eye out for our next blog for more on the facelift.
In this entry, I want to go over some of the design and code-level changes we've implemented that will be of particular interest to third-party theme designers, or those building a custom theme for their community.
IE11 Support
Until now, we've supported IE11 as a 'B' browser - meaning we didn't aim for perfect support (especially visually), but did aim to make all functionality work, and we fixed IE11-specific issues if possible.
As of 4.5, we no longer support IE11 in any way and Invision Community will not work well in that browser. By removing support for IE11, we are able to make use of newer CSS technologies which significantly eases development for us and third-party designers. I'll discuss some of those below.
Combined theme settings
We've combined a number of existing theme settings into one new setting. We've found that settings like poll_bar, step_background, rating_hover and so on are nearly always set to the same color - typically the site's main brand color. These settings have therefore been replaced with one new brand_color setting, which is used throughout the CSS in places where this primary color would be needed. This will simplify the early stages of theme development and make it easier to match branding in Invision Community.

Front end colors
Removing hardcoded colors
While our theme settings have allowed community owners to change most colors, there were still many hardcoded in our CSS framework. These were typically neutral colors used for things like 'close' links, semi-transparent backgrounds and so on, but it was enough to make creating a dark theme an unrealistic prospect without an awful lot of effort (and kudos to those designers who have offered dark themes up until now!).
In 4.5, we've removed hardcoded colors from our framework, and instead rely on colors already defined by theme settings. You can now, finally, create a dark theme just by editing the built-in theme settings.
Type scale & {fontsize} tag
While we've had fixed type-size classes (e.g. ipsType_normal) for a long time, in practice many elements had their own font sizes set. This leads to inconsistency and poor visual rhythm too. Another side effect is it was also tough to globally change the font size (such as for branding purposes, or to create a theme for visually-impaired users).
To solve these problems, we first created a type scale; that is, a fixed number of sizes to choose from. A product the size of Invision Community does have need for a flexibility, so we settled on the following scale:
x_small: 12; small: 13; medium: 14; base: 16; large: 18; x_large: 20; 2x_large: 24; 3x_large: 30; 4x_large: 36.
All of these values are editable as theme settings, so each theme can adjust the type scale used. Our default CSS in 4.5 has been fully updated to put all type on this scale.
To actually make use of these settings, we have added a new {fontsize} tag which accepts either a scale key, or a specific pixel size (for those occasional situations where a specific size is absolutely needed, e.g. icons).
Why couldn't we just use {theme="x_small"}, or even CSS variables? To solve the problem of globally scaling text, we have also added a percentage-based scale setting that will save you from having to create your own type scale. The {fontsize} tag automatically applies the global scale to any values passed into it. Want text in your theme to be twice as big as default? Simply set the global type scale to 200% and the entire theme will reflect the change immediately. 

The new font size options
Spacing scale
The lack of a consistent spacing scale has led to some arbitrary values being used in any given situation, which again has had a negative impact on the visual harmony of our design. We've therefore implemented a 4px spacing scale (using CSS variables rather than theme settings this time) and applied across almost all padding/margin values. In time, we anticipate fully switching all measurement values to the scale.
New CSS class families
We have added a range of new spacing classes for padding and margins, allowing far more control over how these are applied, especially on different device sizes. Previously, ipsPad (15px) was simply halved on small screens - with no 'opt-out' short of adding specific CSS. We've felt this has been imprecise for some time, especially since mobile devices typically have larger screens in 2020 and don't need to be so tightly-spaced.
ipsPad_all now replaces the existing ipsPad, and does not halve itself on small screens. Instead, there's a new responsive naming convention that allows you to apply specific padding on specific device sizes:
ipsPad_all:double md:ipsPad_all sm:ipsPad_all:half
In this arbitrary example, desktop size (the default) get double padding, medium (tablets) get regular padding and small (phones) get half padding.
We've added similar classes for top, bottom, left and right padding, as well as horizontal, vertical and none (to removing all padding) shortcuts.
For margins, the old ipsSpacer_* classes have been replaced with a new ipsMargin family that work exactly the same as the padding classes above, with the same range of flexibility.
The old ipsPad/ipsSpacer classes will continue working as they did before for backwards compatibility, but should be considered deprecated from 4.5 onwards.
We've also added a whole range of new ipsFlex classes, also with responsive controls (making it easy to have horizontal layouts on desktop and vertical layouts on mobile, for example), as well as a new ipsGap utility that automatically adds spacing between elements, without requiring manual :first-child/:last-child exclusions.
CSS variables & calc()
In 4.5, thanks to IE11 support ending, we're finally making use of CSS variables and calc() to make CSS more maintainable and easier to customize. A lot of repeating or often-customized styles - such as form field styles, message colors, card styles, border radii etc. - are now created as CSS variables, allowing theme designers to easily change styling in one place. Instead of magic numbers, we either stick to our spacing scale, or use calc() to avoid hardcoded numbers.
The future
The work we've done so far is just a 'first-pass'. We'll be pressing forward with modernization throughout the 4.5.* series and beyond with a view to reducing our footprint, improving our ability to maintain our CSS and, of course, making theming easier for our customers.

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!

Installing Invision Community for the first time is a fun and exciting process. After all, you're about to launch a new community that is going to thrive and attract members from all over, and you want to make sure you set it up just right to facilitate a painless experience for your visitors.
If you're new to Invision Community, however, it can be a little daunting when you think about "ok what now?" immediately after installing the software.
Though experience, and researching the analytical data Invision Community installations voluntarily share with us, we identified many common settings that most communities change, and it is easy to see why. In an effort to make Invision Community more approachable to new administrators, we have devised an intuitive "new installation" onboarding process that will help you configure the community just right, and quickly.
Upon first logging in to Invision Community after installing the software, administrators are presented with a welcome screen.

Welcome to your new Invision Community!
You can obviously skip this step by clicking away to another page if you wish, and you won't be bothered again. If you click the "Skip this step" link on the page, you will be sent an email with a link to return to the page in the future should you wish to do so.
Continuing into the helpful wizard, you will be presented with a screen like so

A helpful guided wizard
You'll note that there's an explanation as to why you may wish to configure these settings, as well as guidance for where to find the same options later should you wish.
Upon clicking next, you'll see the previous step marked as completed. You can even skip around steps by clicking and expanding on them should you wish to do so.

Each step is explained in detail
If you reached this page but decide that you have to do something else first, there is a "Remind me later" option at the bottom of the page. Clicking it will allow you to resume whatever else you need to do first, but will helpfully bring you back to this onboarding step at a later time to finish your quick setup.
Finally, once you submit the form you will be presented with a confirmation page containing links to several other areas that you may wish to visit to get started. Things like setting up forums and setting up groups are common tasks, so we've consolidated links to those areas on one helpful screen as part of the new quick setup.

Confirmation that you're doing great so far!
This change is but one small way that we strive to ensure our software is easy to understand and easy to use. The next time you set up a new community, we hope these adjustments make the process smoother for you, allowing you to get the backend work done quickly so you can focus on the real goal - growing your new community.

Invision Community has had different view modes for a good number of years.
Forum grid view was added to create some visual interest when listing forums, and we've had expanded and condensed view modes in streams since they were introduced.
We've taken both of these views a step further in Invision Community 4.5
Forum Grid View
To create even more visual interest, the grid view now allows you to upload, or choose a stock image for the header. This instantly makes for a more dynamic and inviting forum list.

The new grid view image headers
You can choose an image from the Admin CP when creating or editing a forum.

Choose a stock photo, or upload your own
Topic List View
For the topic list view, we have taken inspiration from our stream view options to introduce a new 'expanded' view mode, which displays a snippet of the first post.

The new expanded topic list mode
This immediately entices you to engage with the topic because you can read part of the post without having to click inside to see if it interests you.
This is controlled via the Admin CP, where you can choose the default view, or turn off the new view completely.
Other Changes
You may notice a few other subtle changes in these screenshots. The first is that we now included the follower count as a metric on both the forum grid view and the topic expanded view modes. The number of followers is usually a good indicator of how others perceive the value of the content. A higher follower count generally means a more engaging topic or forum.
You can also see that we've switched to a short number format to keep the displays clean. Instead of say, "2,483 posts", it will merely say "2.5k posts". Reducing visual clutter is always crucial to maintaining a clean user interface.
We hope that you find these new view modes useful and that they make your community even more vibrant!

Zapier is a service that allows you to connect over 2,000 web apps. In Invision Community 4.5 we are launching a beta service of Zapier integration for Invision Community in the Cloud.
What does Zapier do?
Zapier acts as a bridge between Invision Community and other apps, such as Google Docs, Twitter, Facebook, Slack, Trello, Facebook Ads, ActiveCampaign, Zendesk, Asana, Salesforce, Hubspot, Discord, Stripe and more. Zapier has over 2000 apps registered currently, and that number grows every single day.
Let us look at a real life example.
Right now, if you wanted to add a member to a Google Sheets document each time a new registration was completed, you'd need some fairly complex code to be written that was "triggered" by this registration event. This would take days to write at some cost.
Zapier simplifies this by allowing you to connect Invision Community with Google Sheets without needing a single line of code. Zapier allows you to streamline your workflows in minutes.
Zapier has two types of events, triggers and actions.
Triggers
When a certain thing happens on Invision Community, like a member registering or a topic being posted, a trigger can be sent to Zapier to then run actions in other apps. For example, you might create a zaps to...
When a member registers, add their email to a Mailchimp list. When a moderator posts a topic in a news forum, share it on Facebook, Twitter and other social platforms. When a member posts something that requires moderator approval, send a message to a Slack channel for your moderators.
Invision Community Integration with Mailchimp through Zapier
Actions
You can also set up Zaps so that when something happens in an external application, it triggers an action in your Invision Community. For example, you might create a zaps to...
When you add an event in a Google Calendar, create a Calendar Event on your community. When you receive an email to a feedback email address, create a topic on your community in a forum for moderators. When you create a task in Trello, add a record to a Pages Database on your community.
Invision Community Integration with Google Calendar through Zapier
Self-Integration
In addition to using Zapier to integrate with third party services, you can also connect an Invision Community trigger to an Invision Community action. For example: when a member registers, create a topic in a welcome forum.

Self-Integration through Zapier
Frequently Asked Questions
What integrations are available?
In the beta launching with Invision Community 4.5, Zapier will be able receive a trigger when a member account or content (forum post, gallery image, etc.) is created and send actions to create the same. More triggers and actions will be added over time. When will this integration be out of beta?
Later this year. Will third party applications and plugins be able to create Zapier triggers and actions?
Because the integration requires an app hosted with Zapier (which is written in Node.js) and this has to be submitted directly by the vendor, it will be difficult for third party applications and plugins to integrate with Zapier through Invision Community's integration. In the future we may be able to provide basic abstracted integrations for third party applications and plugins through an extension API. In the meantime, third party authors can of course write their own Zapier Apps if desired.

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!

The news is currently filled with anxiety over coronavirus and workers are being encouraged to work from home where possible to limit or delay its spread.
For many people used to commuting daily and working in shared offices, this is a huge upheaval which will take a while to adjust.
How do you stay motivated and productive when you're not at your desk and held accountable by your colleagues next to you?
Remote working has become popular over the last few years. The internet has transformed how we work, and improvements to connection speeds, authentication systems and cloud architecture make working home a viable alternative for many office workers.
Working from home certainly doesn't suffer the same stigma it did years ago when it was synonymous with sleeping in late, daytime TV binges and excessive time in pyjamas.
A good number of years ago, I was getting my hair cut. It was about 11 am on a weekday, and we had the usual small talk as she attempted to tame my unruly mop. The question I was waiting for dropped a moment later "so, is this your day off?" My reply was that I work from home so have some flexibility in my day. Usually, this gets a nod, and we move onto the weather. I'd not met this hairdresser before. She processed my reply, stopped snipping and locked eyes with me via the mirror. "Do you really work from home, or is that you don't have a job?"
Fears over reduced productivity from remote workers have proved to be unfounded. A large-scale experiment was conducted with 16,000 employees of a Chinese call centre. Workers were randomly assigned to either work from home or at the office for nine months. The home workers enjoyed a 13% performance increase due to fewer breaks and sick days.
At Invision Community we not only make a product designed to bring people together online, but a good number of us also work remotely. Our HQ is in Virginia, USA but we have team members in the UK, Europe and Australia. Remote working allows us to hire the best people we can find, and not just those who are within a few miles of our HQ.
I spoke with our team to get their tips and strategies for working from home and still getting work done.
Rikki, lead UI designer
Get out of the house every day
It's easy to fall into the trap of being a hermit for days on end. Particularly in the summer, I like to take a walk to get lunch every single day. It gives me a chance to get some fresh air, a little exercise and most importantly get away from my office properly (instead of just being in the next room, which doesn't feel like it's really taking a break).
Don't take your work home downstairs with you
Another easy trap to fall into is working every waking hour because you're always 'at work'. Set fixed work start/end times and stick to them. Leave your office at the end of the day and consider the work finished. If you do need to hop back to work later because something cropped up, go back to your desk to put yourself in work mode - don't be tempted to start working from the sofa.
Olivia, Customer Success Manager
Organize your workspace
You may not be lucky enough to be able to repurpose a dedicated room in the house, but that doesn't mean you can't find a good spot to work from. Choose a place that is free of clutter and well lit.
Organize your work
I'm a big fan of to-do lists. Keeping my lists organized helps me stay on track and prevents me from drifting too far from what's important. I like the "To Do versus To Get Done concept."
Organize yourself
Plan in breaks away from your screen. There's always one more email to write, but setting times to take a break is vital to keeping your energy and focus. Working from home means that you cannot rely on others to remind you!
Check-in often with teammates
At Invision Community, we use Slack to keep in touch and recreate the 'water cooler' moments where we discuss our favourite TV shows, movies and more.
Reframe "my office is always open" to "I'm always available for a call". Remind your colleagues often that they can start a voice call if they need to talk.
Stuart, developer and migration specialist
Minimize human distractions
When you're working from home, it's easy to get distracted, especially by other people! Remind your family and friends that during your work hours you're working. As much as you'd love to spend the day drinking tea (or beverage of your choice) and chatting, you do have a job.

Stuart's work area
How we do it
There's no doubt that we're fortunate to have a team that is self-motivated and responsible. Remote working can allow individuals to drift, and productivity suffers.
We use a combination of software platforms and a few simple strategies to keep us all informed, organized and feeling part of a greater team.
We use Slack to not only onboard new clients, but also to organize product development, feedback and support. These channels are well used, but without a doubt, our 'general' channel is used the most. This is where we hang out socially and chat during our breaks. It's easy to see this as unproductive or distracting, but I feel that it helps build us as a team and helps forge relationships with each other.
We use a private Invision Community as an intranet hub which does the heavy lifting for organizing releases. It also acts as a repository for feedback, new feature ideas and development discussions.
We encourage breakout groups to voice call to resolve hot topics and pressing issues. It's amazing what you can get done in a few minutes by voice.
We hold a stand up voice meeting weekly where we organize the week, discuss anything pressing and run through development tasks. This call is developer-focused, but it's held company-wide, so it is inclusive. We try and avoid human information silos where possible.

Daniel's workstation
Above all, just keep talking
It's just as important to share your personality as it is your work. Make sure you check in on quiet colleagues to make sure they're OK. Not everyone is super-chatty, and some prefer to switch off and focus. However, it's easy to feel a real sense of loneliness and isolation if you don't have a partner or family living with you.
It's essential to put effort into maintaining relationships online. Working remotely means less interaction with your colleagues, and it's easy for multifaceted personalities to become a flattened disembodied persona online. Without the office 'vibe' and body language cues we often take for granted, it's easy to lose that personal connection.
Build depth by asking how your colleagues weekends were. Ask about their hobbies and pets. Work at keeping a connection with the person behind the computer.

In our team we have little sub-groups that focus on our hobbies. There's the running/workout club where we share our training plans and give each other virtual high-fives. I've actually found it easier to stick to a running plan knowing that my colleague is running too (and beating my times!).
If you only take one thing away from this, maintaining strong relationships with your team is key! If your team isn't keen on video calling, then make sure you voice call regularly. I can't stress how important it is to verbally talk to your colleagues. We start each call off with some light hearted chat and listening to the inflections in other's voices and have them laugh at your silly jokes recharges your soul.
Take advantage of technology
Apart from using Invision Community as a hub and company-wide information repository, there's a lot of apps you can use to make your work time more productive and avoid the constant distractions partners and children rattling about the house can cause.
I work from home and have two young children. School holidays can be challenging when the house comes alive during the day, and there's a constant stream of potential distractions.
I use "focus music" with noise-cancelling headphones when I want to knuckle down and write code or blog articles. Right now, my kids are at school, and I'm listening to Metallica at an unreasonable volume through my Homepod speaker. For some reason, loud metal music helps me concentrate.
There are only so many power chords you can take, and I've found Brain.fm to be very useful. Brain.fm uses "neural phase-locking" via music to help you focus. I have no idea what that means, but it does help me get into the zone on days where I struggle with productivity.
I have the attention span of an anxious squirrel. It can take me a long while to get into the zone and mere seconds to pop back out.
When I'm writing code, it's less of a problem. I just put on Brain.fm or some music, and I get lost in time and space as I build complex constructs in my mind before bringing it together in my code editor.
However, when I'm writing articles, helping support, hopping between tasks, or doing general administration work, I rely on a Pomodoro timer. The idea is that you work in sprints of 25 minutes, followed by a short break, usually 5 minutes. You repeat this cycle four times and take a longer break.
Many apps can track your time in this way, including web-based tools such as the amusingly named Tomato Timer.
Using this technique helps me get into the flow by giving me "permission" to take breaks but only once the work block has finished. I might pop out of focus and think about checking up on our community or Facebook and get back to work when I realize I've still got 12 minutes of work left.

Where I work. Can you guess my favourite TV show?
Work/life balance doesn't exist
You'll often hear people talk about their work/life balance. You are better off thinking in terms of work/life integration.
Now, I'm not suggesting that you work all day and night. I'm not one of those "sleep when you're dead" people. I like to sleep. I have a partner and two kids I want to enjoy and passions outside of my computer (although my guitars are gathering dust again).
The reality is that when your workstation is just a door away from the rest of your life, you're going to work outside of the traditional 9-5 routine despite how rigorous you may want to define a working day.
This might be because you took the morning off to watch your kid's school play or you may have booked a haircut during the day as it's much quieter. My advice would be to look for pockets of time that won't impact the rest of your family or free time. I tend to earmark an hour once the kids have gone to bed as potential "work overflow" time. This allows me to integrate my work schedule with my home schedule without it taking over my life.
Avoid Coffeeshops
Working with your laptop in a coffeeshop is a massive cliché. Every single time I've walked into Starbucks, there have been dozens of people at tables squinting at laptop screens.
It's an attractive idea. You get to mingle with fellow humans. You get a change of scenery and a decent cup of coffee.
You also get a constant source of distractions, poor quality and insecure Wi-Fi and sideways glances from staff who'd love to free up your table. 
Also, what do you do with your laptop when you need a restroom break? Do you take it with you? What if someone sits at your table while you're gone?
It's just not for me.

Jim's work area
Exercise and movement
I won't lecture you about health and fitness, but I do want to highlight one downside of having no commute and office building to move through: being super-sedentary.
If you used to clock up 10,000 steps walking to the train station, walking to your office and then clocking up steps as you moved between meeting rooms and social areas, then expect that number to drop sharply.
There are days where my Apple Watch tells me I've done less than 1500 steps during the day. To combat this, I make time during the day to go for a walk or to exercise. I'm fortunate that I have a treadmill in the garage along with some weight lifting equipment. If you don't have any equipment, then a short walk is better than nothing. As a bonus, you'll get some fresh air and vitamin D from the sun.
I also have a standing desk so that I can get on my feet during the day and an exercise bike I can use while working with the desk at its highest position.
Find ways to incorporate movement into your day for your own mental and physical health.
Conclusion
Despite the many challenges working remotely can cause and the learning curve of taking your work home, the vast majority prefer to work from home. In a study of 100 remote workers, only six said they'd return to the office if given a chance.
If you're new to working remotely, then there will be mistakes. There will be days when you feel that you've achieved very little and probably yearn for some human interaction and be told what to do next. It's all part of the process.
Keep lines of communication open, check in on your colleagues and embrace the freedom working remotely gives.

Notifications are a crucial feature in enticing members back to your community to read updates and post their replies.
It makes sense that there should be as little friction as possible when setting up notifications. We want to encourage members to enable notifications relevant to them.
The current notifications form in Invision Community is functional but overwhelming and confusing for new members.
Thankfully, we have simplified it to make it clear what notifications are available and which you have enabled currently.
This new settings page also includes support for our new mobile app and links to remove all email notifications.
Notification Emails
Notification emails are essential to re-engage a member. However, we found that when the email contained all of the post content return visits were not as frequent because the email provided all the information the member needed.
In Invision Community 4.5, we've added an option to truncate the content of the email to encourage curious return visits and to reduce the chance that a confused member will attempt to post a reply via the email!

What does the rest say?!
Download's Notifications
To receive notifications of new file updates it was previously necessary to follow files. This meant that you would also be notified of reviews and comments even if they were of no interest to you. From 4.5 we have added a separate button (send me version updates) so you have more control over the notifications you receive. 

Send me version updates
We've plenty of new features yet to announce for Invision Community 4.5, but improvements to common features make our lives a little easier and are just as welcome!

Are you looking forward to finally making sense of notification choices? Let us know below!

Invision Community has certainly changed a lot over the years as we've moved through major updates and large user interface changes. 
While large scale changes offer a dramatic difference, it is sometimes the smaller changes that bring the most satisfaction when using your community daily.
This blog entry rounds up some of the UI improvements Invision Community 4.5 brings.
Content View Behavior
What do you want to happen when you click a topic link? Are you taken to the first comment, the last comment or the first comment you've not read? If you speak to 100 people, I'm pretty sure you'll get a good spread of votes for each.
Invision Community has always offered subtle ways to get right to the first unread comment. Our infamous dot or star allows you to do this, but it is so subtle almost no one knows this.
Invision Community 4.5 now allows each member to choose (with the AdminCP offering a default).

Now everyone wins!
Who Reacted?
Invision Community has had reactions for a long while now. Although finding out who exactly reacted without clicking the counts has proved irksome.
We've fixed that in Invision Community so simply mousing over the reaction icon reveals who reacted.

Sign In Anonymously
For as long as I can remember, Invision Community has offered an option to sign in anonymously via a checkbox on the login form.
However, as we've added faster ways to log in via Facebook, Twitter, Google and more it's become less straight forward to ensure your anonymity.
Invision Community 4.5 removes this login preference and moves it to your members' settings.

Now your members can resume hiding as they move around your community across multiple logins.
Resize Before Uploading
One of the most popular requests we've had in recent times is to resize large images before uploading. It's quite likely that your giant full resolution image will be denied when attempting to upload, and it's a bit of a faff to resize it in a photo editor.
Invision Community leverages the uploader's ability to resize before uploading, which makes it a much happier experience.
Switch Off Automatic Language Detection
Invision Community attempts to map your browser's user-agent to a specific language pack.
When you visit a site, your browser lets the site know which language our browser is set to (often dictated by your operating system) and we use that to show you the correct language if the community you're visiting has multiple languages installed.
However, it might be that you don't want this to happen because although your computer's OS is set to a specific language, it doesn't always follow that is the one you wish to use on a website.
Invision Community 4.5 allows this automatic detection to be switched off.

Quote Collapse
We will finish with another popular feature request; the ability for long quotes to be collapsed, reducing the amount of scrolling one has to do.
Quite simply, Invision Community collapses long quotes with an option to expand them to read the entire quote.

Thank you to all our customers who have taken the time to leave feedback. As you can see, we do listen and action your feedback.
Which change are you looking forward to the most? Let us know below!

Ever since Invision Community 4.x was launched you have been asking for the ability to categorize blogs in your community.
We heard you loud and clear, but sometimes when a feature sounds straightforward, it requires some re-engineering of the framework. Because users in your community can create both blog entries and their own blogs to hold these entries, this was one of those areas.
Starting with Invision Community 4.5 I’m pleased to announce that it is now possible for blog authors to categorize their blog entries and it's now possible for administrators to categorize blogs.

Blog Entry Categories
When creating a new blog entry, your members will now be able to create a new category for the entry or choose an existing one that had been created previously.

Choosing your category when creating a new blog entry
When a reader then visits the blog they can choose to display only those categories that interest them.

Filtering by category
Blog Categories
Running a community where users can create their own blogs, you don’t only need to make sure individual pieces of content are categorized correctly, you also need to make sure the blogs themselves have a logical place. Well guess what? Now you can!
As an admin you can now set up predefined categories in the control panel and Blog authors can then choose which one to create their new blog in.

Managing blog categories
We realize some of you have been waiting a long time to see these changes so we hope you enjoy this and everything else to come in Invision Community 4.5!

Reminder: this blog covers the technical details of 4.0's programming. For details on 4.0's features, follow our main blog.

Reviewing controllers

Some time ago, I blogged about the javascript framework we've built for IPS4. In it, I covered the most important component: controllers. To recap, a controller is a special object within the framework, and is applied on specific elements. That element is the controller's scope, and the controller works on it to provide its functionality. For example, a simple controller might look like this:

ips.controller.register('core.global.core.example', { initialize: function () { this.on( 'click', this.showAlert ); }, showAlert: function (e) { alert( "This button's text is: " + this.scope.html() ); } });
It would be used on an element like so:

<button data-controller='core.global.core.example'>Click me</button>
Here we're registering core.global.core.example as a controller. This represents the controller path - it's in the format app.module.group.controllerName. Though it seems longwinded, this allows IPS4 to dynamically load controllers on-demand, rather than loading them all when the page is loaded. In the initialize method (called automatically), we set up an event handler for a click. When the element is clicked, you'd see an alert saying "This button's text is: Click me".

So, that's how controllers work. Almost all page behavior in IPS4 is handled through controllers. But how would you change a method in an existing controller, say if you were writing an addon, or if you had two controllers that were fairly similar, and wanted to provide a base controller they both shared?

Mixins

To enable that, we have mixins. Mixins allow you to specify functions which are inherited by objects - in this case, our controller objects. This means, using mixins we can add new functions to a controller without needing to edit the controller itself.

A mixin is defined like so:

ips.controller.mixin('addAnotherMethod', 'core.global.core.example', true, function () { this.anotherMethod = function () { alert('Inside anotherMethod'); }; });
The ips.controller.mixin method takes up to 4 parameters:

ips.controller.mixin( name, controller, automaticallyExtend, fnDefinition )
name: Name to identify this mixin
controller: The controller this mixin extends
automaticallyExtend: [optional, default false] Does this mixin automatically extend the controller (more on that below)
fnDetinition: The function definition applied to the controller

In this example, our mixin adds a method named anotherMethod to our core.global.core.example controller shown earlier.

Let's talk more about the automaticallyExtend parameter. Mixins can be applied to controllers in one of two ways - either automatically on a global basis, or manually on a case-by-case basis. Mixins are manually specified like so:

<button data-controller='core.global.core.example( addAnotherMethod )'>Click me</button>
This means the mixin is used on this element - but another element using core.global.core.example wouldn't get it. This is useful when you're building your own apps or addons; you can write simple controllers that implement base functionality, then extend them with functionality for specific cases by specifying the mixin name in your HTML. We use this ourselves - for example, we have a base table controller that handles sorting, filtering and so forth. We then have a mixin for AdminCP tables, and a mixin for front-end tables, which add functionality specific to those areas, reducing code duplication.

If you're extending an IPS controller in an IPS app, though, modifying the HTML isn't typically an option. Instead, you can specify the mixin as global, and it will be applied to all elements where that controller is used. This means you can write your own mixins that work with our default controllers without having to touch our controller code (and that's a good thing).

Advice

So that shows how to add new methods to a controller. But what if you want to work with the methods that already exist in the controller? In the above example you'd only be able to overwrite an existing method - certainly not ideal, because 1) you would break any other mixins using the default method, 2) if we made an update to a method in a later release, your mixin would break it.

To facilitate working with existing controller methods, we're using a model called advice. This adds three special methods to a mixin: before, after and around. These let you 'hook into' existing methods and provide additional code for them. Let's rewrite our example mixin from above to take advantage of it:

ips.controller.mixin('changeBackground', 'core.global.core.example', function () { this.before('showAlert', function () { this.scope.css({ background: 'red' }); }; });
Here, I'm using the before method. I'm hooking into showAlert method (from the controller), and changing the background color of the scope element. So what happens when the link is clicked? First the background changes to red, and then an alert box is shown. We've added the background changing functionality without needing to edit the controller at all. Here's two other ways of doing the same thing, using the other two special methods:

ips.controller.mixin('changeBackground', 'core.global.core.example', function () { this.after('showAlert', function () { this.scope.css({ background: 'red' }); }; this.around('showAlert', function (origFn) { this.scope.css({ background: 'red' }); origFn(); }; });
The after method is fairly self-evident. With the around method, the original function is passed in as an argument, allowing you to determine when it is executed by your mixin.

All three of these methods will stack, so multiple mixins can hook into the same method, and they'll be executed in order, each receiving the previous.

Conclusion

I hope this introduction to mixins proves useful to developers; it shows how our core app controllers can be extended in a non-destructive way, but also how your own apps can use the mixin functionality to create an inheritance model to make your life easier.

Javascript in IPS4 makes extensive use of custom events, so the preferred way of adding new functionality is to listen for appropriate events and act on them - but the mixin support described above provides a mechanism by which you can adapt existing event handlers.

Almost every single day, we receive feedback on our popular clubs feature. Some of the requests are big in scope, and some a little smaller.
Following on from our previous blog entry for Club Pages, we’re pleased to announce a collection of smaller, but no less useful improvements.
Improved Map Display

The Clubs location map better shows where local clubs are
A small but useful change to the clubs map means the view is now centered and zoomed around available clubs. Previously the map would show a world view even if all of the clubs were located in a concentrated geographical area.
Member Tab
A commitment to privacy always influences our development decisions, and this is true in clubs as well as other areas. It is now possible to set who can view the club member list on a per club basis. Clubs can be set to show the member list to everyone, only to club members or only to club leaders and moderators.

You can now decide who can see your club
Club Widgets
A common request for clubs is that widgets should be able to display content from within clubs. With 4.5, this is now possible and allows you to better bring attention to your club content from anywhere in your community.

Content widgets can now show club specific content
Some people wanted to control where widgets would show more finely. This wasn’t previously possible, but now it is. When adding widgets to a page, you can now set whether you want it to appear everywhere, everywhere except clubs, or only in clubs.
Join Requests
Club leaders can invite members who they believe will enjoy their content to join. Likewise, members can request to join a club that is not open for all to join instantly.
For a site with a lot of clubs, this could mean that you are invited to many clubs or find that your pending request goes unnoticed.

Your member can quickly manage their pending invites
Members can now cancel pending requests themselves quickly and easily from the Club homepage.
Clubs are becoming an increasingly popular part of Invision Community and really helps foster a sense of involvement.
We are always interested and surprised by the variety of ways this feature is being used. Let us know how you’re using clubs in the comments and keep the great suggestions coming!

Without a doubt, clubs is one of the most popular features added to Invision Community in recent times.
Invision Community clubs allows you to run sub-communities on your site. We've seen clubs used in many ways, including managing geographically local groups and clan groups for large gaming sites.
This popularity drives us to keep incrementally improving the feature set for clubs, and Invision Community 4.5 is no different.
One thing that was raised many times was a way for club owners and leaders to create simple pages with general information members need.
Happily, in Invision Community 4.5, this feature now exists (and more!)

In addition to the title and visual editor that allows full formatting of the page content, there is an additional visibility setting which allows owners and leaders to define which types of members can view the page.
This is perfect for showing a page that is only visible to non-members which informs them how to join the club.
Likewise, it is a great way to display moderation guidelines to the club moderators only.
Of course, owners and leaders will always be able to see all pages added to a club.

Additionally, once a page is added to a club, a tab will be added alongside others, and the page can be re-arranged just like the rest. 
Using this, owners and leaders can create an alternative unique index page for the club.
default-view.mp4
This is just one of many club improvements finished for Invision Community 4.5. We'll be talking about these in a future blog!

Collecting, curating and organising ideas and feedback is a critical part of managing a community for a product.
Even though here at Invision Community, we have a relaxed approach to ideation, we do read and review ideas and feature requests that come into us via our support community and via emails and tickets and organise them off-site.


If you wanted to add more rigour to your ideation process, then Invision Community has built-in tools that you can use.
This video covers setting up a "Question & Answer" forum, which forms the basis for your ideation section along with using the built-in translation tools to tweak the interface language.
The complete process takes around five minutes and is the perfect way to collect and organise community ideas.
Once you have it set up, your community members can post their ideas and fellow community members can upvote their favourite suggestions, leave comments on ideas and even upvote and downvote replies inside the idea.
Let me know what you thought, and if you have any further questions below!

Minor releases are almost always just maintenance releases. We gather up a fistful of bug reports and fix them to ensure that every month or so, our clients enjoy more stability and efficiency with Invision Community.
However, more recently we've noticed that we're running low on bug reports, so we've managed to squeeze in a handful of improvements in Invision Community 4.4.5.
Let's take a look and see what's new in Pages.
How should the canonical tag behave?
While this isn't the most exciting name for a feature, it does explain it reasonably well. We had a recent discussion on the forums where it was pointed out that the canonical tag directed search engines to the first page of any record. While this makes perfect sense for an articles or blog system where the content you create is more important than the comments, it makes less sense if the user-generated content (aka the comments) is more important than the content you put up. A good example here is where you put up a video or link for review. You don't want the canonical tag pointing to the first page as it will ignore the reviews themselves.

If you didn't understand much of that, don't worry. The idea behind this feature is to provide Google and friends with a better hint about which content is more important. A happier Google bot slurping your site is a good thing.
How about that Admin CP menu?
When you create a new database in Pages, it is shown in the ACP menu under 'Content'. This is fine, but when you get a lot of databases, it starts looking a little cluttered, and it can be hard to find the correct one.

We've reworked the menu so items have their own section, and can be re-ordered using the ACP menu re-ordering system.
Member fields are now filterable.
Pages allows specific field types to be filterable. This means you can sort by them with the table's advanced search box, and you can drag and drop a filters widget next to the table to refine the rows shown.
Now a member custom field is filterable, which is handy if you use them in your databases.
Other areas of the suite.
Messenger search
A while back, we made a change that removed the ability to search messenger by the sender or recipient name. We also limited the reach of the search system to one year and newer.

Unsurprisingly, this wasn't very popular. We've restored sender, and recipient name searching removed the one year limit and re-engineered the internals of search, so it's more efficient and returns results much faster.
How many members do you have?
You can see quite quickly if you have the member stats widget on the front end, but finding out via the Admin CP is a little more tricky. 

 
Until now! We've added a dashboard widget that not only shows the number of members you have registered, but also a break down of their email opt-in status.
A happier autocomplete.
Apple has this cool feature where if you receive a text message for a two-factor authentication login, it offers to auto-fill the code box for you.
We've had a sweep throughout the suite to ensure two-factor authentication fields allow this autocomplete to happen.
While we were at it, we made sure that other fields are more easily autocompleted.
That wraps up the new features in Invision Community 4.4.5. How many have you spotted after upgrading?
Let us know your favourite below.

Have you ever found yourself muttering "there has to be an easier way" when managing your community?
If you have, it's likely that you are not the first person to think that. Invision Community has been refined over nearly two decades, and in that time we've received a lot of feedback from clients running very large and busy sites.
We love a short cut, especially when it makes our clients lives easier.
There's plenty of time-saving features throughout Invision Community, and here are five of the best.
Saved Actions
If you routinely perform the same actions to a topic, such as replying before closing it or moving the topic to a different forum, then saved actions will save you a lot of time.
Let's look at a practical example. You have a forum where your members can suggest new features for your product. You might choose to move some of these suggestions to another forum to shortlist them for inclusion in a future version, or to discuss further. You also may like to reply thanking the member for their idea, but it's not feasible at this time.
Here you would set up two saved actions, one that replies and moves the topic to a specific forum, and one that replies to the topic and closes it for further commenting.

Your saved actions are accessible via the moderation menu
You and your moderating team can select these saved actions quickly when reading a topic to perform multiple moderation steps in one go.
RSS Feeds
If your community regularly discusses topics that feature in the latest news, then you can quickly seed these discussions using the RSS feed import tool.

Not only can you import almost any public RSS feed into your community, but you also have control over how these topics are displayed, to whom they are attributed to and how the link back to the source article looks.
RSS feed import is an often overlooked but handy tool at starting productive discussions without the need to source and post them manually.
iCal Feeds
The iCal feed can be considered as the sister feature to the RSS Feed Import tool. It works in a very similar way in that it can accept almost any public iCal feed and import events into your community's calendar.
This is especially useful if you maintain an event stream outside of the community, but wish to share those events with your members in a native way, or perhaps you already have a calendar product used by your organisation.
Using the iCal feed tool to populate your community calendar with key dates relevant to your community can be achieved very quickly.
Auto-moderation
Moderating a busy community can be a time-consuming task. Trying to review new posts and topics to ensure they meet your community standards as they come in can be daunting.
Fortunately, Invision Community has an ace up its sleeve.
Auto-moderation allows you to use the power of your community to identify and remove content that does not meet your community standards. The administrator sets up a threshold so that when a specific number of reports for that content item is crossed, the content is hidden.

Auto-moderation has a lot of options to configure which we covered in this blog article recently.
Group promotion
Ensuring your members feel valued and rewarded for their contributions is key to member retention and keeping engagement high.
A simple way to reward long term regular contributors is to elevate their permissions. This can mean that they have access to otherwise hidden areas, or they get more allowances in terms of upload space and fewer restrictions.
To do this manually would take a significant amount of time. Thankfully, Invision Community has a feature called Group Promotion.
This tool allows the administrator to set up specific thresholds such as post count, or time since joining which then move the member into a new group when triggered.
This all happens automatically. Just set it up and let it run!
We spoke about Group Promotion recently, take a look here to learn more about this feature.
How many of you are already using these features, and which ones did we miss off our list? I'd love to know.