Focal theme - left aligning texts in product grids on collection pages

Store Design

Topic summary

A Focal theme user needed help left-aligning text elements across multiple sections: product grids, recently viewed products, product recommendations, featured collections, and collection pages.

Solution provided:

  • Navigate to Online Store → Themes → Edit Code
  • Locate the “theme.css” file
  • Add CSS code at the end:
.product-item__info
.product-item-meta {
  display: block;
  text-align: left !important;
}
  • Save the file

Outcome: The solution was implemented successfully and resolved the alignment issue as intended. The thread is now closed with the problem fully resolved.

Summarized with AI on November 15. AI used: claude-sonnet-4-5-20250929.
2

Hey @JohnBoye

Please follow these instruction

Step: 1 Go to Online Store → Themes
Step: 2 Click on three dots placed before publish Button → Edit Code
Step: 3 Search this file “theme.css”
Step: 4 At the last Paste this code and save file

.product-item__info
.product-item-meta {
display: block;
text-align: left !important;
}

Definitely your query will resolved .

Thanks