> For the complete documentation index, see [llms.txt](https://support.functionjunctionapp.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://support.functionjunctionapp.com/creating-and-publishing.md).

# Creating and publishing

There are two parts to setting up a function on your store:

1. **Creating the function**: You create the conditions required for each function to work. You can find specific function setup instructions in the **Templates** and **Function types** sections of the Help Center.&#x20;
2. **Publishing a widget on your storefront**: This is important if you want to advertise the function, like in the case of discounts, sales, or free shipping promos.&#x20;

## In this section:

* [Step 1: Creating a function](#step-1-creating-a-function)
  * [Function campaign dashboard](#function-campaign-dashboard)
* [Step 2: Publishing a widget to your storefront](#step-2-publishing-a-widget-to-your-storefront)
  * [Part 1: Set up the widget](#part-1-set-up-the-widget)
  * [Part 2: Add the widget to your theme](#part-2-add-the-widget-to-your-theme)

***

## Step 1: Creating a function

**Steps:**

1. From the **FJ Functions & Script Editor**, click **Create new campaign**.
2. Under **Create campaign**, click **Start from scratch.**
3. Beside the function type you want to create, click **Continue**.
4. Input your function details as per the steps. Refer to the specific type of function in the Function types section of the Help Center if you need help.
5. Click **Publish**.

Your function is now active.&#x20;

### Function campaign dashboard

After you've clicked **Publish**, you're taken to that function campaign's dashboard.

Here you can:

* edit the function&#x20;
* monitor function performance
* [control the visibility of the function](/creating-and-publishing/controlling-campaign-visibility.md)
* switch the function status from draft to active
* review the function's timeline
* [add it as a storefront widget](#step-2-publishing-a-widget-to-your-storefront)

To make the function details visible to customers, you can publish it as a storefront widget.

***

## Step 2: Publishing a widget to your storefront

### Part 1: Set up the widget

**Steps:**

1. From the function campaign dashboard, under **Storefront Widgets** you have different options depending on the type of function you created:
   1. **Promotional banner**: Slides up from the bottom to highlight promotions or calls-to-action. Supports a title, subtitle, and button.&#x20;
   2. **Announcement bar**: Slim, sticky banner at the top for important updates or offers. It stays visible as customers scroll. Includes text and a link.
   3. **Tiered banner**: Shows progress toward unlocking discount tiers based on cart total. Supports a main title/subtitle and individual titles/subtitles for up to three tiers.
   4. **Popup**: Modal window over page content for promotions, announcements, or sign-ups. Includes a title, subtitle, and button.&#x20;
2. Enter the details required for the widget and click **Save**.
3. Under **Widget preview**, from the **Destination** drop-down, select where you want to publish the widget to. You can choose:
   1. **Home page**
   2. **Product page**
   3. **Collection page**
4. Select the **Theme** that you want to publish the widget to.
5. Click **Continue to theme editor**.

### Part 2: Add the widget to your theme

On your theme editor, the widget is published under the **Apps** block.

**Steps:**

1. Click on the widget that was added to the Apps section block.
2. Beside **Block identifier (Block Name or App Block ID)**, click **Select.**
3. Click the corresponding block name for the function you created.
4. Optional: Adjust any styles that you want to apply to the widget.
5. Click **Save**.
6. Optional: Click back to the main template and click and drag the **Apps** section block to the position in the theme template that you want, and click **Save**.
