Jump to content

JohnCourt

Clients
  • Posts

    559
  • Joined

  • Last visited

Reputation Activity

  1. Like
    JohnCourt reacted to Matt Finger for a blog entry, Invision Community 5: The all-new editor   
    Invision Community 5 has a brand new editing experience powered by a lightweight, fast React text editor built for mobile and modern browsers.
    The venerable CKEditor v4 at the core of our current editor is starting to show its age, so we wanted a clean slate with Invision Community v5 with an editor that was optimized for mobile use, easily extensible and had a feature set that would take us into the next era of Invision Community and beyond.
    The obvious choice was to consider the latest version of CKEditor, but it didn't fit our needs as it wasn't easily extensible, external plug-ins would no longer be possible, and its large footprint would affect page speed scores and be painful to use with a mobile connection.
    After a long search, we settled on Tiptap as the base for our editor. Written in React, loaded in chunks when needed for optimal performance and with many APIs and extensibility options, it was the perfect fit.

    Aside from the technical improvements, the editor offers new tools and a great base for writing our own plugins. I'll walk you through the main features throughout this blog. If you want a more technical deep dive, then please see my development blog.
    The Toolbar
    The toolbar has been redesigned to put the most commonly used styles first, with the least used styles and functions into an ellipses menu. The new paragraph menu contains the header styles, as well as the code block. The plus menu adds lists, boxes and quotes. The benefit of this new compact menu is that it displays just the same on mobile. Currently, there are different editor styles for desktops, tablets and mobiles with some style buttons removed to save space. With Invision Community 5, this is no longer the case. Even the smallest display gets all the functionality.
    mobile-toolbar.mp4
     
     
    Emojis & Icons
    Emojis have become a great way to embellish writing and express emotion. The new emoji picker has been modernized with larger emojis and tooltips to showcase the emoji shortcodes.
    The Icons tab, new for Invision Community 5, allows you to add Font Awesome Icons directly to your content.

    Lastly, both the emoji selector and the shortcode suggestion dropdown support arrow-key navigation, so you don't have to move your hands from the keyboard to the mouse.
    Content Boxes
    The feature I'm personally most excited about is boxes.
    The concept started as an abstraction of spoilers because sometimes you just want "a box" - a section that stands out from the rest of the content, something we do manually in our documentation and guides on this site. Each box has a tile and the following options:
    Expandable - You can mark a box as "expandable" which is functionally the same as a spoiler. One improvement is that expandable boxes use native HTML details and summary elements instead of plain Javascript animated divs. Colors - You can optionally keep it grey on grey like spoilers, but I think that's so boring! The colors automatically adjust to the theme colors, so it will look great in dark and light mode. Float (left/right/none) - You can make the box align to the left or right of other content just like you can for images Width - When the box is floated, you can set the width to big, medium or small. Boxes.mp4
    Link Expansion
    Invision Community has long expanded some links, such as YouTube, offering more context or even a mini-player where appropriate.
    With Invision Community 5, we've added support for embedding dynamic link previews using site metadata. This is a preview of a topic on our forum.

    For those unaware, the Open Graph (OG) Protocol is essentially a way webpages can specify a title, image, and description to be dynamically embedded on another platform. This is the underlying technology when you see the link preview in Meta, X, Slack, or iMessage.
    Code Blocks and Inline Code
    The new editor adds inline, syntax-highlighted code blocks and inline code. Both formats can be applied via the toolbar, or optionally, you can wrap text in a single backtick (`) to convert it to an inline code block or triple backticks (```) to convert it to a code block.

    The code blocks also support numerous languages for syntax highlighting, including a new custom highlighter for the Invision HTML Template Syntax (Invision Community theme creators and application developers, you're welcome!)
    Semantic Headings and Relative Sizes
    Invision Community 5 adds a block selector with headings 1 through 6 in the new editor. It's possibly the most common request I hear so that people can use consistent styling rather than just big bold text in a paragraph tag. Semantic headings are also ideal for SEO and accessibility.
    In addition to the block selector, you can create headings with the corresponding markdown shortcut. Consecutive pound signs (#) at the start of a line followed by a space (the number of pounds corresponds to the "level" of the heading). For example ### creates a Heading 3 (<h3/>) creates the heading for you.
    Using clear header tags means screen readers and search engines can better understand your content as using absolute font sizes, such as 16px, can make it unclear what type of element is actually being used. Is it a heading or just a paragraph with large bold text?
    Furthermore, you may want different sizes depending on the content and device type. Mobile devices may benefit from a large base font size. So we added percent-based font sizes which change the font size based on whatever the default would be for that block.
    text-menus.mp4
    Further UX Improvements
    The new editor in Invision Community 5 has several tangible improvements, including a mobile-first design.
    In the current editor, some functionality was hidden behind modals and double clicks, which are either not obvious on mobile devices or not possible at all. The new editor no longer relies on modals and instead uses buttons and dropdown menus that work perfectly with mobile and other touch-based devices.
    New Line Arrows
    For block content, such as boxes, images and quotes, we've added the ability to create a new line before or after the block with the click of a button. This was an issue of frustration for mobile and touch devices where it was not always clear where the cursor was and a finger is a much less accurate aiming device!

    Sticky Toolbar
    Anyone who has authored a long piece of content knows the pain of scrolling up and down to get the toolbar in view. To make writing longer content less stressful, we've made the toolbar sticky so that it will always be fixed at the top of the editor after scrolling down.
    sticky-toolbar.mp4
    Markdown Style Shortcuts
    One common request is to support markdown in the editor. While we opted not to include full markdown support, the new editor recognizes many markdown-style formatting shortcuts.
    markdown.mp4
    Colors
    A common challenge with rich text editors on sites with multiple themes is colors often need to consistently look right across all themes. This is even more important with Invision Community 5, as it has a native dark mode feature. For this reason, we opted to offer a reduced set of color options that all adapt dynamically to the theme. I mentioned this about box colors above, but this is also true of the font color. The difference in shade is slight, but it's very noticeable without it. Toggling between light and dark mode will never produce unreadable text.
    colors.mp4
    We can't wait for you to try the new editor; it has already been very popular with our small testing group. Which feature are you most looking forward to trying?
  2. Thanks
    JohnCourt reacted to Charles for a blog entry, Invision Community 4.3   
    We are happy to announce the new Invision Community 4.3 is available!
    Some highlights in Invision Community 4.3 include...
    Improved Search
    We now support Elasticsearch for scalable and accurate searching that MySQL alone cannot provided. There are also enhancements to the overall search interfaces based on your feedback.

     
    Emoji
    Express yourself with native emoji support in all editors. You can also keep your custom emoticons as you have now.

     
    Member Management
    The AdminCP interface to manage your members is all new allowing you easier control and management of your membership.

     
    Automatic Community Moderation
    You as the administrator set up rules to define how many unique member reports a piece of content needs to receive before it's automatically hidden from view and moderators notified.

     
    Clubs
    The new Clubs feature has been a huge hit with Invision Community users and we are expanding it to include invite-only options, notifications, exposure on the main community pages, paid memberships, and more.
    Custom Email Footers
    Your community generates a lot of email and you can now include dynamic content in the footer to help drive engagement and content discovery. 
    New Gallery Interface
    We have reworked our Gallery system with a simplified upload process and more streamlined image viewing.
     
    The full list follows. Enjoy!
    Content Discovery
    We now support Elasticsearch which is a search utility that allows for much faster and more reliable searching. The REST API now supports search functions. Both MySQL and Elasticsearch have new settings for the admin to use to set search-defaults and default content weighting to better customize search logic to your community. Visitors can now search for Content Pages and Commerce Products. When entering a search term, members now see a more clear interface so they know what areas they are searching in and the method of search. Member Engagement
    Commerce can now send a customizable account welcome email after checkout. You can whitelist emails in the spam service to stop false-positives. REST API has many enhancements to mange members. Ability to join any OAuth service for login management. Invision Community can now be an OAuth endpoint. Wordpress OAuth login method built in. Support for Google's Invisible ReCaptcha. Groups can be excluded from Leaderboard (such as admins or bot groups). All emails generated by Invision Community can now contain admin-defined extra promotional text in the footer such as Our Picks, and Social Links. Admins can now define the order of Complete Your Profile to better control user experience. Clubs
    Option to make a Club visible but invite-only Admins can set an option so any Club a member is part of will also show in the parent application. So if you are in a Club that has a Gallery tab then those image will show both in the Club and in the main Gallery section of the community. Club members can now follow an entire Club rather than just each content section. There is a new option on the Club directory page for a list view which is useful for communities with many Clubs. If you have Commerce you can now enable paid memberships to Clubs. Admins can set limits on number of Clubs per group. If a group has delete permission in their Club, they can now delete empty containers as well. Members can ignore invitations. Moderation and Administration
    Unrestricted moderator or administrator permission sets in the AdminCP are visually flagged. This prevents administrator confusion when they cannot do something as they will be able to quickly see if their account has restrictions. You can choose to be notified with a new Club is created. Moderators can now reply to any content item with a hidden reply. Download screenshot/watermarks can now be rebuilt if you change settings. Support for Facebook Pixel to easily track visitors. Moderators can now delete Gallery albums. Automatic moderation tools with rules to define when content should auto-hide based on user reports. Totally new member management view in AdminCP. More areas are mass-selectable like comments and AdminCP functions for easier management. New Features
    Commerce now has full Stripe support including fraud tools, Apple Pay, and other Stripe features. Commerce packages can now have various custom email events configured (expiring soon, purchased, expired). Full Emojii support in the editor. Complete overhaul of the Gallery upload and image views. Announcements system overhaul. Now global on all pages (not via widget) and new modes including dismissible announcements and top-header floating bar option. Many new reports on traffic and engagement in the AdminCP. Blog has new view modes to offer options for a traditional site blog or a community multi-member blog platform. The content-starter can now leave one reply to Reviews on their item. Commerce now makes it much easier to do basic account-subscriptions when there is no product attached. Useful Improvements
    Forums has a new widget where you can filter by tags. If tags are not required, the tag input box now indicates this so the member knows they do not have to put in tags. Member cover photos can now be clicked to see the full image. Any item with a poll now has a symbol on the list view. Twitch.tv embed support. You can now update/overwrite media in the Pages Media Manager. Mapbox as an additional map provider to Google Maps. Technical Changes
    Direct support for Sparkpost has been removed. Anyone currently using Sparkpost will automatically have their settings converted to the Sparkpost SMTP mode so your email will still work. Your cache engines (like Redis) will be checked on upgrade and in the support tool to ensure they are reachable. Third-party applications will now be visually labeled to distinguish them from Invision Community official applications. The queued tasks list in the AdminCP is now collapsed by default as queued tasks are not something people need to pay much attention to during normal operations. When upgrading from version 3 series you must convert your database to UTF8 and the system saves your original data in tables prefixed with orig. The AdminCP now alerts you these are still present and allows you to remove them to reclaim storage space. On new installs there are now reasonable defaults for upload limits to keep people from eating up storage space. Categories in all apps (forums, gallery albums, databases, etc.) no longer allow HTML in their titles. This has been a concern both in terms of security and usability so we were forced to restrict it. Large improvements to the Redis cache engine including use for sessions. The login with HTTPS option has been removed and those who were using it will be given instructions to convert their entire community to HTTPS. Images loaded through the proxy system now honor image limits for normal uploads. We now consider BBCode deprecated. We are not removing support but will not fix any future issues that may come up.
     
    There's a lot to talk about here so we are going to lock this entry to comments so things do not get confusing. Feel free to comment on upcoming feature-specific entries or start a topic in our Feedback forum.
     
  3. Like
    JohnCourt reacted to Charles for a blog entry, Coming Soon in 4.1.16   
    IPS Community Suite 4.1.16 is nearing the end of development so I wanted to go over some of the new features in this upcoming release. Some are big and some are small but we always enjoy making any sort of enhancements to the Suite.
    We expect 4.1.16 to go to public beta next week. If you are interested in using a public beta please check out our beta forum (clients only) with more info. We welcome as much testing as possible and our betas are considered safe to use on a live site. We do offer support for betas so, if you are technically minded, consider giving them a try.
    Commerce: New Ticket Listing
    We have redesigned the ticket listing view in Commerce to be much more user friendly and better use screen space. You can also now group by department which is great for organization.

     
    Much like Activity Streams on the front end you can create custom views for tickets based on how you work.

    The new My History view allows staff to quickly see their latest replies and actions along with some basic stats.

    There are many other smaller improvement in Commerce in 4.1.16 as well. We think you will enjoy all the updates.
    Security Questions
    To enhance the security of your member accounts we now have a new security questions feature where you can allow your members to put in their own, personal security questions. The member will then be prompted to answer those questions for account actions you define.

    Account Change Emails
    Members will now receive confirmation emails when they change their email address...

    and their password...

    Topics per Page
    You can now define the number of topics per page in forum view.

    Remove all Followers
    Moderators can now remove all followers from any item that allows follows. This is useful if you are archiving an old item or otherwise do not want people getting notified of new activity on an item.

    Automatic Following
    Your members can already choose to automatically follow content they start or reply to but now you can define this as the default behavior for all members. Your members can of course override this to their own preference.

    Embed Failure Message
    To answer the constant question "why didn't my media embed?" we now show you why. Regular members will just see a message indicating the Suite tried to embed but was not able to. Admins will get more information on what failed.

    Suspended Member Page
    When you banned/suspended a member previously they simply saw a generic permission denied message. We now show a more friendly page saying they were suspended and why.

    The member can click to get the full information from the Warning System as well.

    Contact Us
    The contact us page now has configuration options to control where messages are sent. You can do email and even Commerce support departments now.

    Announcements
    Global announcements can now be restricted by member group.

    And some technical stuff...
    In addition to the new feature additions we have also fixed dozens of issues reported by clients. There was a particular focus on Commerce, Pages, and IPS Connect. Some other items of note:
    Performance improvements in: profile view, sitemap generator, posting replies, and Activity Streams We now try to more reliably detect the AWS S3 endpoint for those using S3 file storage Tasks view will now show the last time a task ran More efficient license key checking to keep the keys from being checked too often which can slow your site down If group promotion based on date is enable the system will now auto-promote even if a member does not login If you move your site to a new URL you no longer have to update a constant if using the image proxy You can now press ctrl/cmd+enter in any editor window to submit the reply (yay!) In Commerce ticket view there are keyboard shortcuts to perform common actions (such as press 'r' to open reply box or 'n' for note) There is now logic to prevent double-posting when the initial post encounters an error on submit If your datastore (cache system) is not working properly the AdminCP will now show you a warning telling you that it needs attention.    
×
×
  • Create New...