Add Your Store to Facebook

FAQ

Change the username for my Facebook page

When a page has a unique username, the link to it looks more user-friendly. Besides, when customers see the name of the store in the web address, they trust it more than when they see a link that includes a combination of numbers.

To change the username of the page where you added your Ecwid store, you have to be an admin of this page. Please mind that according to Facebook rules, you can change the name of your page only once, so please be careful when choosing it.

To change your page's username:

1. Go to facebook.com/username.

2. Below Create your Facebook web address, select a page from the dropdown menu.

3. Type a username and click Check Availability.

4. If the username is available, click Confirm.

Read more about changing Facebook page's username here https://www.facebook.com/help/203523569682738

Rename "Products" tab and change the tab image

You can easily do this in your Facebook page settings:

1. Open your page and click "Settings" link on the top.

2. Click "APPS" link in the left column and click "Edit Settings" link near Ecwid logo.

3. Enter a new name in "Custom tab name" field. Click "Change" link next to "Custom Tab Image" field to upload your own tab image (Use 111 x 74 pixels image to avoid image resizing).
   
   

4. Click OK.

Change my Facebook store settings or connect a different store to my Facebook page

Please, perform the following steps:

1. Open your Facebook stores list: apps.facebook.com/ecwid-shop/

2. Click "Settings" link on the opposite of the corresponding Facebook store.

3. Change the settings as you need and click "Save".

I'm getting "You must have permission to add apps to at least one Facebook Page" error

This error means that you don't have any Facebook page, where Ecwid can be added yet. Unfortunately Facebook doesn't allow adding applications to personal profiles anymore. So if you want to have an application tab with your products, which are linked to your FB store, it is necessary to create a new official FB page (they are also called "fan pages").

You can create it here: www.facebook.com/pages/create.php Then open the app and try to add it to the page again. Pages manual: http://www.box.net/shared/9e5jiyl843

You can view and manage your FB pages here: www.facebook.com/pages/manage/
More about pages: www.facebook.com/help/?topic=pages

I get the "This application is already installed for all applicable pages" error

This error means that you've already added Ecwid app to all your Facebook pages. In this case you can create new page here:  www.facebook.com/pages/create.php or check the list of pages, where Ecwid was added:apps.facebook.com/ecwid-shop/, probably, store was already added to required page.

Change the look of my Facebook store

Yes, you can.  Use the app's settings to disable/enable widgets and change the number of products per page.

Use Ecwid's custom CSS themes to change the look of your store elements.

If you want to customize the look of your store completely but the tools described above are not enough (for example, to add an HTML header, some links, etc) it is still possible by creating your own Facebook application.

The main difference between the Ewcid application and your own one is as follows:

• the Ewcid app has deeper integration with Facebook. For example, your customers log in using their FB accounts automatically. Also it allows adding the "Products" tab to FB pages with store products and links to your main FB app.

• your own app may have less features and will not be able to create such tabs automatically.  However, you will have full control over your app and its statistics. Also, you will be able to create a custom tab to link your profile to a store.
   

Do my customers need to allow any permissions to checkout in the Ecwid Facebook store?

No. Customers don't have to allow any Facebook permissions to check out in the app.  How it works:

• Customers can freely browse your catalog and add products to the bag without asking for any permissions. They can even be logged out from Facebook. 

• When a customer decides to place an order and presses the "Checkout" button, the Ecwid app will request for the permission to access the basic information, email and current location of a Facebook account of this customer. This step is completely optional. So if the customer presses "Don't allow" button and doesn't grant the b to the app, he/she will still be able to check out and complete the order.
   

Ecwid asks for optional information to make the checkout process easier and smoother for customer. How the permissions are used (if a customer decides to give Ecwid this info):

• Access my basic information: Ecwid gets the customer's Facebook ID and name to register a profile in your Ecwid store for this customer and logs customer in automatically. 

• Send me email: Customer's e-mail address is also used for the profile creation. 

• Current location: Ecwid also gets customer's country in order to correctly determine customer's country and show it as pre-filled in the shipping address during checkout on Facebook. Pretty useful.
   

Ecwid doesn't use, get or store any other information. How to check this:

• Log in to your FB account and open the "Privacy Settings" page.

• Click the "Edit Settings" link in the "Ads, Apps and Websites" section

• Click the name of the app and you will see what permissions you have granted to it and what information the app has asked for from Facebook.

From our experience, requesting for the permissions to user's data may adversely affect the conversion rates. Some Facebook users just don't entrust their information to 3d-party apps. We don't want you to lose your customers and sales, so in the Ecwid app, the permissions are always optional. Customer can check out without granting any permissions to our Facebook app.

What information does Ecwid use from my Facebook account, when I set up your Facebook app?

If you want to add your Ecwid store to your Facebook page using the e-commerce Facebook application, you will be asked to grant the following permissions:

• Access my basic information: Ecwid needs access to your public info, which is used to retrieve your Facebook user ID, so that it could be associated with your Ecwid store.

• Send me email" and "Current location: these permissions are necessary to create customers profiles in your Ecwid store.  Your usual customers are not required to grant these permissions to checkout in your store. They're optional for them.

• Manage my pages: Ecwid uses these permissions to get a list of Facebook pages that you administer. This information is necessary for you could add a store to your Facebook pages later. Ecwid only gets the pages list, it doesn't modify any settings and it doesn't request for any other info.

Ecwid doesn't use, get or store any other information. How to check this: 

• Log in to your FB account and open the "Privacy Settings" page.

• Click the "Edit Settings" link in the "Ads, Apps and Websites" section

• Click the name of the app and you will see what permissions you have granted to it and what information the app has asked for from Facebook.

Why does your app need the "Manage my pages" permissions, when I'm setting up Facebook store?

Ecwid needs the "Manage my pages" permission to get a list of Facebook pages where you are the admin. This list will be used to determine if you're allowed to manage the settings of the store assigned to the Facebook page.  The only way to get this information is to request the "Manage my pages" permission from you. This is a Facebook requirement.

Ecwid uses this permission to get the list of the pages only. We will not change any settings of your page or post anything there. 

How can I link to a specific product or a category of my Facebook shop?

If you open the Facebook store, go to any category, copy a link from the browser's address bar and open it in a different window, the main store page will be opened instead of the necessary category page. It happens because of specific Facebook application platform: Applications in tab (linked with your page) are deployed in iFrames. The object inside the frame is not anyhow influenced by outside elements. This is a secure way of site structure, yet it has a limitation: the URL is not dynamically changed when you browse the pages. That's why on any store page you have one and the same URL in your browser address bar, opening your store home page.

There is a quick workaround, though. It is still necessary to get direct links to certain store pages (cart page, product, category pages, etc). For example, when customers like a product, the system needs to lead users to this very product page. We realized this possibility, that you can use yourself in order to obtain direct product or category pages.

You should use these special links:

http://LINK_TO_YOUR_FB_STORE?app_data=!/~/product/id%3dPRODUCT_ID - the link will open the product page


http://LINK_TO_YOUR_FB_STORE?app_data=!/~/category/id%3dCATEGORY_ID - this link will open the category page

where:

• http://LINK_TO_YOUR_FB_STORE — link to your FB store, it looks like https://www.facebook.com/ecwid/app_251458316228 

• CATEGORY_ID — id of the category, you want to open. How to get it

• PRODUCT_ID — id of the product, you want to open. How to get it

Examples:

• https://www.facebook.com/ecwid/app_251458316228?app_data=!/~/product/id%3d5002 

• https://www.facebook.com/ecwid/app_251458316228?app_data=!/~/category/id%3d3002

Can I assign an application Facebook tab to my personal profile?

No. Unfortunately Facebook doesn't allow adding application tabs to user profiles anymore: developers.facebook.com/blog/post/415

How can I apply CSS changes only to my store on Facebook and keep another design on the site?

If you want some CSS rules in your custom CSS theme to be applied only to your Facebook application, but not other storefronts, you should specify it directly in your CSS code. For that just add thediv.ecwid_facebook_app prefix to the necessary CSS rules. For example, the following code will change the store's background color to white only in the Facebook app: 

div.ecwid_facebook_app div.ecwid-productBrowser {
background-color: #fff;
}

Such changes will be applied to both your tab and your main Ecwid app canvas in Facebook. If you want to apply them only to the tab, but not the main canvas, you should use the div.ecwid_facebook_app_tab selector instead of div.ecwid_facebook_app. For example, the following CSS code will change the font size for prices in the product browser in the Facebook tab only:

div.ecwid_facebook_app_tab div.ecwid-productBrowser-price { font-size: 18px; }

Since you can install your Ecwid store on several FB pages, you may be interested in making a different look for different pages. For that specify a necessary CSS rule with a selector like ecwid_facebook_page_<pageID>, where pageID is internal FB identificator of the page. Look through the HTML source of the FB page where your Ecwid store is installed. You will see there that Ecwid store elements are wrapped by div element which look like this:

<div class="ecwid_facebook_app_tab ecwid_facebook_page_333446166671723 ecwid_facebook_app" …>

The class starting with ecwid_facebook_page_ specifies the page. Use it to makeup your custom CSS rules for this page. For example, the following CSS code will change the color of the product names in the product browser to green (this will affect only Ecwid elements on the Facebook page 333446166671723):

div.ecwid_facebook_page_333446166671723 div.ecwid-productBrowser-productNameLink {
color: green;
}

When I add my store to Facebook, it doesn’t look good and the text isn’t readable. How to fix?

At the moment your Facebook application and the main Ecwid store use the same CSS styles, i.e. the same colors, images, etc. All the changes you apply to your store using Ecwid custom CSS themes, will be applied to your Facebook app as well.

It might cause troubles if your main site background isn't white and you changed the store's colors, text and other elements with help of your custom CSS codes.

Since the Facebook app background is white by default, your store will not look good in this case.

You can simply change the background of your FB app by applying this CSS code to your custom Ecwid theme(replace “black” with any color your want):

div.ecwid_facebook_app {
background-color:black;
}

You can use the same trick, if you want to add some CSS changes to your FB app only. Just add thediv#outer prefix before your CSS selectors, for example:

.ecwid_facebook_app <necessary CSS selectors> {
#somecode
}

Categories menu width is too big, category names are not visible and minicart overlaps them. How to fix it?

If there are many categories they may not fit in the tab page width. In this case you can reduce the space occupied by the categories in the following ways: 

1. Decrease the number of the root categories 

2. Make the font size of the horizontal categories smaller by means of this CSS modification (how to use it):

   /* root categories, first level category links */ 
   div.ecwid_facebook_app span.ecwid-categories-category { 
   font-size:16px !important;
   }
   /* subcategories, second level category links */ 
   div.ecwid_facebook_app div.ecwid-categoriesMenuBar span.ecwid-categories-category {
   font-size:14px !important; 
   } 
   /* 3rd, 4th, etc level category links */ 
   div.ecwid_facebook_app div.ecwid-categories-MenuBarPopup 
   div.ecwid-categoriesMenuBar span.ecwid-categories-category { 
   font-size:13px !important; 
   }

    

3. Disable the "Horizontal categories" widget completely in the FB store settings:

• Go to the Ecwid app settings on Facebook (https://apps.facebook.com/ecwid-shop/) and click the "Settings" menu next to the Ecwid app.

• In "Categories menu widget" select Hide

• Click Save

I want to apply Javascript modification to my Ecwid store on Facebook. Where should I put the modification code?

To add a Javascript modification (e.g.

or any other modification) to your store of Facebook, please, open 

 page and proceed to the "Settings" page. Add the code to the "Advanced settings" text field and click "Save".

Why my customers can't find my Facebook shop from mobiles? 

Ecwid is designed to work on any platform. Ecwid supports responsive layout that allows Ecwid shops to adapt to different screens. More details in this forum thread: http://www.ecwid.com/forums/showthread.php?p=81342#post81342

Basically Ecwid application for Facebook is able to work on mobile devices. Your Facebook store is viewed normally and can be accessed from mobiles.

However, Facebook has certain restrictions hindering the work of applications on mobiles, and it impacts all Facebook apps, not only Ecwid.

1. When users open your Facebook page from mobiles, they do not see the 'Shop' link.
This is a limitation of Facebook: links to 3rd party applications (i.e., those developed not by Facebook) are not shown on the Pages from mobiles. It affects all applications, not just Ecwid.

So when you access Facebook page from a mobile (and Facebook considers iPhones, iPads and Android  tablets as mobile devices), you will not see a link to your Ecwid shop. Furthermore, if you try to open Ecwid store on Facebook in a mobile browser, it will display page not found error.

At present it is technically not possible to display standard Facebook tab applications on mobiles. We have to live with this restriction until Facebook changes it. Therefore, unfortunately we don't have a mobile version of the Ecwid Facebook app. Yet, we can offer you ways to work this around, see below.

2. One more restriction relates to relations between Facebook and Apple:
"Add to bag" button isn't shown on mobile catalogs if opened in mobile Facebook application for iOS.  This is a forced measure that we had to take due to the following Facebook restriction.

According to the Facebook policy:

If you’re using iOS to run your app, use an iOS approved payment method.

Facebook contacted us with this regard and requested to disable all payment methods in Ecwid application, otherwise the application would be closed.

In order to keep the Ecwid app running on thousands of Facebook pages, as a way to work this around we had to remove 'Add to Bag' button from the mobile catalog when it's viewed from mobile Facebook app on iOS.

Regrettably, it doesn't appear possible to sell anything in mobile Facebook iOS app unless items are sold within online Apple store.

Despite of these restrictions, from the very beginning we've been trying to locate and implement any solution that would help selling from mobiles, since mobile commerce is growing together with Facebook popularity.

For now we offer the following ways to provide a mobile store:

1. To use your starter site available at link http://store[store id].ecwid.com/ as a mobile version of your store. Note that you can choose to show it under another domain. Check out this article for details: Starter Site

2. To use your own website with Ecwid

In order to use the 1st and 2nd variants, you should  make sure to enable responsive layout for your Ecwid store in Ecwid control panel → Settings → General → Migrations.

Ecwid supports responsive design meaning that your store pages can be adapted dynamically to any screen. So website and Starter Site (for those who don't have website yet) would be the best solutions.

You should put a link to either of these resources on your Facebook page and write down a warning that users, who're viewing the page from mobiles, need to follow this very link to buy. You can insert it on the page wall or in "About us" section.

Otherwise you can use Facebook call-to-action "Shop Now" button as follows:
1) Get your Starter Site link by going in your Ecwid control panel to Settings > General > Starter Site and copy the link below "Your starter site".
2) Go to your Facebook page and click on the "Call to Action" button,
- click on "Edit call to action",
- choose "Shop Now" Button,
- under "Website" add the Starter Site link and click on "Create".

Why does the app settings page in Facebook display warning message?

If you are logged in to Facebook as page and not as a person, the page with the app settings (

) shows this message:

Please try refreshing the page or closing and re-opening your browser window.