You can change the text with the help of UPLOADCARE_LOCALE_TRANSLATIONSglobal variable.
<script>
UPLOADCARE_LOCALE_TRANSLATIONS = {
buttons: {
choose: {
files: {
one: 'Upload your CV',
other: 'Upload your documents '
},
images: {
one: 'Upload your photo',
other: 'Upload your photos'
}
}
}
};
</script>
Tweak the files object to put a custom text in a single or multiple widget buttons. Note that the images object will overshadow files if images-only attribute is set for a widget.
@ms1 the text on the widget button depends on the images-only widget option. If it’s enabled, you’ll see the “Choose an image” text. You can replace this text with your own via locale translation. The code from the example should be placed on your webpage.
Hi @Bradley_Hoersten, the above instructions are for uploadcare-widget (jQuery widget). If you’re using the new uploader (Blocks), see here to learn how to change the text on the main button and other text elements in the uploader’s UI: File Uploader localization.
I made those changes. It still says “file upload”. Whats wrong with my code?
</script>
<script type="module">
import * as LR from "https://cdn.jsdelivr.net/npm/@uploadcare/blocks@0.35.2/web/lr-file-uploader-regular.min.js";
LR.registerBlocks(LR);
</script>
<style>
.my-config {
--darkmode: 0;
--h-accent: 223;
--s-accent: 100%;
--l-accent: 61%;
}
/* Customizing widget text for various actions */
:root {
--l10n-upload-file: 'Carregar ficheiro'; /* Text for uploading a single file */
--l10n-upload-files: 'Carregar ficheiros'; /* Text for uploading multiple files */
--l10n-choose-file: 'Escolher ficheiro'; /* Text for choosing a single file */
--l10n-choose-files: 'Escolher ficheiros'; /* Text for choosing multiple files */
}
</style>
<lr-config
ctx-name="my-uploader"
pubkey="[mykey]"
max-local-file-size-bytes="1000000000"
img-only="true"
></lr-config>
<lr-file-uploader-minimal
css-src="https://cdn.jsdelivr.net/npm/@uploadcare/blocks@0.35.2/web/lr-file-uploader-minimal.min.css"
ctx-name="my-uploader"
class="my-config"
>
</lr-file-uploader-minimal>
I also tried this:
</script>
<script type="module">
import * as LR from "https://cdn.jsdelivr.net/npm/@uploadcare/blocks@0.35.2/web/lr-file-uploader-regular.min.js";
LR.registerBlocks(LR);
</script>
<style>
.my-config {
--darkmode: 0;
--h-accent: 223;
--s-accent: 100%;
--l-accent: 61%;
}
/* Override for specific localization */
.my-locale-override {
--l10n-upload-files: 'Choose your documents';
}
</style>
<lr-config
ctx-name="my-uploader"
pubkey="[mykey]"
max-local-file-size-bytes="1000000000"
img-only="true"
image-shrink="IonicToggle C is checked:formatted as text" remove-copyright="true"
></lr-config>
<lr-file-uploader-minimal
css-src="https://cdn.jsdelivr.net/npm/@uploadcare/blocks@0.35.2/web/lr-file-uploader-minimal.min.css"
ctx-name="my-uploader"
class="my-config"
>
</lr-file-uploader-minimal>```
Neither works. As you can see I am using the minimal uploader. I just want to change the default "Choose File" text to something like "Tap to add images"
