> For the complete documentation index, see [llms.txt](https://halosoft.gitbook.io/ella-7-documentation/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://halosoft.gitbook.io/ella-7-documentation/product-page/product-information/delivery-time.md).
# Delivery Time
**The Delivery Time** block displays estimated delivery information for products. It combines an icon and delivery time text in a flexible group layout with extensive customization options for appearance, layout, and styling.
The block is rendered through the `group` snippet with two child blocks: an icon and delivery time text.
### How to setup Delivery Time?
* From your Shopify admin, go to **Online Store** **->** **Themes**.
* Find the theme that you want to edit, and then click **Customize**.
* Choose **Default product** template in the dropdown of editor window to open theme editor of product page.
* From I**nformation -> Details ->** Choose **Delivery time**.
### Delivery Time Block - Settings Guide
| Setting | Type | Description |
| ------------------------------------- | ----------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Link** | url | Optional link URL for the delivery time block |
| **Open New Tab** | checkbox | Open link in new browser tab. Default: false |
| **Content Direction** | select | Layout direction. Options: "Vertical" (column) or "Horizontal" (row). Default: Column |
| **Direction On Mobile** | select | Layout direction on mobile devices. Options: "Vertical" or "Horizontal". Default: Column |
| **Alignment** | select | Horizontal alignment when direction is Horizontal. Options: "Left", "Center", "Right", "Space Between" — Visible when Content Direction is Horizontal. Default: Left |
| **Position** | select | Vertical alignment when direction is Horizontal. Options: "Stretch", "Top", "Center", "Bottom" — Visible when Content Direction is Horizontal. Default: Center |
| **Align Baseline** | checkbox | Align items to baseline — Visible when Position is Bottom. Default: false |
| **Alignment** | select | Horizontal alignment when direction is Vertical. Options: "Left", "Center", "Right" — Visible when Content Direction is Vertical. Default: Left |
| **Position** | select | Vertical alignment when direction is Vertical. Options: "Top", "Center", "Bottom", "Space Between" — Visible when Content Direction is Column. Default: Center |
| **Mobile Alignment** | select | Horizontal alignment on mobile when direction is Horizontal. Options: "Left", "Center", "Right", "Space Between" — Visible when Direction On Mobile is Horizontal. Default: Left |
| **Position Mobile** | select | Vertical alignment on mobile when direction is Horizontal. Options: "Stretch", "Top", "Center", "Bottom" — Visible when Direction On Mobile is Horizontal. Default: Center |
| **Mobile Alignment** | select | Horizontal alignment on mobile when direction is Vertical. Options: "Left", "Center", "Right" — Visible when Direction On Mobile is Vertical. Default: Left |
| **Position Mobile** | select | Vertical alignment on mobile when direction is Vertical. Options: "Top", "Center", "Bottom", "Space Between" — Visible when Direction On Mobile is Column. Default: Center |
| **Gap** | range | Space between icon and text (0-100px). Default: 12px |
| **Width** | select | Block width. Options: "Fit Content", "Fill", "Custom". Default: Fill |
| **Custom Width** | range | Custom width percentage (0-100%) — Visible when Width is Custom. Default: 100% |
| **Width Mobile** | select | Block width on mobile. Options: "Fit Content", "Fill", "Custom". Default: Fill |
| **Custom Width** | range | Custom mobile width percentage (0-100%) — Visible when Width Mobile is Custom. Default: 100% |
| **Height** | select | Block height. Options: "Auto", "Fit Content", "Fill", "Custom". Default: Fit |
| **Custom Height** | range | Custom height percentage (0-100%) — Visible when Height is Custom. Default: 100% |
| **Inherit Color Scheme** | checkbox | Inherit colors from parent section. Default: true |
| **Background** | color | Background color with alpha transparency — Visible when Inherit Color Scheme is false. Default: #FFFFFF |
| **Background Gradient** | color\_background | Background gradient — Visible when Inherit Color Scheme is false |
| **Headings** | color | Heading text color with alpha — Visible when Inherit Color Scheme is false. Default: #000000 |
| **Text** | color | Body text color with alpha — Visible when Inherit Color Scheme is false. Default: #000000 |
| **Primary Color** | color | Primary/link color with alpha — Visible when Inherit Color Scheme is false. Default: #000F9F |
| **Primary Hover Color** | color | Primary hover state color with alpha — Visible when Inherit Color Scheme is false. Default: #000000 |
| **Borders** | color | Border color with alpha — Visible when Inherit Color Scheme is false. Default: #E6E6E6 |
| **Shadow Color** | color | Shadow color with alpha — Visible when Inherit Color Scheme is false. Default: #000000 |
| **Background Media** | select | Background media type. Options: "None", "Image", "Video". Default: None |
| **Video** | video | Background video — Visible when Background Media is Video |
| **Video Position** | select | Video sizing. Options: "Cover", "Contain" — Visible when Background Media is Video. Default: Cover |
| **Image** | image\_picker | Background image — Visible when Background Media is Image |
| **Image Position** | select | Image sizing. Options: "Cover", "Fit" — Visible when Background Media is Image. Default: Cover |
| **Content Overlay** | checkbox | Enable content overlay mode — Visible when Background Media is Image or Video. Default: false |
| **Image Ratio** | select | Aspect ratio for background. Options: "Auto", "Portrait", "Square", "Landscape" — Visible when Background Media is Image/Video and Content Overlay is enabled. Default: Adapt |
| **Borders** | select | Border style. Options: "None", "Solid". Default: None |
| **Border Width** | range | Border width (0-10px, step 0.5) — Visible when Borders is not None. Default: 1px |
| **Border Radius** | range | Corner radius (0-100px). Default: 0px |
| **Background Overlay** | checkbox | Enable background overlay. Default: false |
| **Overlay Color** | color | Overlay color with alpha — Visible when Background Overlay is enabled. Default: #00000026 |
| **Extend Left Overlay** | checkbox | Extend overlay to left edge — Visible when Background Overlay is enabled. Default: false |
| **Extend Right Overlay** | checkbox | Extend overlay to right edge — Visible when Background Overlay is enabled. Default: false |
| **Overlay Style** | select | Overlay style. Options: "Solid", "Gradient" — Visible when Background Overlay is enabled. Default: Solid |
| **Gradient Direction** | select | Gradient direction. Options: "Up" (to top), "Down" (to bottom) — Visible when Background Overlay and Overlay Style is Gradient. Default: Up |
| **Enable Parallax Scroll** | checkbox | Enable parallax scrolling effect. Default: false |
| **Disable Parallax Scroll On Mobile** | checkbox | Disable parallax on mobile — Visible when Enable Parallax Scroll is true. Default: false |
| **Parallax Speed** | range | Parallax scroll speed (0-4, step 0.5) — Visible when Enable Parallax Scroll is true. Default: 0.5 |
| **Horizontal Position** | range | Parallax horizontal offset (-50% to 50%) — Visible when Enable Parallax Scroll is true. Default: 0% |
| **Vertical Position** | range | Parallax vertical offset (-50% to 50%) — Visible when Enable Parallax Scroll is true. Default: 0% |
| **Shadow Color** | color | Box shadow color with alpha. Default: #00000000 (transparent) |
| **Horizontal Offset** | range | Shadow horizontal offset (-12px to 12px). Default: 0px |
| **Vertical Offset** | range | Shadow vertical offset (-12px to 12px). Default: 0px |
| **Blur** | range | Shadow blur radius (0-20px, step 2). Default: 0px |
| **Spread** | range | Shadow spread radius (0-100px). Default: 0px |
| **Top** (Margin) | range | Top margin (0-100px). Default: 0px |
| **Top Margin Mobile** | range | Top margin on mobile (0-100px). Default: 0px |
| **Bottom** (Margin) | range | Bottom margin (0-100px). Default: 0px |
| **Bottom Margin Mobile** | range | Bottom margin on mobile (0-100px). Default: 0px |
| **Left** (Margin) | range | Left margin (0-100px). Default: 0px |
| **Left Margin Mobile** | range | Left margin on mobile (0-100px). Default: 0px |
| **Right** (Margin) | range | Right margin (0-100px). Default: 0px |
| **Top Margin Mobile** (Right) | range | Right margin on mobile (0-100px). Default: 0px |
| **Top** (Padding) | range | Top padding (0-100px). Default: 0px |
| **Bottom** (Padding) | range | Bottom padding (0-100px). Default: 0px |
| **Left** (Padding) | range | Left padding (0-100px). Default: 0px |
| **Right** (Padding) | range | Right padding (0-100px). Default: 0px |
***
---
# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.
## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:
```
GET https://halosoft.gitbook.io/ella-7-documentation/product-page/product-information/delivery-time.md?ask=&goal=
```
`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.