We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more

Remove return line for metafield

Remove return line for metafield

ashleyfonseca
Shopify Partner
8 0 1

Help! The size is a metafield, but how do i code it to be as if itʻs part of the sentence. I want it to be all on one line. 

 

Iʻm using this code to remove the bullet point but I want it to all be on one line like the example.

 

.metafield-single_line_text_field-array {
padding: 0;
}
.metafield-single_line_text_field {
list-style: none;
}

 

 

Screenshot 2025-06-18 at 10.22.56 PM.png

Replies 4 (4)

Dan-From-Ryviu
Shopify Partner
12073 2359 2539

You can try to use this code and check again.

.metafield-single_line_text_field-array {
 display: inline-flex;
}

- Helpful? Like & Accept solution!
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

TheScriptFlow
Excursionist
45 1 3

Could you please share your store url so that I can provide you solution code.

- Need a Shopify Specialist? Chat on WhatsApp Or Email at info@thescriptflow.com
- For any custom section queries, bug fixing please visit: Level 2 Fiverr Profile
- Buy Me a Coffee? Nah… Let’s Upgrade to a Car
- If my solution was helpful, mark it as a solution and hit the like button!

Davtonny
Excursionist
21 1 0

If your metafield has line breaks you want to remove, you can use the strip newlines filter in your Liquid code. It will display the text in a single line without returns.

MandasaTech
Shopify Partner
816 156 168

Hi @ashleyfonseca 

If your size metafield is showing as a list item but you want it to display as part of a sentence on a single line, you’ll need to adjust both your HTML/Liquid code and CSS.

Example Goal:

Instead of a bullet point or stacked display, you want:
Size: Medium (all on one line)


1. Liquid Code Example:

Make sure your metafield is rendered inside a regular element like a span or div, not a ul or li. For example:

<p>Size: {{ product.metafields.custom.size }}</p>

Or:

<span>Size: {{ product.metafields.custom.size }}</span>

Replace custom.size with your correct namespace and key.


2. CSS (if needed):

If you're already targeting metafield styles, you can simplify or remove the list-specific styling:

.metafield-single_line_text_field-array,
.metafield-single_line_text_field {
  list-style: none;
  padding: 0;
  display: inline; /* Ensures it stays on one line */
}

But ideally, if you switch to using span/p in your Liquid, you won’t need this extra styling at all.

Please note:

Avoid wrapping single-line text metafields in list (<ul>/<li>) tags unless you want bullet points or vertical stacking.

Let me know if you have any questions!

☞ Helpful or Question answered? Please Click Like & Mark it Accepted Solution
☞ Want to modify or custom changes on store for affordable price? Click on Contact button here
☞ Email at experts@mandasa.in
☞ Whatsapp at +918989609120 | Hire us at: Website Support Page
☞ Selling Shopify Fundamentals: Verified Skill Badge