Use Slack with WordPress and Woffice to boost your productivity

Today, we will discuss here how we can use the well known application Slack along with WordPress and the Woffice theme. Slack has over 5.8 million active users and powers communication in more than 60 000 teams around the world (source). Yet, we won’t go through all Slack’s milestones here. Just to say it’s a very used tool and it provides a very good way to get rid of emails. Certainly why everyone love it!
Furthermore, the biggest advantage of Slack is the ability to add 3rd-party applications in order to stay tuned about pretty much any application related to your business. Over 150 integrations actually on their apps directory, all for free.
So, what about we receive live notifications from our WordPress intranet/extranet right into our Slack channels? Sounds cool. Well, we’ve done it with Woffice and I will show you how to set it up in 5 minutes.

How to set it up?

We assume, you have WordPress set up on your side with the Woffice theme installed. That’s all you need, with a Slack account, of course.
First, we have to activate the Woffice Slack extension from Woffice (or Unyson page) > Extensions:

Secondly, we need to create our own Slack app in order to create a connection between your WordPress Intranet and your Slack team account. For this, you have to click the “Settings” link to go on the extension’s settings page. You can see now a “Create a new application” link that will lead you to the right place.
Click on “Create New App” and fill in the form, everything can be changed later. You should see:
 

Then, once you application created, you’ll get a client ID and a client Secret. You need to copy/past those two fields in the extension’s settings back on Woffice:

Last but not least, you need to copy/past the Call Back URL from the Woffice extension’s settings to the Slack > OAuth & Permissions > Redirect URL input field:

You can add your own icon to your Slack boat.
Don’t forget to save everything. At this point we have a new application on Slack, which is a good start!
Thirdly, we need to assign our notifications to a Slack channel trough our brand new application. We can do that by going to the “Slack Notifications” tab on the extension’s settings page.
Thus, we can see a pretty sweet “Add to Slack” button, well we can click on it so we can choose on which channel will the notifications be published. Once this button clicked, you need to Authorize access to one your Slack team. Then, you can select a channel from the “Post to” option. See:
You can now choose the triggers that will push notifications from WordPress to your Slack channel.
We’re ready to go! Whenever an action (that you’ve enabled on the above form) is triggered on your Intranet, it’ll be sent in real time on your Slack channel. So you can keep all your data in one place, saving time and improving your team communication.
Note that we’ve added 5 triggers so far, but we’ll add more in the coming updates. Just let us know your thoughts if you have any idea.
The available triggers (Woffice 2.2.0) are whenever a new:

• Comment is posted
• User is registered (or added by an administrator)
• BuddyPress activity (only if the activity is public)
• Post (whether it is a blog post, page, project, wiki, product, directory item…)
• Task on a project

Going one step further and create your own notification

The best part is that once the Slack extension enabled on your site and working. Woffice comes with a helper function to manage all the dirty API code for you. One single function to use anywhere in your Intranet/Extranet to post sweet Slack notifications that you can customize in a matter of minutes.
However, we assume here that you’ve PHP skills (you don’t need to be an expert here).
The function is defined in woffice/framework-customizations/extensions/woffice-slack/helpers.php and can be used like this:

// Our notification data:
$notification = array(
    'title' => 'Hey I\'m the title',
    'title_link' => 'Link to your site or any page', // like: get_site_url()
    'pretext' => 'Just above the title',
    'text' => 'Text content',
);
// Let's send our notification to our Slack channel
woffice_slack_send_notification($notification)

Although, if you try that PHP code in your child theme, it’ll work right out of the box but there are 2 important points:

1. Slack API is rich! The $notification array will be passed as a Slack attachment, see their documentation for all details. So you can add images, author name, icons, buttons…
2. You must call woffice_slack_send_notification under an add_action() callback function (see next example). So your notification is triggered on a certain event and not whenever you page is loaded.

Developer example: Contact Form 7 Slack integration

Finally, we’ll see now an example with the Contact Form 7 plugin. We’re using the default contact form but you can adapt with your own settings.

/**
 * Trigger a notification whenever an email is being sent
 * through a Contact Form 7 form
 * Note that :mail: & :bust_in_silhouette: are Emojies used by Slack
 * @param $contact_form : WPCF7_ContactForm
 */
function woffice_slack_hook_cf7($contact_form) {
    // We get the form title:
    $title = $contact_form->title();
    // We get the current submission
    $submission = WPCF7_Submission::get_instance();
    if ( $submission ) {
        // We get the submission data:
        $posted_data = $submission->get_posted_data();
        // We build our notification array:
        $notification = array(
            'title' => $posted_data['your-subject'],
            'title_link' => get_admin_url(),
            'pretext' => ':mail: ' . __('New form submission on', 'woffice') . ' ' . $title,
            'text' => $posted_data['your-message'],
            'fields' => array(
                array(
                    'title' => ':bust_in_silhouette: ' . __('Sent by', 'woffice'),
                    'value' => $posted_data['your-email'],
                    'short' => true
                )
            )
        );
        // We push the notification to Slack
        woffice_slack_send_notification($notification);
    }
}
add_action('wpcf7_mail_sent', 'woffice_slack_hook_cf7');

It’s just an example, you can do that with your favourite plugins, as long as they’re well documented. Building your custom notifications will be very easy.
We’re really looking forward to add more integrations, let us know your ideas.