The Smart Delivery Page is a separate delivery selection page between the Cart and the Checkout, where customers choose how they'd like to receive their order and can give their billing details, with a cart summary shown alongside. The Setup Guide recommends this integration by default, and it's included in every plan, including Free.
Customizing the page design
On the Page design tab, you can match the appearance of the Smart Delivery Page to your store's design.
In the Shopify admin, open the PickupBird by Digiloop app and go to the Integration and Design menu.
Select the Smart Delivery Page option by clicking Settings.
On the Page design tab that appears, you can customize the appearance of the page.
In the Page section, set the page width, the position of the cart summary and the page background.
In the Button section, set the background color, text color and border radius of the buttons.
In the Text section, set the primary and secondary text colors, both on the page and inside the selection blocks.
In the Selection blocks section, set the background and border colors, plus separate colors for the selected option.
In the Map section, choose the pin style, the map style and the button shape, and set the map's colors.
In the Branding section, you can hide the "Powered by PickupBird" badge from the map. This option is available on the Plus plan.
Tip: the preview on the right updates automatically based on your settings. It uses sample data, so click View in your store to see the page with your own products and providers. Use Desktop view and Mobile view to check both layouts.
Setting the delivery methods
On the Delivery methods tab, you decide which delivery options your customers see, and in what order.
In the Shopify admin, open the PickupBird by Digiloop app and go to the Integration and Design menu.
Select the Smart Delivery Page option by clicking Settings.
Open the Delivery methods tab.
Use the Show checkbox to turn Pickup point / Parcel locker, Local pickup and Home delivery on or off.
Use Move up and Move down to change the order. The order applies to both the preview and the page your customers see.
Good to know: for Home delivery and Local pickup, the page only shows a short notice. There's no shipping rate or store selector on the page; customers choose the exact option at the Shopify Checkout.
Collecting invoice details
On the Invoice details tab, you can ask customers for their billing information before checkout.
In the Shopify admin, open the PickupBird by Digiloop app and go to the Integration and Design menu.
Select the Smart Delivery Page option by clicking Settings.
Open the Invoice details tab.
Enable Ask for the billing type to let customers choose between buying as an individual or as a company before the delivery methods appear.
Enable Tax number required for company purchases if customers buying as a company must enter a tax number.
In the Tax number cart attribute field, enter the name of the cart attribute the tax number is saved to, for example tax_number. Use this name if your invoicing app or workflow reads the tax number from the order.
In the Countries section, choose the countries where the billing section is shown. Leave it empty to show it everywhere.
Tip: in the preview, choose "I'm buying as a company" to see the tax number field.
Turning on the app embed
For the Smart Delivery Page to appear in your store, the Smart Delivery Page as app embed extension must be turned on.
In the Shopify admin, open the PickupBird by Digiloop app and go to the Integration and Design menu.
Select the Smart Delivery Page option by clicking Settings.
Open the App extension settings tab.
If Smart Delivery Page as app embed shows Off, click App embed settings, turn on the embed in the Theme Editor and click Save.
Return to the app and click Refresh so the app can verify the setting.
Under Hidden countries, you can choose countries where the Smart Delivery Page isn't shown. Customers in those countries go straight from the Cart to the Checkout.
Showing the selected pickup point after purchase
Use the Selected pickup point on Thank you page and Selected pickup point on Order Status page settings to place the block showing the customer's chosen pickup point on the relevant page.
Click Checkout settings on the Selected pickup point on Thank you page element. This opens the Thank you page editor.
Find the Selected pickup point display element under the PickupBird by Digiloop block, and add it to the Thank You page using the + icon.
Use the Sections icon in the top right to open the page structure in the editor.
Move the element to the location where you want it displayed.
Save the settings by clicking Save.
Close the page to return to the PickupBird by Digiloop app.
Click the Refresh link so the app can verify that the settings are correct.
Status: On – you have already activated the extension
Status: Off – you haven't activated the extension yet
Repeat the steps for the extension belonging to the Order Status page.
Checking the proxy settings
Your store serves the Smart Delivery Page from an app proxy URL, by default yourstore.myshopify.com/apps/pickupbird. If you haven't customized the app proxy URL in Shopify, you don't need to change anything here.
In the Shopify admin, open the PickupBird by Digiloop app and go to the Integration and Design menu.
Select the Smart Delivery Page option by clicking Settings.
Open the Proxy settings tab.
Set the same Subpath prefix and Subpath as in your Shopify settings. To check them, click Open app settings in Shopify, or in the Shopify admin go to Settings → Apps, open PickupBird and click Customize URL in the App proxy URL section.
Important: while the Smart Delivery Page is active, always turn off "Buy it now", "Quick Buy", "Express Checkout" and similar settings in your theme. These buttons let customers skip the Smart Delivery Page and go straight to checkout.