Code Monkey home page Code Monkey logo

b2blecartupload's Introduction

[B2B LE Cart Upload]

Enable users to add items to their cart using a text list or a CSV file

Adding tens or hundreds of items to your cart is very time consuming. Even using the Quick Order widget requires many clicks to add just ten items. This component enables your users to add items to the cart with just a few clicks!

The B2B LE Cart Upload component enables users to add tens or hundreds of items to the cart with just a few clicks. Input can be in the form of a CSV file, or simply pasted into a text area within the component. The component verifies all items to be added using the product search API. Users can optionally check a box to ignore invalid SKUS during processing. Users can also optionally send a transcript of the upload results to their email address. The component also fully supports internationalization. You can add translations to the custom labels the component uses, so that all text within the component will be displayed in your user's local language.


Features

  • bulk loading Add up to 500 items to the cart from a CSV file or plain text
  • upload transcriptt Receive a transcript of your upload via email
  • internationalized Component is fully translatable into any language your store supports

Getting Started

Prerequisites

There are a few items you need to setup before installing:

  1. You will need to Enable Lightning Experience.
  2. You will need to Enable My Domain.

Install

Deploy the source:

  1. Clone this repository:
git clone [email protected]:sfdc-qbranch/B2BLECartUpload.git
cd B2BLECartUpload
  1. Authorize with your org and provide it with an alias (OrgAlias):
sfdx force:auth:web:login -a "OrgAlias"
  1. Push the app to your org:
sfdx force:source:deploy --sourcepath force-app/main/default --json --loglevel fatal --targetusername "OrgAlias"
  1. Open the default org:
sfdx force:org:open --targetusername "OrgAlias"

Configuration

Security Updates

Make the following changes to your store user profile, or include in a permission set:

Enable the following System Permissions:

  • Apex REST Services
  • API Enabled

Enable access to these Apex Class Access:

  • B2BAddToCartUtil
  • B2BCartUploadHelp
  • B2BProductEntitlementCheck
  • CartUploadController

Custom Settings

Under Setup – Custom Code – Custom Settings, click Manage for B2B Cart Upload Settings

Above Default Organization Level Value, click [New]

For the REST API Domain field, enter a value like this: https://pkgtest2-20200825-1313-dev-ed.my.salesforce.com

NOTE: you can locate the appropriate domain under Setup – User Interface – Domains. The one you want to use is “My Domain”.

Click [Save]. Your screen should now look similar to the one below:

Usage

Add the component to your store

After installing the component, open your store’s community in Experience Builder.

Click the drop-down to the right of the Home page.

Click [+ New Page]

Click [Standard Page]

Click [ + New Blank Page]

Click [Flexible Layout]

Click [Next]

In the New Page dialog, enter “Cart Upload” for the Name.

You can leave API Name blank.

Click [Create]

In the new page, click on the Components button. Scroll the list down until you see Custom Components

Drag the B2B Cart Upload component onto the page layout

Click [Publish] to save your changes.

Create a Menu Item for your new page

Within Experience Builder, select the Multi-level Navigation Menu component. The properties box will change to display those for that component

In the properties box, click [Edit Default Navigation]

Click [+ Add Menu Item]

A New menu item is added to the Menu Structure

Change the following values for the new menu item:

Name: Cart Upload Page: select your new Cart Upload page

Click [Save Menu] Click [Publish] to save your changes.


Supported Configuration Options

The component comes with several properties you can use to control how the component functions.

Component Title: the value in this property is displayed at the top of the component. You can change this to a different title if you like

Effective Account Id: this property is used to pass the current community user’s effective account id to the component. Changing this value is not recommended.

Managed content Id: if you have created help documentation in Salesforce CMS, enter the content Id into this property to make it accessible within the component.

For example, if the URL to the content record is this:

https://pkgtest2-20200825-1313-dev-ed.lightning.force.com/lightning/cms/spaces/0Zu4W000000TPx5SAG/content/20Y4W000000L2DbUAK/5OU4W000000L4BBWA0

The Managed Content Id value you would enter into the component property would be: 20Y4W000000L2DbUAK

Managed content type: enter “news”

Email results checkbox enabled: Check this property to enable the Email results processing option by default within the component

Show email results checkbox: Check this property to display the Email results checkbox in the component to store users.

Be sure to click [Publish] to save any property changes you make.


Internationalization

Custom Labels

The cart upload component fully supports internationalization. You can translate all of the labels and messages displayed by the component into all languages your store and community support. Just go into Setup - User Interface - Custom Labels, and translate the labels with the b2bcu namespace.

To make this task easier, you can create a new view of the custom labels that only include those from the b2bcu namespace:

Translating your Menu Item

You can translate your new menu item within the Translation Workbench. Go to Setup – User Interface – Translation Workbench – Translate. In the Select the filter criteria, select

  • Language: Select the language for the translation (i.e. Spanish)
  • Setup Component: Navigation Menu Item
  • Expand the navigation until you see your new menu item:

Hover over the Navigation Menu Item Name Translation cell until the pencil icon appears

Double-click on the pencil. Enter your translation into the cell

Hit the ENTER key to record your translation

Click [Save] to save the translation

NOTE: it may take several hours for your translation to appear in the community.


Documentation

Read this document for external documentation on the component.

FAQs

Does it work in Communities?

Yes

Does it work in Mobile?

Yes

Does it work with Person Accounts?

No

Others?

See the list of Contributors who participated in this project.

If you would like to join these awesome people, please refer to contributing.md for guidelines.

History

  • 1.1.2-1
    • Initial release of managed package

Acknowledgements

Special thanks to:

  • Clay Phillips
  • Anand Subbiah
  • Steve Ecker
  • Brooks Haines
  • Jason Illg

License

License Copyright © 2021 Salesforce

b2blecartupload's People

Contributors

tepp0f3l avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.