How to find yotpo css in theme.css in shopify

Technical Q&A
,
1

As title states how do i find yotpo css in theme.css, i am trying to find a text-align line for mobile

Any help is appreciated

1 Like
2

Hi @CWDSD

Im not sure what is yotpo? but if you like to find something in the theme.css you must know the exact name of the selector and read the codes. If you just like to align something in the mobile, Can I check it? Would you mind to share your Store URL website? with password if its protected. And please point out which text youll like to align. Thanks!

1 Like
3

Hello again,

This is yotpo https://www.yotpo.com/

In this case I am trying to left align the UGC component title just above the footer on mobile on homepage -----> https://deadseadream.com/

It is incorrectly centre aligned on mobile, I cant however seem to find the CSS line in the shopify theme.css file,

If you know where it is would be much appreciated

Thanks!

1 Like
4

Thank you for the information. If you like to search and take out then you need to find this. Its been called to change in center on this screen size.

And this one its not in the theme.css. Its on the theme.liquid file.

Ribe_Dagandara_0-1692530952171.png
Ribe_Dagandara_0-1692530952171.png324Ă—104 2.9 KB

Or if you like we can over ride it using this code.

  • From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
  • Find the theme that you want to edit and click on “Actions” and then “Edit code”.
  • In the “Assets” folder, click on “base.css, style.css or theme.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
@media only screen and (max-width: 768px) {
.yotpo-slider-title-wrapper {
    text-align: left !important;
}
}

And Save.

i hope it help.

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

1 Like
5

Thank you so much,

Why was it in theme.liquid over the theme.css? Whats the difference?

1 Like
6

The theme.liquid is the is the main template file that serves as the backbone of your entire theme. It also have a liquid code and HTML. It called/load/rendered first when someone open your store. The code inside on the files will be read/rendered first before other parts othe site. When you put the style there you need a tag.

While the theme.css/base.css/style.css is like we called public files for styles to save.

On my side I dont like to pressure to much the theme.liquid to put all the css code there. The proper arrangement of the css codes are to put them on there proper css.file.

I hope it help.

1 Like
7

Thank you very much

1 Like