---
title: "Setup complex CKEditor AI Assistants"
video_id: PmChGwzilck
url: https://www.youtube.com/watch?v=PmChGwzilck
workflow_page: https://workflows-of-ai.com/workflow/setup-complex-ckeditor-ai-assistants
language: en
captions: generated
---

0:00 hey guys Marcus here I'm going to show
0:02 you something really cool today so what
0:04 we're going to do is inside the C editor
0:06 we're going to create our own
0:08 custombuilt
0:09 assistance for our specific business
0:12 case that can have really complex
0:15 workflows behind
0:16 them and this might sound super complex
0:20 right but no we're going to build them
0:22 in less than 10 minutes per assistant
0:24 and we're not going to write a single
0:26 line of code so uh for the
0:30 made up business case I'm going to show
0:33 case what I have set up first here uh so
0:37 I am now a a travel
0:40 blogger but I don't remember much of the
0:44 places I go to but I take a lot of
0:45 photos right uh and something I'm really
0:49 bad at is that oh I forgot to click the
0:52 alt text there so and I might not even
0:56 remember what this is so I could
0:57 describe it myself but instead I just
1:00 click on the image take the AI assistant
1:02 and CK editor all takes from
1:04 image uh and this is automatically added
1:08 as a context in this assistant I just
1:10 click generate this will regenerate the
1:13 same image uh but then with an actual
1:17 alt text so if we click Source now you
1:20 can see it has an actual alt text
1:23 here the second problem I have now is
1:26 that I don't really remember what this
1:29 place was
1:31 uh
1:33 so
1:36 um it is like I I think the real place
1:39 is called p p sh so I don't pronounce
1:44 that correctly sorry for the French
1:45 people
1:47 uh but I might not know this so what I
1:50 have added then is another assistant
1:52 that just gets the actual address from
1:55 the image and how this works is
1:58 that because AI can hallucinate so you
2:01 should never really trust anything AI uh
2:04 uh gives you as an answer you should
2:07 either give it a lot of context
2:10 before uh because it's very good at
2:13 handling truth within the context but
2:16 you can also do uh post checking and
2:19 that's what happening in this case so
2:22 what we're doing here asking the AI look
2:24 at this image uh and figure out what
2:26 this is but then we're using Google
2:28 Places to actually verify this is a real
2:31 place that ex does exist and we get the
2:34 real address from this so uh if we
2:38 scroll down here all of a sudden we have
2:41 the real address so this is the actual
2:43 address of this place uh but now stupid
2:48 as I am I don't really know anything
2:50 about this place and I want to know more
2:52 I want to write a little summary so I
2:54 have created another assistant for this
2:56 so this is get summary from address so
2:59 this specific Ty L takes HTML of a
3:01 address what this does once again you
3:04 should not trust open AI or anthropic or
3:07 someone's uh uh content about this this
3:10 actually goes and Googles this and
3:14 asking for like where can I find
3:16 information about that goes into the uh
3:20 those web pages scrapes that content and
3:23 summarizes this so this becomes
3:25 something
3:26 trustworthy and if we save then you can
3:29 see yeah we have a a a summary of it
3:35 last thing is we thought about
3:37 accessibility for uh uh you know for uh
3:42 uh people that needs all text same thing
3:45 they might actually need a audio version
3:47 of this text so we just mark this click
3:51 audio accessibility click generate and
3:54 this will now generate an actual uh uh
4:00 uh actual audio file of this talking and
4:03 saying this but since it's a CK editor
4:05 it's going to generate this as an audio
4:08 player that we can use right away to
4:11 listen to
4:13 this
4:17 uh and there we go so we just save this
4:21 and then now since we know what this is
4:23 I can save this uh I just save this and
4:27 you can see we have it all uh I hope
4:30 this will be heard the palet to Sho
4:34 located on Sho Hill in Paris was
4:36 designed in the modern style by
4:38 Architects Lou Hipp so that's it now I'm
4:41 going to Showcase how to set this
4:45 up this video is sponsored by freely
4:48 give freely give are experts at the AI
4:51 and Drupal and while I might showcase a
4:55 lot of information on how to set up AI
4:58 we have a lot more knowledge than what
4:59 we show here so if you need help with
5:01 anything please get in contact with
5:05 us so a second plug as well workflows of
5:08 ai.com is where I publish all these
5:11 videos where you can actually filter
5:13 depending on which module and so on uh
5:16 so if you haven't been there um please
5:19 visit you can always subscribe in
5:21 YouTube as well of course if you
5:23 want so I will just preface this video
5:26 with the article here from the drop time
5:27 so yesterday I was actually impressed
5:30 visiting the European
5:31 commission uh and they had a awesome
5:34 hackathon that was actually uh centered
5:37 partly around the druple AI module and
5:41 specifically the CK editor plugins so
5:44 there were uh I think at least five or
5:47 six teams working on creating uh plugins
5:51 for the CK editor so it was really
5:53 interesting to see uh the energy and
5:56 actual awesome results that came out of
5:59 this
6:00 uh and that there was an interest in
6:02 developing these plugins and there there
6:04 are use cases for developing these
6:06 plugins for sure uh what I will showcase
6:10 today that I couldn't showcase before
6:12 that because it would just be too simple
6:15 to do this hackathon is how you're going
6:17 to now be able to take automats and put
6:21 those into CK editor so that's where we
6:25 start so uh in this videos I'm not going
6:29 to to Showcase how to set up everything
6:33 so because I have showcased uh the old
6:36 interpolator that now is the automator
6:39 at multiple locations I have also
6:42 showcased if you go back and look in
6:43 videos how you can set ups editor in
6:46 general what I will showcase now is how
6:49 you can combine the two um so something
6:54 new since alpha 8 is that we have
6:58 something called uh disposable
7:02 automats so if you go under AI there is
7:05 a new a new bundle type called automator
7:09 chain types if you enable the automator
7:12 module and under the automator chain
7:14 type you can create any type of workflow
7:17 that you want to
7:19 run uh that starts when we're talking
7:23 about C editor starts with one or
7:25 multiple inputs and generates one HTML
7:29 output so when it comes to the C editor
7:32 it's important that it generates one
7:34 output so what's cool with uh these
7:37 disposable uh entities and why we call
7:39 them disposable is that they just
7:42 becomes a way around a function that you
7:45 can call Via service where you give the
7:49 inputs this runs in the background and G
7:52 gives you back the selected
7:54 outputs so it is a way in the GUI to set
7:58 up a function really so our function
8:01 that becomes a workflow uh
8:05 so if we start with the first example
8:08 here CK editor alt text from image these
8:12 are just a lot of fields basically in
8:15 this case not that many it's just three
8:17 Fields so it starts with a input image
8:21 uh which is just a image field and
8:24 what's important for it to show up I'm
8:26 going to show you later how you uh
8:28 integrate this with c
8:30 is that the inputs always has to be
8:32 required Fields so you set this as a
8:34 required field and that's the only thing
8:36 I've done I added an image and set that
8:38 the
8:39 required uh the next step is that we
8:41 want to generate the all text right so
8:43 this is just a text plane and this is
8:46 now then using a automator uh uh type
8:49 and in this case it's the llm text so
8:52 you just enable the AI automator choose
8:54 llm text uh we're using advanced mode in
8:57 this case and we have a pretty long long
9:00 prompt uh that we have been working on a
9:03 lot uh to basically figure out the best
9:06 all text um and this can use tokens as
9:10 you can see it gets the language for
9:12 instance which is important because if
9:15 it's an entity that's in Dutch it should
9:17 be a Dutch uh alt text right and under
9:21 advanced settings what's important here
9:23 is when you're working with a SE editor
9:25 always set direct working uh direct
9:28 worker or if you have any logic where
9:30 you want to use the ECA you can install
9:33 the AI ECA module and have a ECA mod uh
9:37 logic where you can have you know
9:39 depending on the value of a field should
9:41 it run or not
9:43 so then what's important in this uh case
9:46 is that you have to use a image field as
9:49 well because that is the context in this
9:51 case uh and if you use a image field you
9:54 can also use a image style because you
9:56 don't really need uh super quality to be
10:00 able to create a good all text uh and it
10:03 costs money per pixels that you send
10:05 into Vision mod model so it might make
10:07 sense to use a image style that actually
10:09 makes it small first and when this is
10:12 done the magic trick is then you have to
10:15 have at least one text formatted
10:19 long uh and that's where you generate
10:22 the actual output so in this case again
10:25 enable a automator again llm text uh and
10:29 in this case I basically tell it this is
10:33 how we want it to output and the
10:35 important thing is here then that it
10:37 adds the alt text but otherwise it just
10:40 copies from the same image like it was
10:42 before we make sure that the weight is
10:45 higher because this has to happen after
10:48 uh the other rule that we had or the
10:52 other automated type we had and when we
10:55 have set this up you can just go back to
10:58 cont authoring where you set up your uh
11:02 uh normal rules
11:05 and
11:07 um there's going to be another rule here
11:11 called the AI automator CK editor so you
11:14 open that you can see all the different
11:16 automator types you have and for each of
11:19 them uh you can open so in this case we
11:23 open the CK editor all TT from image
11:25 settings and what's important here is
11:26 that you have to enable it first of all
11:28 otherwise it doesn't show up so you have
11:30 to enable it here you also have to
11:32 enable the global AI automator into CK
11:36 editors uh you have to choose at well no
11:39 you don't have to choose a
11:41 input you I mean you could have
11:43 something that just generates from a
11:45 prompt every time it doesn't take
11:47 context that is possible of course uh
11:50 because you could do something like you
11:51 want to search the daily news on a
11:54 specific topic so it goes out and
11:56 Googles this scrapes those websites and
11:58 write the summary for you every day and
12:00 then you don't really need to have a
12:02 input in this case because it's
12:04 unnown uh it's unnown context and the
12:07 only context that matters there is type
12:10 so you're doing it every day uh anyway
12:13 so but usually you have a input uh you
12:16 can also have a text selection input and
12:18 what that means is that when you going
12:20 into SEC editor and Mark something like
12:22 this this is going to follow into that
12:25 field and this also works with image and
12:28 field uh file Fields then where it
12:31 actually fills up uh image and file uh
12:35 image and file form
12:37 element you can require that you have to
12:40 select so if you haven't selected
12:42 anything it's just going to say you have
12:43 to select
12:45 something uh and then you can say the
12:47 right mode so you can replace the thing
12:50 that got selected you can prepend or
12:52 upend so add it after or before and then
12:55 you just choose the output which is one
12:57 of the HTML fields
13:00 and that is basically it then it shows
13:03 up I can show you the chains I have for
13:06 the other since it might be interesting
13:09 to see so the first thing we did was the
13:11 alt text right uh the second thing we do
13:14 is find image address so if we go in
13:18 there uh
13:20 this uh starts with a image with
13:23 building right so that is our required
13:27 field uh then it's gonna go into
13:31 possible places oh by the way if you
13:34 want to see the order you can always
13:36 click on automator chain and then you
13:37 see which order they come uh possible
13:42 places and you will see here look at the
13:45 images and look for famous landmarks and
13:47 give them back with their name and their
13:48 cities comma separated so this is just
13:51 going to give the uh uh name of the
13:54 landmark and the city and then using the
13:58 address field so this is a typical place
14:00 where the automator is so much greater
14:05 than a lot of other solutions for
14:07 chaining stuff like that because the
14:09 address mod module has a very
14:12 specific uh um set of rules and a very
14:16 specific way that it saves the addresses
14:18 so we always know how an address field
14:21 looks uh and the address field then has
14:24 a automator uh uh rule called the Google
14:27 Places llm text address finder that can
14:31 take a text basically and start
14:34 searching for each of these uh which
14:37 means that we can search now then for
14:39 this place at Trad Aro and actually get
14:42 the whole address fi filled out and then
14:46 as before you have to have a formatted
14:48 field where you in this case take the
14:50 address and format it it in a specific
14:54 way and that's it uh next thing we have
14:59 had was get somewh from
15:01 address I'm just going to do this very
15:04 high level we can take automator chain
15:06 instead so first it uh um searches
15:11 Google uh all right in this case I
15:13 actually total it search for the
15:15 Wikipedia page of this place so it takes
15:18 the address field uh and searches for
15:21 the um uh like Wikipedia plus this uh uh
15:27 this place
15:30 then it scrapes
15:31 this uh so oh no this is what it does
15:36 first take this address and make it to
15:38 something that's searchable in Google so
15:41 this creates a search word for Google
15:43 that's how it is Wikipedia uh truck or
15:46 whatever it is then in the Link Field
15:50 we're using Ser API to fill out the
15:53 links that it finds and with those links
15:56 we use Simple crawler rule to r with
16:00 HTML and that HTML we then use llm again
16:04 to summarize uh and this is the output
16:08 field and uh the last one then is audio
16:15 accessibility
16:17 where uh we
16:21 start with a Tex to speech field I think
16:25 it should be let's see here
16:27 yeah so this is using text to speech
16:30 with llm text to get a cleaned output
16:33 and what that means is that text to
16:35 speech might have a lot of HTML in it uh
16:38 and of course we don't want it to you
16:40 know say uh just because something is
16:43 bolded it should not say strongly
16:45 because that is the tag around it in
16:48 HTML right so it's going to clean it up
16:51 uh and then it takes this output and
16:53 creates
16:54 audio and then in the end it's using uh
16:59 uh this audio file and just generating I
17:03 can show you here actually generating a
17:05 audio player so it's basically telling
17:07 it create this audio
17:10 player uh with a HR in the
17:13 end uh and yeah that is it basically it
17:19 is uh I think for people that wants to
17:22 work with content in Drupal it's it's
17:24 immensely powerful actually even if it's
17:27 kind of it was kind kind of easy to to
17:30 just combine
17:32 everything uh and this is on the
17:34 bleeding edge I'm just going to push
17:36 this now so by the time you see this
17:38 video it is
17:39 pushed uh so use the dev version of the
17:44 AI module if you want to uh start
17:47 playing around with
17:50 this uh yeah thank you for watching
