Juniper Websites: Working with Bluesky Blocks

Juniper Websites

Overview

A Bluesky block shows posts from your school's Bluesky account on a page of your website. It's a great way to keep parents and visitors up to date with your latest news, without adding the same content twice.

This guide explains how to add a Bluesky block to a page, choose its settings, and edit, move, or remove it.

Before you start

You need the name of your school's Bluesky account, for example, username.bsky.social. You can find this on your Bluesky profile.

A Bluesky block only shows posts on your website. To share your website content to Bluesky, see Juniper Websites: How do I link Juniper Websites to my school's Bluesky to share content?

Add a Bluesky block

Follow these steps to add a Bluesky block to a page:

  1. Open the webpage you want to edit.
  2. Select the content area where you want to add the Bluesky block.
  3. Select the Edit tab.

  4. Select the Blocks icon:

    The Blocks icon on the Edit tab

  5. Select the Social media tab:

    The Social media tab in the blocks list

  6. Select Bluesky. Bluesky Block appears:

    The Bluesky option on the Social media tab
  7. Enter your settings. See Choose your block settings.

Choose your block settings

Follow these steps to choose the settings for your Bluesky block:

  1. In Bluesky Block, enter your Bluesky account name in Source, for example, username.bsky.social:

    The Bluesky Block window

  2. Choose any optional settings. Use the table below to help you.
  3. Select OK.

Use this table to help you:

Setting What it does
Include Title Check to show a title above the feed, then enter the Title. Uncheck if you don't want a title.
Source The Bluesky account the posts come from. You must enter this.
Template Changes how the posts look on your page.
Limit The number of posts to show. The default is 5. Increase this to show more posts.
Sort Order The order of your posts. Select Name A-Z, Name Z-A, Date Newest First, or Date Oldest First.

Choose Date Newest First so visitors always see your latest posts at the top.

Save your changes

Follow these steps after you add or change your Bluesky block:

  1. Check the Bluesky block in the content area:

    A Bluesky feed on a webpage
  2. Select Save to save your changes. For more help, see Juniper Websites: What do the different save options mean?

The block shows your Bluesky posts, including images, and controls so visitors can move through the feed. New posts appear on your website automatically.

Edit a Bluesky block

Follow these steps to change the settings for a Bluesky block you've already added:

  1. Open the webpage with the Bluesky block you want to change.
  2. Double-click the Bluesky block in the content area. Bluesky Block appears.
  3. Update your settings. See Choose your block settings.
  4. Select OK.
  5. Select Save.

Move a Bluesky block

Follow these steps to move a Bluesky block to a different place on your page:

  1. Open the webpage with the Bluesky block you want to move.
  2. Drag the Bluesky block to its new position in the content area.
  3. Select Save.

Remove a Bluesky block

Follow these steps to remove a Bluesky block from a page:

  1. Open the webpage with the Bluesky block you want to remove.
  2. Select the Bluesky block in the content area.
  3. Press DELETE on your keyboard.
  4. Select Save.

Removing the block only removes the feed from your page. It doesn't change anything on your Bluesky account.

Tips and best practices

  1. Check that your Bluesky account name is spelt correctly in Source. If the feed doesn't appear, this is the first thing to check.
  2. Keep the Limit low on busy pages, so the feed doesn't push other content too far down.
  3. Add a title, for example, "Our latest news", so visitors know what the feed is.
  4. Remember that everything you post on Bluesky can appear on your website.

Next steps

Check how your Bluesky feed looks on different devices. See Juniper Websites: How do I see what my website looks like on different devices?

Updated