> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.delm.app/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Delm + PageFly

You can integrate your delivery widgets into custom pages built with **PageFly** by using the **HTML/Liquid** element. This allows you to place a delivery estimate anywhere within your custom layout.

---

## 1. Enable the Delm Core app embed

The **Delm Core** app embed is required whenever you add widgets directly to your templates via custom code rather than using standard app blocks.

1. Go to **Shopify Admin > Online Store > Themes > Customize**.
2. Open **App embeds** on the left side.
3. Toggle **Delm Core** to **ON** and click **Save**.

![Enable Delm Core](https://storage.crisp.chat/users/helpdesk/website/-/a/4/8/8/a488abe1860c5800/enable-delm-core_224fkd.png)

---

## 2. Copy your widget embed code

You will need the specific code snippet for the widget you want to display.

1. Open the **Delm** app and go to the **Widget** section.
2. Select the widget you want to use.
3. Click **Install** and navigate to the **Liquid** tab.

![Install Widget](https://storage.crisp.chat/users/helpdesk/website/-/a/4/8/8/a488abe1860c5800/install-widget_1n7fh2.png)

4. Copy the code snippet (e.g., `<delm-widget ...></delm-widget>`).

![Widget Embed Code](https://storage.crisp.chat/users/helpdesk/website/-/a/4/8/8/a488abe1860c5800/widget-embed-code_kwgd5e.png)

---

## 3. Add the HTML/Liquid element in PageFly

Now you can insert this code into your PageFly design.

1. Open your page in the **PageFly Editor**.
2. Click the **Add element** icon (the plus sign) in the left-hand toolbar.
3. Search for the **HTML/Liquid** element and drag it onto your page where you want the widget to appear.

![PageFly Liquid Element](https://storage.crisp.chat/users/helpdesk/website/-/a/4/8/8/a488abe1860c5800/pagefly-liquid-element_1ylpcbh.png)

4. Click on the element you just placed, and in the **General** settings on the right, click **Open Editor**.
5. Paste the snippet you copied from Delm into the code editor and click **Save**.

![PageFly Liquid Code](https://storage.crisp.chat/users/helpdesk/website/-/a/4/8/8/a488abe1860c5800/pagefly-liquid-code_xg4ner.png)

6. **Save** and **Publish** your page.

---

## 4. Verification

Once published, view your live page to ensure the widget is appearing and calculating dates correctly. If the widget is invisible, double-check that **Delm Core** is enabled in your Shopify theme settings.