o2

o2 is a WordPress plugin that facilitates both synchronous and asynchronous communication within a group of people. Instead of requiring a page refresh, new posts and comments from other users are automatically updated via server polling, and everything (including comments) is presented on the homepage/stream.

Breathe

Breathe is an o2-compatible theme based on _s.

Current Features

  • Front-side Editor – o2 features a front-side editor for both posts and comments. You can create a new post or edit an existing post without ever leaving the page you’re viewing. To add a new post, just start typing in the front-side posting box (at the top of your home page) and click on “Post”. To edit an existing post, click on the post actions menu (top-right of each post) and then click ‘Edit’, make your edits, then click ‘Save’.
  • Live Commenting – Reply to posts right there in the page. To reply to a post or a comment, click on the reply icon/link which appears at the end of each post or comment. You can drag-and-drop images into your comments, and make use of one-line media embeds (more on both below). Comments are also editable from the front-end, just like posts.
  • Live Updating – New posts and comments will appear automatically in your page when they are published. When a new post or comment is added to your site, it will appear in the page you are viewing without requiring a browser refresh. This helps you stay on top of current events without needing to constantly reload your site.
    • In-page Notifications – Our notifications tab in the lower right-hand corner of your browser will keep you up to date on newly arrived posts and comments within the current view. Clicking on a link in a notification will take you to the new comment/post and clear that notification. If you just need a clean slate, click on “Clear All”.
  • Infinite Scroll – Jetpack’s Infinite Scroll is automatically enabled in o2; there’s no need to click to see older posts. Instead, scroll on any home or archive page.
  • To-Do Posts – You can assign posts a resolution status, like “To Do” or “Done”, and sort posts by this status. Just click the button at the bottom of a post to cycle through the options (must be enabled via the Customizer first).
  • Sticky Posts – Stick important posts to the top of the post stream by clicking ‘Stick post to home’ in the post actions menu (top right of each post). When it is time to unstick a post, simply open the menu and click ‘Unstick post from home’, and the post will return to its regular position in the flow of posts.
  • Instant Follow – Click on the follow icon at the end of a post to subscribe to all comments on that post via email.
  • Widgets – o2 has some specialized Widgets to help you customize your site.
    • Live Comments/Posts – Update live when a new comment or post is added to the site.
    • To-Do Posts – Easily see which posts are task-based and need something done.
    • Filter Widget – Link to special site views to see your @mentions, posts you have written, posts with no replies, and to-do posts.

Customizer

Breathe and o2 both integrate with the Customizer to allow you to make some changes to how things look and work. To get to the Customizer, hover over the blog-menu (top left) for your site, then click “Customize”. Your site will reload with a right-hand sidebar that gives you some customization tools.

Screen Shot 2013-12-20 at 9.43.29 AM

  • Colors – Change your background, header and link colors. Use the top section to pick from a few of our favorite palettes, or use the bottom section to mix your own colors.
  • Menus – Pick which menu will be displayed across the top of your site. You can set up a menu with links to anything you like from Appearance > Menus within your Dashboard
  • Front – You’ll want to set this to ‘Your latest posts’
  • Site Title – Set your site title and tagline (they’ll appear at the top/in your sidebar)
  • o2 – You’ll find a few o2-specific options here.
    • Front Side Post Prompt: this is what will appear above the posting box on the homepage of your site (for people who can post). If you put {name} in there, it’ll be replaced with their name when they see it.
    • Enable Resolved Posts: This feature allows you to flag a post as “unresolved” or “needs attention”. You’ll see a small flag in the top-right of each post once this is enabled. Clicking the flag cycles through Unresolved, Resolved, Normal.
    • Mark New Posts Unresolved: If you have a very ‘transactional’ site, then sometimes it makes sense to make all new posts as Unresolved automatically. Once you’ve handled them, you can click the flag and mark them Resolved.
  • Header – You can select an image from your Media Library (or upload a new one) and then crop it to be used as a header image. It’ll be displayed at the top of your sidebar (if you have widgets configured), or across the top of your whole site if you’re not using your sidebar.

Editor/Editing Tips

  • Toolbar – While editing a post or comment, the toolbar appears at the top of the editor and provides quick access to frequently used text formatting and HTML tags. For longer posts, the toolbar automatically scrolls down to stay in view so you don’t have to scroll back up to use it.
  • Bold – surrounds the selected text, if any with strong tags
  • Italics – surrounds the selected text, if any with em tags
  • Link – surrounds the selected text with an anchor tag, and places the cursor inside the href attribute
  • Image – inserts an image tag, ready for editing (see also Drag and Drop below)
  • Blockquote – surrounds the selected text, if any with blockquote tags
  • Code – surrounds the selected text, if any with code tags. If you are in the middle of a line, then an inline code block will be created. If you’re at the start of a line, then a larger code block will be inserted.
  • Adding a title – o2 will automatically generate titles for you from your post, but if you prefer, you can click on the Add a Post Title icon at the top right of the editor to show a field where you can enter a title explicitly. Some special characters prevent auto-titles, so you can use the manual title entry if you’d like to hand-craft a title for your post.
  • Fullscreen – prefer to edit distraction free? While editing a post or comment, click on the Fullscreen icon next to the Preview tab to switch to fullscreen mode.
  • Drag and Drop – have an image on your computer to share? Just drag and drop it:

  • Inline Tagging – tag as you type. When editing a post, press # and then start typing a tag. Tag suggestions will appear based on tags you’ve already used, or just #continue to create a new tag.
  • Mentions – get the attention of other users on your o2. When editing a post or comment, press @ and then start typing their username. Username suggestions will appear automatically as you type. Select one and hit enter or tab (or click it) to insert it into your post or comment. The user you mention will get an email and a toolbar notification once you publish.
  • Pasting Links – have a link in your clipboard? Highlight any text and hit paste. The highlighted text will automatically be turned into a link.

  • Time shortcode – If you’d like to include a time in your posts/comments which is localized for the viewer, then you can post a fully-formatted UTC/GMT time, and wrap it in the [time] shortcode. When someone else views it, the time will be localized based on their selected timezone.
  • Bulleted and Numbered Lists – create a list quickly and easily by starting each line with – or * for a bulleted list, or # for a numbered list. Note that if you enable Markdown support (Settings > Writing), then you’ll need to use the Markdown format of “1.” instead of “#” for numbered lists, and will need to separate a list with a leading empty line.

  • Checklists – create a simple to-do list by starting each line with an o (lower case O), a space, and then some text. When saved, it transforms into a to-do list. You can also use an x (lower case X) at the beginning of a line to mark it as checked off. Once you’ve created a list, checking an item off will automatically add your name to the end of that time. Clicking the text of an item will give you some more options, and you can drag/drop to re-order items.

  • Blockquotes – quickly quote text from a post or comment by highlighting it first, and then hitting the reply button to create a new comment. The highlighted text will automatically be blockquoted in the editor for you. Starting a line with “> ” (greater than sign, space) will also blockquote that line.

Other Useful Features on WordPress.com

  • Markdown – Enabling Markdown (Settings > Writing) allows you to enter your posts and comments in natural text with easy-to-use tools for formatting. Your text is then converted to valid XHTML in your published post/comment.
  • Email Integration
    • Follow – You can follow a site in order to receive email notifications for all posts (and comments, if you like) on that site.
    • Posts – You can follow individual posts to get email notifications for new comments. Just click the Follow icon at the top right of the post. By default you’ll also receive notifications for replies to your own posts and comments.
    • Posting – If you enable Post By Email, you can create new posts by emailing a special address.
    • Reply (comment) – You can reply directly to the notification emails you get for a post or comment to create a reply comment.
  • One-line Embeds – You can quickly embed content from other sites such as Youtube, Google+, Twitter, and more by pasting in the direct URL for the content. Instead of displaying as a link, the content is directly embedded into your post, page, or comment. Supported one-line embeds include:

More Questions?

Drop us a line and we’ll be happy to help.