Product description
How to use the Product description block in the Meditative Folks Theme.
Product description
At a glance
Renders the product description.
Used in
- Configure where this block is available in the parent section.
Settings
Layout
| Setting | What it does | Default | Shows when |
|---|---|---|---|
| Content direction (mobile) | Controls “Content direction (mobile)” on the storefront. Open the theme editor to preview live. | column | Always |
| Content direction (tablet and desktop) | Controls “Content direction (tablet and desktop)” on the storefront. Open the theme editor to preview live. | column | Always |
Label
| Setting | What it does | Default | Shows when |
|---|---|---|---|
| Show label | Turns “Show label” on or off on the storefront. | No | Always |
| Label text | Controls “Label text” on the storefront. Open the theme editor to preview live. | Description | show label |
| Use global H3 heading styles | When on, uses the matching style from Theme settings. Turn off to style only this section or block. | Yes | show label |
| Heading font size (mobile) | Sets heading font size (mobile) in pixels for the matching screen size. | 26 | Show label is on and Use global H3 styles is off |
| Heading font size (tablet) | Sets heading font size (tablet) in pixels for the matching screen size. | 29 | Show label is on and Use global H3 styles is off |
| Heading font size (desktop) | Sets heading font size (desktop) in pixels for the matching screen size. | 33 | Show label is on and Use global H3 styles is off |
| Heading font weight | Sets how bold heading text appears. | 600 | Show label is on and Use global H3 styles is off |
Description
| Setting | What it does | Default | Shows when |
|---|---|---|---|
| Show read more for long descriptions | Collapses descriptions longer than 2 lines with a read more button. | Yes | Always |
| Use global paragraph styles | Use paragraph styles from your global theme styles. | Yes | Always |
| Paragraph font size (mobile) | Sets paragraph font size (mobile) in pixels for the matching screen size. | 16 | use global paragraph styles for description is off |
| Paragraph font size (tablet) | Sets paragraph font size (tablet) in pixels for the matching screen size. | 16 | use global paragraph styles for description is off |
| Paragraph font size (desktop) | Sets paragraph font size (desktop) in pixels for the matching screen size. | 20 | use global paragraph styles for description is off |
| Content alignment (mobile) | If the block is inside the flex block, content align does not work. Move it outside the flex block to work. | center | Always |
| Content alignment (tablet) | Aligns description text on tablet screens. | center | Always |
| Content alignment (desktop) | Aligns description text on desktop screens. | center | Always |
Setting details
Each control from the tables above, explained simply:
Content direction (mobile)
Controls “Content direction (mobile)” on the storefront. Open the theme editor to preview live. Default: column.
Content direction (tablet and desktop)
Controls “Content direction (tablet and desktop)” on the storefront. Open the theme editor to preview live. Default: column.
Show label
Turns “Show label” on or off on the storefront. Default: No.
Label text
Controls “Label text” on the storefront. Open the theme editor to preview live. Default: Description. This control appears when: show label.
Use global H3 heading styles
When on, uses the matching style from Theme settings. Turn off to style only this section or block. Default: Yes. This control appears when: show label.
Heading font size (mobile)
Sets heading font size (mobile) in pixels for the matching screen size. Default: 26. This control appears when: Show label is on and Use global H3 styles is off.
Heading font size (tablet)
Sets heading font size (tablet) in pixels for the matching screen size. Default: 29. This control appears when: Show label is on and Use global H3 styles is off.
Heading font size (desktop)
Sets heading font size (desktop) in pixels for the matching screen size. Default: 33. This control appears when: Show label is on and Use global H3 styles is off.
Heading font weight
Sets how bold heading text appears. Default: 600. This control appears when: Show label is on and Use global H3 styles is off.
Show read more for long descriptions
Collapses descriptions longer than 2 lines with a read more button. Default: Yes.
Use global paragraph styles
Use paragraph styles from your global theme styles. Default: Yes.
Paragraph font size (mobile)
Sets paragraph font size (mobile) in pixels for the matching screen size. Default: 16. This control appears when: use global paragraph styles for description is off.
Paragraph font size (tablet)
Sets paragraph font size (tablet) in pixels for the matching screen size. Default: 16. This control appears when: use global paragraph styles for description is off.
Paragraph font size (desktop)
Sets paragraph font size (desktop) in pixels for the matching screen size. Default: 20. This control appears when: use global paragraph styles for description is off.
Content alignment (mobile)
If the block is inside the flex block, content align does not work. Move it outside the flex block to work. Default: center.
Content alignment (tablet)
Aligns description text on tablet screens. Default: center.
Content alignment (desktop)
Aligns description text on desktop screens. Default: center.
Tips
- Place this block inside a wrapper if it should only show on certain screen sizes.
- Preview in the theme editor on mobile and desktop.