Integrating third-party services can extend the functionality of your SuiteCommerce site. Whether it’s for payment processing, marketing, or analytics, here’s a guide on how to integrate these services seamlessly. Identify Integration Points: Determine where and how the third-party service will interact with your SuiteCommerce site. Common integration points include checkout, product pages, and user accounts.… Continue reading Integrating Third-Party Services with SuiteCommerce
Author: Ittymathew Paul
Avoid Multiple iOS Datepicker.
When working with date fields on a website, encountering multiple popups can be frustrating for users, especially on iOS devices where the native date picker and a jQuery date picker might both appear. To address this issue, you can take several steps to ensure only one date picker is shown: On iOS devices, the native… Continue reading Avoid Multiple iOS Datepicker.
DNS Status
Message Type: Informational Cause: Your DNS record is configured correctly. Action: No action required. Message Type: Error Cause: Your DNS record is configured incorrectly. Action: Ensure that you are using the correct CNAME for the domain in the DNS record. See “Point Your Domain Name at Your Domain (DNS Settings)” for more information. Message Type:… Continue reading DNS Status
Multi Select In CSV Import
In Advanced option we have option for adding a single character to be used as a custom delimeter for multi-select fields, instead of the pipe (|). Field: CUSTOM MULTI-SELECT VALUE DELIMITER
ERROR: Sorry, we couldn´t find any products. on Product List Page
This happens when our Facet URL Components contain special characters (e.g. *, ~, space ). for that, we can fix it by Navigate to Commerce > Marketing > URL Components for Facets Ensure that the URL Component includes characters that are not valid. Note: Only dashes (-), underscores (_), and alphanumeric values are supported.
Patch: Customers are not directed to the payment review page
Step 1: Create the Override File file: /Modules/extensions/OrderWizard.Module.PaymentMethod@1.0.0/JavaScript/OrderWizard.Module.PaymentMethod.Selector.js In the OrderWizard.Module.PaymentMethod.Selector.js file, in the setModuleByType() method, find the following code: if (!this.selectedModule) { this.selectedModule = _.first(this.modules); } replace it with the following code: if (!this.selectedModule) { this.selectedModule = _.findWhere(this.modules, { isActive: true }); } In the render() method of the same file, find the following… Continue reading Patch: Customers are not directed to the payment review page
Idle timer in React
Inside your React project directory, install IdleTimer npm i react-idle-timer In the below example when the user id idle for 10 sec it will fall to idle state, in other times it will be in active state import { useEffect, useState } from ‘react’ import { useIdleTimer } from ‘react-idle-timer’ import ‘./styles.css’ export default function… Continue reading Idle timer in React
Session Time Out In Firebase
Session Time Out In Firebase using idle timer, When the user is idle for 20 min we will be logging out the customer. The sample Code is provided below import { useEffect, useState } from ‘react’ import { auth } from “../../firebase”; import { useIdleTimer } from ‘react-idle-timer’ export default function AuthCheck() { … Continue reading Session Time Out In Firebase
Subscription Plans with Subscription Billing
To create a subscription plan: 1. Navigate to Lists > Subscriptions > Subscription Plans > New. 2. Enter a name in the Subscription Plan Name field. 3. Choose a term from the Initial Term list: – Evergreen Term: Revenue ends after three years unless optional invoicing preferences are set to automatically extend revenue recognition. … Continue reading Subscription Plans with Subscription Billing
SCSS SCA Style Guide
Use the SCSS as given Below //**Paste the following code into the Sass file for the page that you would like to display the Style Guide on**// //Color classes for style table .sc-color-primary-cell { background-color: $sc-color-primary; text-align: center; } .sc-color-secondary-cell { background-color: $sc-color-secondary; text-align: center; } .sc-neutral-shade-cell { background-color: $sc-neutral-shade; text-align: center; } .sc-neutral-shade-700-cell {… Continue reading SCSS SCA Style Guide