Disclaimer: This website requires Please enable JavaScript in your browser settings for the best experience.

Dev GuideAPI Reference
Dev GuideAPI ReferenceUser GuideGitHubDev CommunityOptimizely AcademySubmit a ticketLog In
Dev Guide

Customize the 3DS challenge window

How to customize the 3DS challenge window for Optimizely Configured Commerce's Payment Service.

You can provide styling for the 3DS challenge window when you use Payment Service with Optimizely Configured Commerce. If you do not provide customized styling, Payment Service uses the default styling.

Example

Without custom styles (current usage continues to work):

const isSpreedlyLoaded = useSpreedlyFrame();

With custom styles

const isSpreedlyLoaded = useSpreedlyFrame({
    fitToModal:  width: 600px; height: 700px; border: 2px solid #333; background: #f5f5f5; border-radius: 8px;
});