question

nimna-fernando avatar image
nimna-fernando asked gd213 answered

Is there a way to modify placeholder values in Hosted IFrames?

I am currently working on a project involving Clover IFrames, and I have encountered a couple of challenges.

  1. Updating Clover IFrames' Placeholder Values: Is there a recommended method for updating the placeholder values within Clover IFrames? I'm looking for a way to dynamically modify these values.

  2. Changing Text on Clover Payment Form: I am also interested in changing the language of the text displayed on the Clover payment form. Specifically, I would like to know if there is a way to customize or update the text to better suit the language requirements of my project.

Any you can provide on these matters would be immensely helpful. Thank you in advance for your assistance.

Payments
10 |2000
Toggle Comment visibility. Current Visibility: Viewable by all users

Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.

2 Answers

·
bryanvargas avatar image
bryanvargas answered

Hey currently this is not support but our engineers would be looking into this. I would recommend making a custom div header/section before each input field and add your custom text there in the meantime.

10 |2000
Toggle Comment visibility. Current Visibility: Viewable by all users

Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.

gd213 avatar image
gd213 answered

If you do add a custom header as mentioned above you can hide the placeholder text using this.

const styles = {
  body: {
    fontFamily: 'Roboto, Open Sans, sans-serif',
    fontSize: '16px',
  },
  input: {
    fontSize: '16px'
  },
  'input::-webkit-input-placeholder': {
   color: 'transparent'
  },
  'input::-moz-placeholder': { 
   color: 'transparent'
  },

  'input::-moz-placeholder': {  
     color: 'transparent'
  },

  'input::-ms-input-placeholder': {  
     color: 'transparent'
  },
};

const cardNumber = elements.create('CARD_NUMBER', styles);
10 |2000
Toggle Comment visibility. Current Visibility: Viewable by all users

Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.

Write an Answer

Hint: Notify or tag a user in this post by typing @username.

Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.

Welcome to the
Clover Developer Community