View Single Post
Old 08-15-2017, 02:38 PM
Alex Flint's Avatar
Alex Flint Alex Flint is offline
Ecwid Team
Join Date: May 2017
Posts: 106


It's Alex Flint from Ecwid Team. I'm here to help you.

I changed title font in CSS - now it's set up for "Gruppo" font. Bbut when I reload the mainpage, there is old font visible for 1 second until it switchs to Gruppo font So I see some delay in responsive side of page. It there a way to prevent this?
Let me explain this behavior. When a website (for example, your Ecwid store) is loading, it takes some time for your browser to load all of the website's styles. To mitigate some of the risk of a slow font download, most browsers implement a timeout after which a fallback font will be used to display the text. The fallback fonts are described in the font-family property in CSS code after the intended one. For example, if I apply this CSS for texts in my website:

p {
    font-family: "Gruppo", Arial, cursive;
The following logic will work:

1. Browser tries to load the first font (Gruppo) from the list.
2. In case a font was not loaded during the timeout (or is not supported by the browser), it tries to use the next (fallback) font from the list (Arial). If this font is unavailable too, it tries the next one (from the cursive family)
3. If none of the fonts is available at the time, the browser uses the default font.
4. Once the intended font is loaded, the text is re-rendered with the intended font.

This is how browsers work. Though you can select, which font to load for the time intended one is loading, you can't disable this behavior. You can read more on the topic in the article on Font-family Property at w3schools.

on mobile device, the Gruppo font is not support at all. The font looks like Times New Roman
Some browsers don't support certain fonts. That's why it is important to describe fallback fonts in CSS when setting a custom font for some texts on your website. With fallback fonts listed in the font-family property, you will be able to control, which font is loaded in case a browser doesn't support the intended font.

When sharing shop using Share button in the upper right corner, a FB pop up sharing window appears (so far so good), but I cannot edit the content of FB post. FB is taking info from the website for preview and I would like to edit this so that once someone shares my shop, people will see a great description, title etc on FB post.
When someone shares a link to your store using the "Share" button (screenshot) on your starter site, Facebook takes your Starter Site's cover image (screenshot) and some texts from the store page, like the store name (screenshot) to generate the link preview.

You can edit your starter site's contents in your Ecwid Control Panel > Settings > General > Starter Site > Edit Starter Site
(screenshot). The changes will be reflected on the link preview, that Facebook generates for your store. However, you can't edit the preview contents manually — it is generated automatically.

Here are some useful links for you:

Hope I was helpful. If you have any other questions — feel free to ask.