Add Checkout & Account merchant block documentation (9 blocks) #661
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,76 @@ | ||
| --- | ||
| title: Commerce Account Header | ||
| description: Customers see consistent page headers across account pages through this block. Place it at the top of account-related pages. | ||
| sidebar: | ||
| label: Account Header | ||
| --- | ||
|
|
||
| import Diagram from '@components/Diagram.astro'; | ||
|
|
||
| Customers see consistent page headers across account pages through this block. Place it at the top of account-related pages. | ||
|
|
||
| <Diagram caption="Commerce Account Header block."> | ||
|  | ||
| </Diagram> | ||
|
|
||
|
|
||
| ## Configuration | ||
|
|
||
| Add this table to your document to configure the block: | ||
|
|
||
| <table style="width: 100%; min-width: 470px; max-width: 100%; table-layout: fixed; border-collapse: collapse;"> | ||
| <tbody> | ||
| <tr> | ||
| <td colspan="2" style="text-align: center; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5); background-color: var(--sl-color-gray-6); font-weight: 600;">commerce-account-header</td> | ||
| </tr> | ||
| <tr> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Title</td> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">My account</td> | ||
| </tr> | ||
| </tbody> | ||
| </table> | ||
|
|
||
| ### Property descriptions | ||
|
|
||
| **Title**: The header title text displayed to users. Default: `My account`. | ||
|
|
||
| ### Important notes | ||
|
|
||
| - Uses default configuration values if custom settings are missing or invalid. | ||
|
|
||
| ## Section metadata | ||
|
|
||
| Control the section styling, spacing, and layout that wraps your commerce block. All properties are optional: | ||
|
|
||
| <table style="width: 100%; min-width: 470px; max-width: 100%; table-layout: fixed; border-collapse: collapse;"> | ||
| <tbody> | ||
| <tr> | ||
| <td colspan="2" style="text-align: center; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5); background-color: var(--sl-color-gray-6); font-weight: 600;">section-metadata</td> | ||
| </tr> | ||
| <tr> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Style</td> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">light <span style="font-size: 0.85em;">(optional)</span></em></td> | ||
| </tr> | ||
| <tr> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Padding</td> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">medium <span style="font-size: 0.85em;">(optional)</span></em></td> | ||
| </tr> | ||
| <tr> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Margin</td> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">small <span style="font-size: 0.85em;">(optional)</span></em></td> | ||
| </tr> | ||
| <tr> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Column Width</td> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">30% <span style="font-size: 0.85em;">(optional)</span></em></td> | ||
| </tr> | ||
| <tr> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Gap</td> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">small <span style="font-size: 0.85em;">(optional)</span></em></td> | ||
| </tr> | ||
| </tbody> | ||
| </table> | ||
|
|
||
| <div style="background-color: var(--sl-color-blue-low); border-left: 4px solid var(--sl-color-blue); padding: 0.75rem 1rem; border-radius: 0.25rem; margin: 1rem 0 2rem 0;"> | ||
| <strong>Learn more:</strong> See the <a href="/merchants/storefront-builder/section-metadata/">Section Metadata guide</a> for all available values and the <a href="/merchants/storefront-builder/page-metadata/">Page Metadata guide</a> for SEO and caching options. | ||
| </div> | ||
|
|
||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,60 @@ | ||
| --- | ||
| title: Account Navigation | ||
| description: Customers navigate between account sections through this block. Place it on account dashboard pages. | ||
| sidebar: | ||
| label: Account Navigation | ||
| --- | ||
|
|
||
| import Diagram from '@components/Diagram.astro'; | ||
|
|
||
| Customers navigate between account sections through this block. Place it on account dashboard pages. | ||
|
|
||
| <Diagram caption="Account Navigation block."> | ||
|  | ||
| </Diagram> | ||
|
|
||
|
|
||
| ## Requirements | ||
|
|
||
| Customers must log in to access this block. | ||
|
|
||
| ## Configuration | ||
|
|
||
| No configurations available for this block. | ||
|
|
||
| ## Section metadata | ||
|
|
||
| Control the section styling, spacing, and layout that wraps your commerce block. All properties are optional: | ||
|
|
||
| <table style="width: 100%; min-width: 470px; max-width: 100%; table-layout: fixed; border-collapse: collapse;"> | ||
| <tbody> | ||
| <tr> | ||
| <td colspan="2" style="text-align: center; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5); background-color: var(--sl-color-gray-6); font-weight: 600;">section-metadata</td> | ||
| </tr> | ||
| <tr> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Style</td> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">light <span style="font-size: 0.85em;">(optional)</span></em></td> | ||
| </tr> | ||
| <tr> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Padding</td> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">medium <span style="font-size: 0.85em;">(optional)</span></em></td> | ||
| </tr> | ||
| <tr> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Margin</td> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">small <span style="font-size: 0.85em;">(optional)</span></em></td> | ||
| </tr> | ||
| <tr> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Column Width</td> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">30% <span style="font-size: 0.85em;">(optional)</span></em></td> | ||
| </tr> | ||
| <tr> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Gap</td> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">small <span style="font-size: 0.85em;">(optional)</span></em></td> | ||
| </tr> | ||
| </tbody> | ||
| </table> | ||
|
|
||
| <div style="background-color: var(--sl-color-blue-low); border-left: 4px solid var(--sl-color-blue); padding: 0.75rem 1rem; border-radius: 0.25rem; margin: 1rem 0 2rem 0;"> | ||
| <strong>Learn more:</strong> See the <a href="/merchants/storefront-builder/section-metadata/">Section Metadata guide</a> for all available values and the <a href="/merchants/storefront-builder/page-metadata/">Page Metadata guide</a> for SEO and caching options. | ||
| </div> | ||
|
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,56 @@ | ||
| --- | ||
| title: Commerce Account Sidebar | ||
| description: Customers navigate account sections through this sidebar. Place it on account pages for easy navigation. | ||
| sidebar: | ||
| label: Account Sidebar | ||
| --- | ||
|
|
||
| import Diagram from '@components/Diagram.astro'; | ||
|
|
||
| Customers navigate account sections through this sidebar. Place it on account pages for easy navigation. | ||
|
|
||
| <Diagram caption="Commerce Account Sidebar block."> | ||
|  | ||
| </Diagram> | ||
|
|
||
|
|
||
| ## Configuration | ||
|
|
||
| No configurations available for this block. | ||
|
|
||
| ## Section metadata | ||
|
|
||
| Control the section styling, spacing, and layout that wraps your commerce block. All properties are optional: | ||
|
|
||
| <table style="width: 100%; min-width: 470px; max-width: 100%; table-layout: fixed; border-collapse: collapse;"> | ||
| <tbody> | ||
| <tr> | ||
| <td colspan="2" style="text-align: center; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5); background-color: var(--sl-color-gray-6); font-weight: 600;">section-metadata</td> | ||
| </tr> | ||
| <tr> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Style</td> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">light <span style="font-size: 0.85em;">(optional)</span></em></td> | ||
| </tr> | ||
| <tr> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Padding</td> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">medium <span style="font-size: 0.85em;">(optional)</span></em></td> | ||
| </tr> | ||
| <tr> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Margin</td> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">small <span style="font-size: 0.85em;">(optional)</span></em></td> | ||
| </tr> | ||
| <tr> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Column Width</td> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">30% <span style="font-size: 0.85em;">(optional)</span></em></td> | ||
| </tr> | ||
| <tr> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Gap</td> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">small <span style="font-size: 0.85em;">(optional)</span></em></td> | ||
| </tr> | ||
| </tbody> | ||
| </table> | ||
|
|
||
| <div style="background-color: var(--sl-color-blue-low); border-left: 4px solid var(--sl-color-blue); padding: 0.75rem 1rem; border-radius: 0.25rem; margin: 1rem 0 2rem 0;"> | ||
| <strong>Learn more:</strong> See the <a href="/merchants/storefront-builder/section-metadata/">Section Metadata guide</a> for all available values and the <a href="/merchants/storefront-builder/page-metadata/">Page Metadata guide</a> for SEO and caching options. | ||
| </div> | ||
|
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,60 @@ | ||
| --- | ||
| title: "Purchase Order Checkout Success" | ||
| description: Buyers receive purchase order confirmation and order numbers through this block. Place it on purchase order confirmation pages. | ||
| sidebar: | ||
| label: "PO Checkout Success" | ||
| --- | ||
|
|
||
| import Diagram from '@components/Diagram.astro'; | ||
|
|
||
| Buyers receive purchase order confirmation and order numbers through this block. Place it on purchase order confirmation pages. | ||
|
|
||
| <Diagram caption="Purchase Order Checkout Success block."> | ||
|  | ||
| </Diagram> | ||
|
|
||
|
|
||
| ## Requirements | ||
|
|
||
| Customers must log in to access this block. Enable company features in **Stores** > **Configuration** > **General** > **B2B Features** > **Enable Company**. Purchase orders are then configured per company. | ||
|
|
||
| ## Configuration | ||
|
|
||
| No configurations available for this block. | ||
|
|
||
| ## Section metadata | ||
|
|
||
| Control the section styling, spacing, and layout that wraps your commerce block. All properties are optional: | ||
|
|
||
| <table style="width: 100%; min-width: 470px; max-width: 100%; table-layout: fixed; border-collapse: collapse;"> | ||
| <tbody> | ||
| <tr> | ||
| <td colspan="2" style="text-align: center; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5); background-color: var(--sl-color-gray-6); font-weight: 600;">section-metadata</td> | ||
| </tr> | ||
| <tr> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Style</td> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">highlight <span style="font-size: 0.85em;">(optional)</span></em></td> | ||
| </tr> | ||
| <tr> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Padding</td> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">medium <span style="font-size: 0.85em;">(optional)</span></em></td> | ||
| </tr> | ||
| <tr> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Margin</td> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">small <span style="font-size: 0.85em;">(optional)</span></em></td> | ||
| </tr> | ||
| <tr> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Column Width</td> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">30% <span style="font-size: 0.85em;">(optional)</span></em></td> | ||
| </tr> | ||
| <tr> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Gap</td> | ||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">small <span style="font-size: 0.85em;">(optional)</span></em></td> | ||
| </tr> | ||
| </tbody> | ||
| </table> | ||
|
|
||
| <div style="background-color: var(--sl-color-blue-low); border-left: 4px solid var(--sl-color-blue); padding: 0.75rem 1rem; border-radius: 0.25rem; margin: 1rem 0 2rem 0;"> | ||
| <strong>Learn more:</strong> See the <a href="/merchants/storefront-builder/section-metadata/">Section Metadata guide</a> for all available values and the <a href="/merchants/storefront-builder/page-metadata/">Page Metadata guide</a> for SEO and caching options. | ||
| </div> | ||
|
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change | ||||
|---|---|---|---|---|---|---|
| @@ -0,0 +1,83 @@ | ||||||
| --- | ||||||
| title: Quote Checkout | ||||||
|
Contributor
There was a problem hiding this comment.
Suggested change
|
||||||
| description: Buyers complete negotiated quote purchases with approved pricing through this block. Place it on quote checkout pages. | ||||||
| sidebar: | ||||||
| label: Quote Checkout | ||||||
|
Contributor
There was a problem hiding this comment.
Suggested change
|
||||||
| --- | ||||||
|
|
||||||
| import Diagram from '@components/Diagram.astro'; | ||||||
|
|
||||||
| Buyers complete negotiated quote purchases with approved pricing through this block. Place it on quote checkout pages. | ||||||
|
|
||||||
| <Diagram caption="Quote Checkout block."> | ||||||
|  | ||||||
| </Diagram> | ||||||
|
|
||||||
| ## Requirements | ||||||
|
|
||||||
| Customers must log in to access this block. Enable company features and negotiable quotes in **Stores** > **Configuration** > **General** > **B2B Features** > **Enable Company** and **Stores** > **Configuration** > **General** > **B2B Features** > **Enable B2B Quote**. | ||||||
|
|
||||||
| ## Configuration | ||||||
|
|
||||||
| No configurations available for this block. | ||||||
|
|
||||||
| ## Page metadata | ||||||
|
|
||||||
| Configure page-level metadata in the document authoring table below: | ||||||
|
|
||||||
| <table style="width: 100%; min-width: 470px; max-width: 100%; table-layout: fixed; border-collapse: collapse;"> | ||||||
| <tbody> | ||||||
| <tr> | ||||||
| <td colspan="2" style="text-align: center; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5); background-color: var(--sl-color-gray-6); font-weight: 600;">metadata</td> | ||||||
| </tr> | ||||||
| <tr> | ||||||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Title</td> | ||||||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Checkout</td> | ||||||
| </tr> | ||||||
| <tr> | ||||||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Robots</td> | ||||||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">noindex, nofollow</td> | ||||||
| </tr> | ||||||
| <tr> | ||||||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Cache Control</td> | ||||||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">no-store</td> | ||||||
| </tr> | ||||||
| </tbody> | ||||||
| </table> | ||||||
|
|
||||||
| ## Section metadata | ||||||
|
|
||||||
| Control the section styling, spacing, and layout that wraps your commerce block. All properties are optional: | ||||||
|
|
||||||
| <table style="width: 100%; min-width: 470px; max-width: 100%; table-layout: fixed; border-collapse: collapse;"> | ||||||
| <tbody> | ||||||
| <tr> | ||||||
| <td colspan="2" style="text-align: center; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5); background-color: var(--sl-color-gray-6); font-weight: 600;">section-metadata</td> | ||||||
| </tr> | ||||||
| <tr> | ||||||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Style</td> | ||||||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">highlight <span style="font-size: 0.85em;">(optional)</span></em></td> | ||||||
| </tr> | ||||||
| <tr> | ||||||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Padding</td> | ||||||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">medium <span style="font-size: 0.85em;">(optional)</span></em></td> | ||||||
| </tr> | ||||||
| <tr> | ||||||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Margin</td> | ||||||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">small <span style="font-size: 0.85em;">(optional)</span></em></td> | ||||||
| </tr> | ||||||
| <tr> | ||||||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Column Width</td> | ||||||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">30% <span style="font-size: 0.85em;">(optional)</span></em></td> | ||||||
| </tr> | ||||||
| <tr> | ||||||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);">Gap</td> | ||||||
| <td style="width: 50%; padding: 0.75rem; border: 1px solid var(--sl-color-gray-5);"><em style="color: var(--sl-color-gray-3); font-style: italic;">small <span style="font-size: 0.85em;">(optional)</span></em></td> | ||||||
| </tr> | ||||||
| </tbody> | ||||||
| </table> | ||||||
|
|
||||||
| <div style="background-color: var(--sl-color-blue-low); border-left: 4px solid var(--sl-color-blue); padding: 0.75rem 1rem; border-radius: 0.25rem; margin: 1rem 0 2rem 0;"> | ||||||
| <strong>Learn more:</strong> See the <a href="/merchants/storefront-builder/section-metadata/">Section Metadata guide</a> for all available values and the <a href="/merchants/storefront-builder/page-metadata/">Page Metadata guide</a> for SEO and caching options. | ||||||
| </div> | ||||||
|
|
||||||
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is the only block in this PR that has an Important notes section. Change this content to a tip. (You'll need to change the wording since this is a sentence fragment.