Custom CSS for Square Stores

Questions
1

Hi there is there any way I can have more customisation to the square store?

A custom code section for injecting CSS? There’s so much wrong with the existing framework this would be a great quality of life improvement

1 Like
2

:wave: Square sellers use Square Online to build eCommerce websites by choosing from a variety of built-in templates and features. Developers can create integrations and third-party applications that extend Square Online features and add custom functionality. Sellers can also add custom functionality to their sites through third-party applications.

Applications can use the Snippets API to add a snippet to a Square Online site. Snippets are scripts that can run as various site components (such as modals, pop ups, or background jobs) and offer a range of functionality. For example, a snippet can integrate with Square and external products or services, improve customer acquisition, engagement, and provide industry-specific or general tools that help businesses run more efficiently.

You should be aware of the following security considerations when working with snippets and the Snippets API:

  • Snippets integration must be approved for Square App Marketplace
    • Applications that integrate with the Snippets API must receive explicit approval from Square before they can be listed in the Square App Marketplace. Snippet applications that are submitted for approval are subject to a stringent review and vetting process.
  • Integration with the checkout flow is not supported
    • Snippets are injected at the end of the head element on all pages of the site, except for checkout pages. This reduces the risk that a snippet can access sensitive customer or payment information.
  • Session cookie is protected
  • Cookies are stored on the .square.site domain or on a custom domain, so the Square session cannot be accessed or hijacked.

Please note Square does not provide a sandbox eCommerce environment for testing calls to Square Online APIs. For information about testing in the production environment, see Test your application.

For more about the Snippets API, please visit our developer documentation.

3

I found a way to add custom CSS to Square.
It’s a bit of a workaround, but works pretty well (until we’ll hopefully get a real custom CSS field soon).

Here’s the tutorial on adding custom CSS to Square Online