I'm trying to use the "naked" skin in TinyMCE by following the documentation: TinyMCE - Naked. While other configurations like the toolbar, menubar, and plugins are working fine, the skin seems to have no effect on the appearance of the editor. It looks like the default skin is being applied instead.
Here’s the code I’m using (note: [myapikey] is replaced with my actual API key):
<!doctype html>
<html lang="en" data-bs-theme="dark">
<head>
<script src="/1/[myapikey]/tinymce/7/tinymce.min.js" referrerpolicy="origin"></script>
<style>
.custom-editor-wrapper {
border: 1px solid #ccc;
padding: 4px;
margin: 1rem;
max-width: 640px;
border-radius: 4px;
box-shadow: 0 3px 0px -1px rgba(0, 0, 0, .05);
}
</style>
</head>
<body>
<div class="custom-editor-wrapper">
<textarea id="premiumskinsandicons-naked"></textarea>
</div>
<script type="text/javascript">
tinymce.init({
selector: 'textarea#premiumskinsandicons-naked',
skin: 'naked',
icons: 'small',
toolbar_location: 'bottom',
plugins: 'lists code table codesample link',
toolbar: 'blocks | bold italic underline strikethrough bullist link codesample',
menubar: false,
statusbar: false
});
</script>
</body>
</html>
Expected UI (from TinyMCE documentation) Actual UI (from my code)