> For the complete documentation index, see [llms.txt](https://docs.overse.app/hubble/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.overse.app/hubble/block-types/special/order-items-list.md).

# Order items List

The Order Items List Block displays a list of a customer's orders directly on the customer account pages. It provides easy access to order details, helping customers manage their purchases efficiently.

## Key features

* **Default block**: The Order Items List Block is automatically included and does not require additional setup.
* **Customizable in Shopify editor**: Add a heading and manage its placement directly in the Shopify Account Editor.
* **Actions integration**: Enhance the block with Line Item Actions to allow features like reordering or contacting support.

## Order items List block

The Order Items List Block displays a customer’s orders directly on their account page. It is highly customizable through Shopify’s Account Editor and additional configurations unlocked by generating a Block ID.

{% stepper %}
{% step %}

#### Access Special Blocks

Open the sidebar and click the **Special Blocks** card.

<figure><img src="https://252181162-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgNjbkcqEVwk7mzEfZieR%2Fuploads%2Fgit-blob-38f951f2d8263d5568eea581d7140886e6130529%2FBlocks%20-%20Special%20Blocks.png?alt=media" alt=""><figcaption></figcaption></figure>
{% endstep %}

{% step %}

#### Select Order items List

Click the **Customize** button that is in the **Order Items List** card.

<figure><img src="https://252181162-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgNjbkcqEVwk7mzEfZieR%2Fuploads%2Fl7nhRfPul46kU2cSSOGO%2Fimage.png?alt=media&amp;token=a080bc15-4c8b-48fc-b36f-4200b72127ab" alt=""><figcaption></figcaption></figure>
{% endstep %}

{% step %}

#### Generate the Block ID

On the Order Items List page, click the **Generate Block ID** button (located in the “Get your Block ID” card).

<figure><img src="https://252181162-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgNjbkcqEVwk7mzEfZieR%2Fuploads%2F4D9uqUl9ieR9D4qCs65s%2Fimage.png?alt=media&amp;token=5aec8a97-128d-4dd0-afbc-91a788220d45" alt=""><figcaption></figcaption></figure>

{% hint style="warning" %}
You must generate a Block ID to unlock further configurations.
{% endhint %}
{% endstep %}

{% step %}

#### Configure additional settings

Once the Block ID is generated, the following options become available:

**Enabled:** On or Off, this controls the visibility of your block.

**Block ID:** Use this to publish your block in a later step.

**Manage Line Item Actions:** This is a link towards [Line Item Actions](/hubble/block-types/special/order-item-actions.md), a block that can be integrated.

<figure><img src="https://252181162-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgNjbkcqEVwk7mzEfZieR%2Fuploads%2F1xQbXHYWcCnUZCCN9OeB%2Fimage.png?alt=media&amp;token=cda835c4-caa7-450b-815e-f038b223c346" alt=""><figcaption></figcaption></figure>
{% endstep %}

{% step %}

#### Publish your block

Click the **Publish** button that is in the right-top corner and follow the steps that will appear.

<figure><img src="https://252181162-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgNjbkcqEVwk7mzEfZieR%2Fuploads%2F4aLwyVZDtHd9PrRcwuKP%2Fimage.png?alt=media&amp;token=0d342c6f-48ff-431f-9449-771f5bf20229" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
Success: The block is now live on the customer account pages.
{% endhint %}
{% endstep %}

{% step %}

#### Configure Editor settings

Layout and theming settings are available within the Shopify's Account Editor for this block.

Configure settings such as:

**Optional heading:** add a heading (e.g., “Your Orders”) above the list to improve clarity.

**Background color:** choose from these styles: Card, Base, Subdued, or Transparent.

**Toggle enable/disable Order item Actions:** toggle interactive actions (e.g., reorder, support) for each order item.

<figure><img src="https://252181162-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgNjbkcqEVwk7mzEfZieR%2Fuploads%2Fgit-blob-2522c8e4512a915e6557b84dff4d7feb8aacd4ce%2FEditor%20-%20Order%20Items%20List%20settings.png?alt=media" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
Use Shopify’s Account Editor to adjust the block’s placement and add an optional heading.
{% endhint %}
{% endstep %}
{% endstepper %}