[Solved] TinyMCE in Blocks do not show image icon / functionality

[herr rilke]

Hello everyone,
I have the following fields: a TinyMCE and an image field. But when I select an image, I can't insert it into TinyMCE.
What do I have to do to make this work?

and (additional question): Tiny loads very slowly, it feels like 5 seconds after the rest of the editing mask is already displayed.

 

  public function migrate()
  {
    $rm = $this->rockmigrations();
    $rm->migrate([
      'fields' => [
        self::field_text => [
          'type' => 'textarea',
          'inputfieldClass' => 'InputfieldTinyMCE',
          'contentType' => FieldtypeTextarea::contentTypeHTML,
          'label' => 'Text',
          'rows' => 10,
          'icon' => 'align-left',
          'inlineMode' => false,
          // 'rpb-nolabel' => true, // hide label in backend
          // 'settingsFile' => '/site/modules/RockMigrations/TinyMCE/text.json',
          'settingsFile' => '/site/modules/RockMigrations/TinyMCE/full.json',
          'textformatters' => [
            'TextformatterRockFrontend',
          ],
        ],

        self::field_image => [
          'type' => 'image',
          'label' => 'Bild',
          'maxFiles' => 1,
          'descriptionRows' => 0,
          'extensions' => 'jpg jpeg gif png svg',
          'maxSize' => 6, // max 6 megapixels
          'okExtensions' => ['svg'],
          'descriptionRows' => 1,
          'icon' => 'picture-o',
          'outputFormat' => FieldtypeFile::outputFormatSingle,
          'gridMode' => 'list', // grid, left, list
          'required' => false,
        ],


      ],
      'templates' => [
        $this->getTplName() => [
          'fields' => [
            RockPageBuilder::field_eyebrow,
            'title' => [
              'label' => 'Headline',
              'icon' => 'header',
            ],
            self::field_text,
            self::field_image,
          ],
        ],
      ],
    ]);
  }

any help would be highly appreciated.

 

[bernhard]

Could you please describe what you are trying to achieve?

[herr rilke]

mh,
isn't it the case in regular WYSIWYG modules outside of RPB that I can upload images that I can then select in the editor and place inside editor's text?

[herr rilke]

mh, was I able to explain it halfway so that you understand what I'm trying to do @bernhard

Or do you not add pictures like that anymore?

[bernhard]

Sorry, I still don't understand. But I do not let my clients add any pictures inside TinyMCE fields, true. When I need Image + Text for example, then I create a block Image + Text with one image field and one text field.

[herr rilke]

ok, try my best:

i have two fields:

after uploading i am able to click the image icon in the editor:

 

even edit the image:

 

 

 

and paste it into the text.

but of course i understand your approach as well.

so i go and do it your way 😉 

 

[bernhard]

Thx for the explanation!

A huge motivation of RPB was to get rid of the workflow that you show here, because in TinyMCE you have no control over how large your image is, what the final aspect ratio will be, etc, etc.

That can lead to severe design issues, for example because clients make it look nice on desktop, but they forget to think about all other screen resolutions.

With RockPageBuilder we as developers/designers take care of that and the client just uploads content and provides the text.

It's still not an easy to solve problem sometimes, but imho it's the better approach.

[herr rilke]

Thank you Bernhard for clarifying your point of view again in such detail.
Ultimately, you are of course right and many editors actually no longer allow the insertion of images. When I sometimes look at the output, I understand exactly why 🙂

In this project I will have to administer large parts myself, therefore it could have been a short cut.
but then and for now - I'll have to do it "right" from the start. Since I can reuse the blocks, it will probably pay off