How to Embed Slack Feed on Website?

Add a Slack Feed

To Add a Slack feed, you need to follow the given steps.

Step 1:

Sign-up or Login to Taggbox account, You will see your Dashboard and click the “+Create Wall” button to create a new wall.

Taggbox Dashboard

Step 2:

Then, give a name to your wall. A Unique URL of your wall will be created automatically according to your wall name. You can also change it according to you.

To enable Profanity Filter select Apply Profanity Filter. Then, click “Create Wall“.

embed Slack

Step 3:

1. Click Feeds (You will find it on the left-hand side of the page).

Wall Editor Feeds

2. Click Add Feed, to create a new feed.

Feeds Option

Step 4:

In the popup that appears, select the Slack connection type from the top tabs and then fill out the required fields.

select slack feed

Step 5:

Click on connect slack and complete the login process.

Great, the Connection has been created and within a few moments posts will appear in the Wall editor.

Embed Slack Feed on Website

To embed Slack feed on your website you need to follow below steps

Step 1:

Click on Display Button on your wall editor.

embed Slack

Step 2:

Select the “Embed in Websites” option to embed Slack feed on Website.

Display Options

Step 3:

Select Your Website Platform (Eg: HTML, WordPress, Wix etc.)

Choose embed platform

Embed on HTML Website

Step 1:

To embed your Slack feed on HTML website, choose HTML as your platform

embed Slack on HTML

Step 2:

Set width, height and height type as per your requirements.

HTML height

Step 3:

Click on Get Code and copy the generated code and paste it into your webpage, where you want to embed Slack feeds.

Get Code

Embed on WordPress Website

Step 1:

To embed your Slack feed on the WordPress website, choose WordPress as your platform.

Choose embed platform WordPress

Step 2:

Set width and height as per your requirements and click on Get Code

WordPress code height

Here’s How You Embed Slack feed On WordPress 5.0 Website

Step 3:

Open the page/post in your WordPress backend where you want to embed the Slack feeds.

embed Slack on wordpress

Step 4:

Select “(+) Add Block” in the top left corner of the WordPress Editor.

embed Slack on wordpress website

Step 5:

Here, click on Formatting and then choose Custom HTML and paste the copied embed code in the editor.

Facebook Feeds on wordpress

Step 6:

Click on Publish/Update post and You’re done.

Embed on WIX Website

Step 1:

To embed your Slack social wall on the Wix website, choose Wix as your platform.

Choose embed platform Wix

Now follow these steps –

Step 2:

Open your WIX Editor and Navigate to the Page Where you want to Embed Taggbox.

Step 3:

Click on “+ Add” Button.

embed Slack feed on WIX website

Step 4:

Click on More and Select Embed a Site.

Embed Slack on wix

Step 5:

Check the “Website Address” under Mode.

Slack feed code for wix

Step 6:

Copy and paste the generated URL into the ” Website Address ” field.

Embed on Squarespace Website

Step 1:

To embed your Slack feed on Squarespace website, choose Squarespace as your platform.

Choose embed platform Squarespace

Step 2:

Set width and height as per your requirements. Click on Get Code

Squarespace Height code

Now follow these steps-

Step 3:

Generate the Website Embed code from the Taggbox code generator from the left and copy the Code.

Step 4:

On Squarespace Navigate to the page where you want to embed social wall.

Step 5:

Click on Edit.

Embed Slack Feed on Squarespace

Step 6:

Click on +Add/Edit Block.

Slack Feed on squarespace website

Step 7:

Select Code.

Slack Feed

Step 8:

Paste the Copied code and Click on Apply.

Embed Slack

Step 9:

Save the page to apply the Changes.

Embed on Weebly Website

Step 1:

To embed your Slack social wall on the Weebly website, choose Weebly as your platform.

Choose embed platform Weebly

Step 2:

Set width and height as per your requirements. Click on Get Code.

Slack Feed on Weebly

Now follow these steps:

Step 3:

Generate the Website Embed code from the Taggbox code generator from the left and copy the Code.

Step 4:

On Weebly Navigate to the page where you want to embed social wall.

Step 5:

In the left navigation bar click on “Embed Code” and Drop it on the position where you want to display the wall.

Embed Slack on weebly

Step 6:

Click on edit custom HTML and paste the copied code into the Container.

Slack feed on weebly website

Step 7:

Publish your changes.

Embed on Shopify Website

Step 1:

To embed your Slack wall on the Shopify website, choose Shopify as your platform.

Choose embed platform Shopify

Step 2:

Set width and height as per your requirements. Click on Get Code. 

Shopify get code

Default Pages

Follow these steps for Default Pages:

Step 1: Generate and Copy the Web Embed Code from Taggbox Code Generator.

Step 2: Login your Shopify store and navigate to Online Store-> Themes Menu in the sidebar.

Step 3: Click on the Customize button.

Step 4: Then Navigate to the left side of the page and click on Custom Content.

Step 5: Then click on Custom HTML and paste the Copied code and Click on Save.

New Pages

Follow these steps for new pages:

Step-1. Generate and Copy the Web Embed Code from Taggbox Code Generator.

Step-2. Log in your Shopify store and Navigate to Online Store->Pages menu in the sidebar.

Step-3. Click on Add Page. 

Step-4. Select Show HTML (<>) option of Text Editor.

Step-5. Paste the Copied code and Click on Save.

Blog Posts

Follow these steps for Blog Posts:

Step-1. Generate and Copy the Web Embed Code from Taggbox Code Generator.

Step-2. Log in your Shopify store and Navigate to Online Store->Blog posts menu in the sidebar.

Step-3. Click on Add/Create Blog post on the Top right of the page.

Step-4. Select Show HTML (<>) option of Text Editor.

Step-5. Paste the Copied code and Click on Save.

If you have any questions or need help, please Contact us or write us at [email protected]