Changing font size within the JavaScript container of an embedded shop

Hi there! Does anyone have any idea how to modify the font size of an embedded shop in the JavaScript container, itself? Spreadshirt’s help files say it can be done. I’m sure it’s just a small line of coding to add to fix the issue but I’m not savvy about JavaScript language. The internet searches didn’t return any satisfactory solution to this issue, other than partial code that I didn’t know what to do with.

My website is on a service similar to Wix, so I don’t have the ability to create a .css file or even make more complex changes in the head section of the page. It’s a very small inconvenience compared to dealing with Wordpress which took up all my time with maintenance and I never want to use again.

If not, I’m also open to suggestions for the other options as well, such as body tag or a div enveloping the container. However, I need coding that would apply to my hosting limitations. Any help will be greatly appreciated. Thanks!

It is possible to override the base font-size but we strongly advice against this. If you decrease the size, already small texts will become unreadable, if you increase it, it will almost certainly break the layout on smaller devices. What you should do instead is write CSS rules that target specific elements you’d like to change. You don’t have to add the CSS anywhere on your page, you can just use the “Edit Shop CSS” textarea in your Shop Settings under “Advanced”. Hope this helps :slight_smile:

Thank you very much for your reply! I will follow your advice right now. :slight_smile: It might be just that the website builder I’m using modifies the font size. Unfortunately, when embedded in my website, the font becomes way to small small, to the point where it puts a strain on the eyes. And, in this case, it won’t retain any buyers. It’s too small even for mobiles.

If worst comes the worst, what do you think about using iframes? I tried that and the font displays fine. However, would I still get any SEO benefits, if I enter my own domain in the store settings?

UPDATE: I used the following code to increase the font:

div {
font-size: 1.1em;
}
div font {
font-size: inherit;
}

It worked but only on the Spreadshop site and not on mine. That’s why I think that I either need a certain code for a div wrapping the container or better something to modify the text size, from the container itself. Probably there’s a conflict between the builder or the template that I’m using and the JavaScript. I’ll test with more templates and see what happens.

2nd UPDATE: Disregard the previous reply. It worked, actually. I just had to clean the cookies. Thank you! Thank you! Thank you! :smiley::smiley::smiley:

Here it is: https://fabart.ist

Still under construction though…

2 Likes