Community Impact

• cardStyle - “image” or “icon”
• brandName - Your brand or store’s name
• apiKey - Your Beam SDK API Key
• chainId - Your Beam Chain Id
• storeId - Your Beam Store Id
• baseUrl - This value can remain unchanged, unless you are specifically using Beam’s Staging environment
• lang - Beam supports changing the displayed language based on a lang parameter passed into the widgets. If your site supports multiple languages, this value should be updated based on any existing language detection method available in the site. The supported values for this property can be found in the Beam Supported Languages documentation.

  <script
    type="module"
    async
    crossorigin
    data-em-disable
    data-categories="analytics"
    src="https://sdk.beamimpact.com/web-sdk/{{ sdk_version }}/dist/components/community-impact.esm.js"
  ></script>

  <!-- BEAM START -->
  <div class="beam-sync-visibility" data-beam-widget="community-impact">
    <h2>The {{ brandName }} Community's Impact</h2>

    <p>
      1% of every {{ brandName }} purchase is donated to a nonprofit of your choice.<br />
      Check out the impact the {{ brandName }} community is making below.
    </p>

    <beam-community-impact
      apiKey="{{ storefront_component_api_key }}"
      chainId="{{ chain_id }}"
      storeId="{{ store_id }}"
      baseUrl="{{ base_url }}"
      lang="en"
      cardStyle="image"
    ></beam-community-impact>
  </div>
  <!--BEAM END -->