Adobe Experience Manager Sites Basics

Transcript

Hello, everyone, and welcome. Thank you for joining today’s session of our “Adobe Experience Manager Sites Skill Builder Webinar Series, Go Global with Adobe Experience Manager”. My name is Anu, and I’ll be your host for this session. If you haven’t already, please take a moment to respond to the polling questions on the screen.

Today’s session is approximately 60 minutes and it’s being recorded for future on-demand viewing.

During the presentation, you may enter questions at any time in the Q and A pod on the left-hand side of your screen. We will address your questions as we go along and also at the end as time permits.

Joining us today is Luis Duarte, Adobe Certified Architect and Authorized Instructor for AEM. Luis, you now have the floor.

Good morning, hello. Thanks, Anu, for the introduction and welcome, everyone.

Today, we have our last session for the whole “AEM Sites Skill Builder Webinars Series”, where we have been exploring all of the basics and operations and basic features of AEM, getting to know how to use it from another perspective. Today, we’re going to go into a very interesting topic, “Go Global with AEM, Adobe Experience Manager”. Now, what we have in store for you today, we go here on day five. So there’s a couple of things here. So it’s not just the multi-site management that is involved here, but we are also going to look at editable templates, which is also an essential part of authoring in AEM, content and manipulation in general. And that’s something that we need to also go through. We did talk very briefly about templates on our first day, but that was very, very, very superficial, I would say. So today we’re going to get a little bit more info in terms of editable template, that’s going to be about the first 20 minutes of our presentation today. And then we’re going to hop into the main course for today, which is the multi-site manager and translation framework to a multi-lingual, multinational sites.

So before we begin today’s session, let’s have a look at what we did on our last session, a quick recap. We learned about content fragments and experience fragments. In the case of the content fragments, we learned that these are meant for us to reuse textual content, mostly textual content across multiple channels, where we don’t care so much on the editing side of the content fragment of the text. We don’t care so much about the layout and the presentation, but we’ll leave that up to each channel, for each channel to come up with the proper layout and presentation.

And we leave the text editor just to care about the semantics of the text. In the case of the experience fragments, we learned that the experience fragments are a way for us to create assemblies of components that you can then reuse across multiple web channels you’re hosting on AEM. But aside from just reusing them across web channels that you are hosting on AEM, you can also use those experience fragments that Adobe Target offers for example, when you explore those experiences as Adobe Target offers, and they can also be exported in general as plain HTML or as JSON.

Without any further ado, let’s go ahead now and have a look at our topic for today. Firstly, let’s look at task one where we’re going to learn about editable templates. We’re going to update the experience template.

In our second task, we’re going to look at multi-site manager and creating a live copy and understanding the intricacies of how to… Oops, sorry about that. Looks like my screen blacked out for a moment there.

Give me a moment. I’m going to need to re-share again.

One second please.

Anu, I’m going to need to come in again. So I have to leave. I have to leave Adobe Connect. Sounds good. Folks, we’ll be right back with you in just a moment. Thank you for your patience.

I believe you should be able to… Sorry, looks like, how we connected is having some sort of issue.

Didn’t load correctly when I went in.

Are we in again? This time, it’s coming okay. One second.

I just need presenter rights again. Sorry. Thank you. Folks, thank you for your patience. We are now reconnected.

Let me have the presentation again.

So on our second task, I was mentioning, we’re going to learn about the details about how to deal with live copies and blueprints and the relationship that they have within the home of the site manager module of AEM.

And then, we have the translation framework, where are we going to learn about the process of getting a page in a set of pages, a whole site, translated using the translation framework. We are going to learn the concepts and the words, the nomenclature that we use there and the operations that are involved.

So our first task, create again, editable templates. Here, we’re going to very quickly learn a little bit about how these work, what we’re looking at here for the task that we have at hand is that we want to change the experience template. So what is the experience template? That’s the template that we have been using in referencing for experiences on the site. So these are those articles that we were working on previously. You would go here to about us. That’s where we move them when we’re doing an exercise on that day. You look at these pages, they have a particular layout. They have here at the top, header, they have a footer at the bottom.

What we want to do is that we want to create or update the template that these pages are based out of so that whenever you create a brand new experience page template, sorry, a brand new page based on the experience template, you’re going to get a sample or default hero image. You’re also going to get a sample or default content fragment that either content fragment and component, that’s going to be there, it’s going to initially point to somewhere.

And then, we’re going to also add an additional breadcrumb at the bottom of the page. So all pages will have the additional breadcrumb.

Before we begin, let’s have a look at how one of these pages looks when you first create them based off the template on its current status. So let me go ahead and create a brand-new page here. Let me go here, I’m going to put it under expeditions.

Create page.

I’m going to use that template that I am interested in right now.

Experience page template. Take that one. Next, call this Article 1 and create.

And you open it for editing.

And this is what you get by using that template. We have the footer, header. You have a hero image that is already there. You have the breadcrumb, you have a layout container, which already has a content fragment, dragged and dropped into it, so we didn’t do anything, it’s already there.

What I want to point out right now is the following.

I want you to notice the fact that in the case of the content fragment, if I select it, I can do anything to it. I can point it to a content fragment, I can edit it, I can delete it, I can move it around because it is within our layout container. I have all of those liberties and it is basically free for me to use. I can use it here as a content author.

Additionally, look at the hero image.

In this case, I can edit the hero image. I can open an image, add some properties to image, but what I cannot do is delete it.

If you see, I do have the option to delete it. I cannot move it around. It is basically outside of that layout container where the content fragment is and it’s not within any other layout container that would allow it, so I cannot do anything, it’s basically there. The reason for that is because this is a structure component, just like the header and the footer. The difference here is that in the case of the header, I cannot do anything to a header. If I click on any of these things here or items or links, I don’t get any blue frame around that. Also with the footer, I don’t get any blue framing around here, so I can open the dialogue or anything like that because those two are also structured components. But the difference is that in the case of the hero image, the hero image is actually unlocked. So it’s a structural component that is unlocked, so that I may allow authors to actually edit the contents, but it will not allow them to delete or move. That is also a case for the breadcrumb that we have here. The case of the breadcrumb is the exact same case of the header and the footer. I don’t have the ability to hover over it and open a dialog.

Let me go back here. So this is basically what we are looking at. So once again, the target that we want to achieve is have an initial hero image and initial content fragment that we’re pointing to, where we have the content fragment component there, but it wasn’t pointing to anything. There was no sample or default content fragment to show, and we’re going to add an additional prepper. So the colors here are significant because when I put it in red, that means, this is a structure component that is locked. No one can delete it or no one can edit it. In the case of orange, this is a structure component that is unlocked. That means you can edit it, you can add an image, you can have properties, but you cannot delete it or move it. And in the case of the content fragment, in this case, it is not a structure component, but rather, we’re going to see that this component has been added as initial content from the template, and can be deleted, moved, edited, and all of that.

So the editable templates, they determine what the structural components of all pages based out of that template will be.

They will determine the basic page layout. They also enforce a consistent set of policies, of content policies across all of the pages that are based out of that template. That means if you have a component, like for example, we look at the breadcrumb. If you want to control at a global level, for example, what the dividing character is going to be here, and every time you use the breadcrumb, you want it always to be that. That is a sort of content policy, so it’s like a global configuration, a global setting. Another example of a global setting would be, or a content policy, would be what you can and what you cannot drag and drop into the layout container. This is the layout container. Let me refresh, so we can actually, we will have containers options completely.

Here, you can add components.

The reason these components appear here, that’s because of a content policy that is applied to this layout container at the template level. That means all pages base out of that template are going to have that content policy.

Additionally, if those instances of those components where those content policies applied, don’t need to necessarily be on pages based off of the same template because you can apply these contents policies on a template per template basis. We’re going to do that. The template also determines what is going to be the initial content of our page, it takes us to our task today. We want to have some default content. So we’re going to set up some initial content.

And they also may be edited by super authors in the template editor. So this is something that you have a UI for, that is basically the same as the page editor where you drag and drop components into, but it is not meant for all authors, but just a special or a selected group of authors that are the ones that are going to manage the templates.

So first, we’ll go ahead and explore the editable template editor. Let me go into the sites console and we’re going to explore that. Got to a main navigation. In order to find the editable templates, you have to go into the tools tab. And under general, you’re going to find a templates button here. This will take you into a templates console.

Here you have different folders where you may have created a template. I’m using We.Retail. This is where all of the templates of the We.Retail site are.

And the one that we’re interested in is the experience page template.

So I’m going to go ahead and click on the pencil icon there.

Now we’re in. And we’re currently on the editable template editor, currently on structure mode. When we are on structure mode, everything that we have here basically is going to affect all existing pages that you have currently based out of this template. So when you’re on a new structure component, immediately, all of those pages are going to have that new structure component. So what we’re going to do now, we’re going to add that breadcrumbs that we wanted to have at the bottom, so that now, all pages based out of this template will begin to have that breadcrumb there. So I’m going to go ahead and open the side panel, then components, and look for the breadcrumbs, here it is. And I’m going to put it below this layout container. This is the layout container that is used for authors. Notice we have that layout container here. That’s the one that authors can drag and drop components into. And here’s the list of all of the components that are allowed. Below that one, I dragged and dropped the breadcrumb, which I intend to be a component that is a structure component. So the authors will not be able to edit this one or remove it. Now that I have added it, all pages based out of it should have it. So if I, for example, go to this page, which is based out of that template and refresh it, let’s do that, we should see that breadcrumb at the bottom.

Or all the way down.

There it is. You have a breadcrumb at the bottom.

Another thing that I want to do besides having the breadcrumb at the bottom, you go back to the template, is have an initial hero image and an initial content fragment. But before I do that, let’s talk a little bit more about the structure mode. Let me go back here into the presentation. So what we’re looking at here is the set of components on an experience page based out of the template that we’re currently working on.

And I have outlined the frame, those components in these current colors, they’re red or orange. So basically everything that is red are locked. Structure components and everything, orange is unlocked structure components. So the breadcrumb that I just added is a locked structure component. The fact that it’s a structure component makes it be on all pages, based out of this template, immediately, automatically.

And the fact that it’s locked, makes it out of reach for authors.

So changes that we make to a structure affects all pages based on the template and the structure components’ edit dialogs, you can only see them on the template editor. So on the template editor, I can actually go into the breadcrumb, edit dialog and configure it. And that configuration will affect every instance of that component, where pages based out of this template are.

Now, one other thing that you can do on the structure model of the editable template editor is the fact that you can unlock components, unlock structure components. The clearest example of an unlocked structure component would be the layout container. Why? Because the layout container has to be unlocked if we intent for authors to be able to drag and drop components into that layout container because if it remains locked, it is off limits for those authors and they cannot drag and drop anything into it.

It’s uneditable for them, so that’s why it’s unlocked.

Another item that is unlocked here is the hero image, which is why we saw that the authors were able to change the image on a brand new page.

Notice that at the bottom right corner of the frame, you have this label that says hero image and unlocked. Lock an unlocked lock. That means this has been unlocked.

So once you unlock a component, you also make it possible for you to add initial content that can then be changed by authors.

So this hero image has been unlocked and the layout container has been unlocked. And if we go into the initial content mode of the template editor like that, change to initial content mode, here’s where we can edit any components that are either unlocked or the having dropped inside an unlocked layout container, such as this content fragment. But this content fragment was dragged and dropped into a layout container here while being on initial content mode.

And we also have the hero image. We also have…

No, that’s basically the content fragment and the layout container. Those are the ones that we can edit here. We can add some initial contents. So I’m going to go ahead and add our initial image for this. This other image, for example. So these one will become sort of like the sample image that every author will see when they first create an experience page. And for the content fragment, I’m going to point it to a target content fragment, We.Retail, English, experiences.

That one for sample.

Single text element. Sorry, master. And that’s it. So now, we have the sample content fragment. If I create a brand-new page based out of these templates, that page is going to have those components on them. So I’m going to go ahead and do that. Back to sites, the sites console, and here, I’m going to create a page under expeditions based on that template. Create page. I’m going to use that experience page template that I was just editing. Create it and I’m going to title it, Article 2.

Then create and open it for editing.

Now what we will notice is that we have the initial image here for the hero. I can change it if I need to customize the page. I can also change what content fragment this is pointing to, but this will be a sort of sample or default content fragment. Also notice the appearance of the breadcrumb at the top and at the bottom. This came from the structure mode of the template edit.

So in the case of the initial content, that’s where you add content or add initial content through the initial content layout container. So you have a container where you can drag and drop components into, and you can also add initial content for unlocked structure components.

Any changes that you make here on the initial content mode of the editor, the template editor is going to affect only new pages. Already existing pages will remain untouched by this. If I go to Article 1, which is the one that we had created before it already existed, this will still not have that hero image or the sample content fragment, but it does have the breadcrumb at the bar, 'cause that’s structure.

And the last item here is content policies. Like I said, the most obvious case would be the layout container because that’s the one that has to allow content fragments to be dragged and dropped. So the allowance or the list of components that are allowed there is a content policy.

And once when forced it consistently across all pages based out of this template, and if I create a content policy that I’m going to use on a template, I can also then reuse that content policy on other templates.

Then you also have the ability to apply the content policies to components on a template by template basis by reusing those content policies. Maybe you create them for a template initially, but then you can reuse them on templates that you create later.

And let’s have a look at this. Let me go back into the experience page template editor. We have that here. I’m going to go back into a structure mode because you have to be on structure mode in order to be able to edit the content policies. So the policies of the layout container can be accessed by selecting the layout container and clicking on this icon. This is the icon for the content policies. I click on that.

And notice that here on the left-hand side, I’m seeing or I’m presented with which content policy I am currently looking at on the right-hand side. So I’m looking at We.Retail default, but I could pick another one. And different values will be on the right-hand side. Right now, what I’m going to do is basically change the settings such that I will disallow all of these components from We.Retail. And we’re going to see the effect of that here. Check mark.

And now, I don’t see all of the components from the We.Retail group, only We.Retail commerce. That’s by the fact that we just edited the content policy. And that’s going to remain the case whenever you are using the We.Retail default policy. I’m going to, once again, include those 14 components. One last item that I want to mention about the editable templates is the fact that these content policies that you have are not just for the layout container, but any component can have a content policy. And these content policies are basically global configurations that you want to reuse across multiple pages.

One example of that, for example, is this style system. That is something that is also a content policy. So if I go to the list component, for example, this is the content policy for the list component. Look at the tabs, we have the styles tab. This is where you set up the style system to point to different classes in your CSS. So that the author doesn’t have to think about CSS classes, but rather, he just thinks about styles, block grid, display, date, image, and those kinds of things, more simplified way. Additionally, if you come from older versions of AEM or are new to AEM, what you need to know is for a component to have a content policy that developers, they have to add the sign dialog to that component. So we will have a content policy editor.

These are what we just went through. And now, we’re going to move on to our second task, which is the multi-site manager. This is the meat of today’s talk. What we want to have a look at is how the multi-site manager works. So here is the task. We want to create an English edition of the site for Spain. And we want to do it, so that maybe tourists that are in Spain may be able to read our content in English.

So how are we going to go about doing it? We could just go into the English page in language masters and copy it into Spain, because we have a folder for Spain. We have the language masters folder and English there, and we could just copy it, but that wouldn’t be the best approach because once you copy it, there’s no relationship between that page that you just copied into Spain and the language masters’ English page or insight.

So what we want to do is use live copies. A live copy is a copy that keeps that relationship and that relationship is a relationship of inheritance, of content inheritance, where the live copies will inherit any content that is added or removed or changed within what we call, the blueprint or the source page.

In this case, what we have here is the English language masters, which has its whole hierarchy of pages, men, experiences and women. And as well as all of its child pages have a corresponding page within Spain, or will have a corresponding page within Spain. So we have an English within Spain, men, experiences and women. And all of these will keep that synchronization, that content inheritance relationship, that the way which we effectuate the actual inheritance of the content is by means of these mechanism, the rollout and synchronization, where you can synchronize the content, so that you can pull it from the language masters’ English, into the corresponding pages in Spain. Or where you can push it or roll it out from the language masters into the pages that are within Spain. So let’s go ahead and create a live copy right now, as we intend, a live copy, an English live copy for Spain, for English-speaking tourists that are currently in Spain. So what we’re going to do is we’re going to go ahead and select what will be the source page for this language copy. So I have to go into We.Retail in language masters and select English. This will be the source page for that English page within Spain. So I select it and then go to create and select live copy.

Once I am on this wizard, the live copy creation wizard, I have to pick the destination since this page is going to be within Spain. I select Spain. Click next.

I’m going to title this, English.

Make sure that the name is en because I have to follow ISO standards. I am not going to exclude subpages, but rather, I am going to include them, so I don’t have to select that. And then the rollout config, this is very important. The rollout configurations are the way which we decide what will trigger our rollout and what happens when the rollout occurs. So when we select standard rollout config, that means that someone has to explicitly click on the rollout button or the synchronize button, to trigger the synchronization of the pages. And also, an effect of the standard rollout is that the content is moved or not moved, but copied as is. Nothing is transformed in the content as it is being moved over from the source to a target. That’s standard rollout config. Let me click here on create. That’s going to take a little bit of time for it to create the English edition here within Spain. While that is going on, let me go here and talk a little bit about multi-site management approach. So what we are looking at here is an example of how the We.Retail site structure is created or is laid out. So we have the whole language masters branch or section where we have what we call the language copies or language masters, depending on which one is the one that is the original language that you work with. But you have, for example, the English language masters with several language copies. So we have English, sorry, not language copies, but the English language masters with several live copies.

So those live copies are the places where I am reusing the English edition of the site that I have here under language masters, maybe that is an international English edition of the site, edition of the site that doesn’t have many country-specific items, but then we have country-specific English editions of the site that will reuse the English edition across their own regions. The whole idea here is that for these two to have a larger effect, in terms of efficiency, of course, the content of these live copies have to be very similar in structure and content. Of course, doesn’t have to be the same, but it has to be very similar, so we can reuse most of the language, most of the content on the language that we are reusing and just apply some localizations throughout the pages, but in most of the content we can get from the language masters.

We have to follow ISO standards for the language code and country code when we create the names of the pages and node names of those pages. So you can start with either a country-language or language-country.

Let me go back here. This is already done.

So now we should already have an English edition of the site within Spain, there it is. So now, let’s play a little bit with this page. We have page within this English edition within Spain.

First, let me go ahead and open one of these pages. Let’s go into the main page and edit it.

The only reason why I’m opening it right now is to show you that every single component right now, even though you can actually hover over it, then you get the blue frame around it, none of these components is editable right now by the author. You see, you have this chaining icon. This is symbolizing the fact that this component is within a page that is being inherited from a blueprint.

And therefore, it itself, it’s inheriting its content from its corresponding component on the blueprint page. Once again, the blueprint page is the source page where this came from. So I would have to break this link to be able to edit. So before I do that, let’s go now into… Let’s imagine that we work at the headquarters of We.Retail and we want make some changes to the men page. Within language masters, I go to English, men, and now, I’m going to go ahead and open it for editing. So right now, I’m no longer looking at the English edition of the site in Spain, but rather, the language masters’ English page. What I’m going to read just a slightly alter this so I’m going to click on this and now click on this icon so I can add some extra text here, our featured products.

So I have just gone ahead and edited these on the language masters. Now, in order to roll these out into the live copies, I can do it either from here, so if I click on this, it’s going to ask me, do you want to rollout or rollout to a specific live copy? I can do it from here or I can also come here to the page properties, open the page properties and go to the blueprint tab. Here, we have all of the live copies that are associated with this blueprint page, men. And you can click on the rollout and this will roll out this change to all of those pages. And you can also do it from the sites console, which is where I’m going to actually do it from. I’m going to go ahead and go to the page in Spain and select men, and then click here on the adding UI rails and select references, the references rail. And notice that we have our blueprint button here, it will show me what is the blueprint page for the currently selected page. And then, it gives me three options. I can either roll out, which is basically pushing from the site, from the page in language masters into Spain. So I’m going to go ahead and do that, but before I do it, let me compare, so we can see what is going to happen, exactly can compare. And you will see that on the language masters, we have this extra word here. So I’m going to go ahead and do the rollout, do it, select blueprint and roll out, roll out the page physically. Now, I’m going to go ahead, back into this page in Spain. So let me just close this, so you guys get to see how I open it. So we all know what we’re editing, but I’m under Spain, English. Select men, open up for editing. Now, that text should be there. So you see, our featured products now. So let’s suppose that now I work at the Spanish content management team, and I want to unlock some of these components, so that some changes are not brought into the page when a rollout occurs or a synchronization occurs, but rather, just some of the pages or some of the content or some of the components are updated, not all of them. So what I’m going to do is I’m going to unlock the hero image. Unlock that one. I’m also going to unlock one of these two teasers. I’m going to unlock this teaser here on the right.

Unlock it. Notice that after I unlock, I get the wrench icon which will allow me to add an image. I’m going to go ahead and drag and drop the asset here.

This airplane there. And let me change something here as well on the hero image.

Let’s add this one.

I have now these two images, locally in Spain.

Now I go back to the men page on language masters. And now, let’s suppose that the people working at the headquarters, they want to update the men page again. So they come here, select men, edit.

And now, we’re going to change the hero and the two teasers. So I’m going to change the hero for something else.

Here’s one.

And for these two, I’m going to configure. Let me add only one of this.

That’s not in Australia by the way. Let me add something else here.

Amazon. There we go. So these are now the global images for the hero and the two teasers.

Any page that is based out of this blueprint will get this, unless they have unlocked those components. So that’s why now we’re going to push the content into Spain.

I’m going to go ahead and open over here, sites, select the men page, under language masters, English, men. Once again, go to the adding UI rails selector, select references, and go to live copies. Here, you can see all of the different live copies that exist for the English edition of the site, and I’m interested in the one in Spain, specifically right now. And I can push, or I can synchronize it with the men page under language masters. So click on synchronize.

If I go back to that page in Spain, we should be able to confirm what just happened. Open it for editing. Now, let’s notice the hero image. It remained the same because it is unlocked. And we actually dragged and dropped our own image there. And in this case, only the left teaser was locked, but the right teaser was unlocked. And we see the effect of that, the left teaser was updated, but the right one kept the image that we added within Spain.

So what are some key highlights here and takeaways? The multi-site manager is used to deploy content automatically to multiple sites while also being able… Or by the mechanism of creating live copies from a source or blueprint page.

Ideally, we should think of sites that have shared a lot of structure and content to make the most out of it. Because the more content is shared across the regions or countries, the more you will be able to take advantage of just editing it centrally once and not having to do many localizations. But that doesn’t mean that you cannot unlock your components or add pages that are specific to a particular market and will not be there on the language masters, that’s fine.

We also have control over what content is inherited or locally managed, we saw that with the locking and unlocking. You have rollout configs, the rollout configs, that’s how you can configure or decide what will trigger the synchronizations or the rollouts. And also, what will happen during the rollout. We just use the standard rollout, which just copies the content as is.

And it gets triggered by someone actually pushing the button.

There are other conflicts that are triggered with different events or different situations. Multi-site manager is for sites that share same language, so if you want to reuse the same language across multiple countries or regions, and it is not, let me stress this very highly, it is not a translation framework. For translation, we have our next task.

In here, we’re going to explore the translation framework of AEM.

What we want to do here is we want to create a Spanish language masters. I don’t know if you noticed that we didn’t have a Spanish edition of the site under Spain and we’re going to actually now create that Spanish language masters that we can then reuse across countries that will use this Spanish language site. For instance, Argentina. So we’re going to create Argentinian country site, which is going to have Spanish within its editions of the site.

So before we start, let’s look at the following. So currently, we have content, We.Retail, language masters, where we have an English and a Portuguese language copy. And there’s also a French and German and other types of language copies there. If I go back here to the sites console, language masters. Guys, we have English, Portuguese, Italian, French, and German. So all of these language copies are created by means of using the translation framework. So this color that I’m using here is identifying the fact that we are using the translation framework.

And what we want to do is look at what will happen or what is currently there actually. If for instance we have a country site for Brazil, where we have an edition of the site in English, and an edition of the site in Portuguese. If I go back to the sites console, we can see that we have Brazil here, and I have an English and a Portuguese edition. Now, how did these English and Portuguese edition of the site get there? By means of live copies.

So the arrows in blue here signify that the multi-site manager is taking or is picking in here. So these are live copies.

These other colors would be the language copies.

And the end result that we want to achieve is that once we have created via the translation framework, an Eng, sorry, a Spanish language copy, one that is already in place, we want to use that language copy so that it becomes the blueprint for all the places where we want to reuse Spanish. For instance, Argentina. So we have content, We.Retail, ar, and within Argentina, we’re going to have English and Spanish. Both are going to be live copies of their corresponding sites within language masters.

Now first, what we want to focus in right now is on the translation framework piece of this. So let me go ahead and start that process.

So we want to create that Spanish language copy. For a language copy to exist, we have to decide what it’s going to be the language masters for that language copy. That means, from which language we’re going to translate into the target language, that is going to be English. So I’m going to select the English page and then click on create language copy.

Next, I’m going to select English here because that’s the page I want to add. I can change the scope if I want to here, but I don’t want to, I want to basically translate that page and all of its child pages, that’s why I have subpages, click next. And here is where I set up the actual translation job.

I have to select first, what is the target language. This is Spanish.

Click Spanish.

Several editions of Spanish from different countries, so I’m picking just the standard Spanish. And then you have on the right-hand side, the translation framework integration configuration. So it’s a mouthful. But there’s two aspects to the translation here. We have the translation framework integration, API, which is something that the translation vendors have to implement so that they can actually, so that authors can actually go through this process when they are translating pages using their specific software.

In this case, we’re using the Microsoft Translator Trial License or the Microsoft Translator, using a default configuration for the translation integration framework. So we have a translation vendor that we have to go to here at the cloud service. And we also have to configure the integration framework that will basically decide the following. So I’m currently using default configuration, but if I want to look what is inside that default configuration, I can click on this.

This will show me how the whole content within sites, that is content pages, will get translated, using which translation method, which translation vendor.

Since I’m using machine translation, content category, so that the machine translation will use a particular focus when it is translating, so that semantics of the translated content are more geared to a particular topic. So I’m using the general category here.

Then you have translated page assets using translation workflow. So there are assets on the pages, so I can choose which workflow to use when those assets get translated. So I’m going to use the sites translation workflow for assets on the page. And you have the translate component strings, translate tags. Pages have tags associated to them, so you want to translate those tags as well. Component strings is probably the most key factor here, because the component strings are the actual properties that hold the values of the content that you see on the pages, so we have to translate that. And after we execute translation, if we check that, then it will automatically start the translation without first letting us review the translation job. We don’t want to choose that, but rather, leave it like that. We also have assets tab here, how we want to translate the assets. Similar configurations here. Except for the case of content fragments, there’s an option here, translate content fragment assets. So in content fragment, you can have associated assets and also inline media. So if you have a content fragment on a page that you are translating, and then, that content fragment has inline media or associated content that we want to translate that, so how do we want to do it? Communities, that is user-generated content, how do you want to translate it? So that’s basically it. I’m going to cancel this one, going back to the wizard, click next here.

So what I’m going to do now is by using that default configuration, I didn’t make any changes. I’m going to now create that translation job. And that translation job is not going to exist individually or in an isolated fashion, but rather, it will be within that translation project. That’s why I’m right now, presented with the options to choose how do I want to proceed project? So do I want to just create the structure? That will just create the structure of the site, still in English and nothing else. Or do I want to create a translation project, which will have the translation job within it. Or I want the language translation project, if I’m translating more than one language. Or add this one to an existing translation project. I’m going to choose create translation project, and this is going to be create, Spanish language copy.

Hit create and done. First, I want you to notice the fact that right now, we already have this. We have es and all of this whole structure. Notice the fact that the name is es, this is going to become the Spanish edition of the site. It already holds the ISO name code for the language in Spanish.

But still needs to translate everything including the page titles. For that, a language translation project has been created. And let me go ahead and take you into the project’s module of AEM. So projects is something that is not specifically part of this whole webinar series, but I just wanted to touch upon it briefly. Projects is a means by which you can create content project. So that’s, for example, if you have a photoshoot, you can have a centralized location where all of the tasks and all of the assets and all of the pages associated with that photoshoots will be all centralized within that project. So people can go in and you can also have workflows associated to that project. Now, in the case of translation, AEM creates a translation project, which will have translation jobs. So let’s go ahead and do this create Spanish language copy folder, where we have the project for create Spanish language copy. I’m to select it.

Actually not select it, but click on it, so we go inside the project.

AEM content are based out of or are configured by using these tiles or cards. And each one of these is meant for a particular purpose of the summary. This is the main configuration of the translation. This is where we can see the full configuration that we set when we’re going through the wizard.

Like which was the provider, the translation method, all those things. If we want to change some of that specifically here, we can go here and change it.

Then we have a translation job card or tile. Here, we can pick, sorry, we can review the translation job before we actually could click the translation. I click on the regions here at the bottom right of the card. This will open the translation job itself, where you get the list of all of the pages that will get translated along with the assets that will get translated. Notice that there are some that are folders. That means, if you go in, there’s pages within that or, sorry, not pages, but actually assets that are associated to a page that also need to get translated.

So you also get the ability to filter. If you click on this rail selector, you can click, for instance, on filters and options and you can now filter by translation status, for example. So if something has been submitted or is a draft or is completed or approved, you can also filter by asset type.

So let me close these one and go back into a translation job. We come on the breadcrumb here, we go back one level. So we’re back at the project. And now, I’m going to actually start the translation job. So the process is going to begin now. I select this drop down and click on start.

If I refresh this page, now you will see that you have a translation in progress labeled there if I go back.

So this is going to take about 30 seconds to a minute, depending on the amount of things that need to get translated.

Now, I’m going to go and show you how content gets translated specifically. So we have seen the configuration of the translation integration framework while we were going through the wizard. But there’s also another important configuration associated, which allows you to set what exactly will get translated when it comes to the components that are making up a page. So if we look at any page, pages are based out of components and these components have content that they are showing. And this content is stored on properties that are defined by those components. So we can actually configure which properties from which components are going to get translated. We can be that fine-grained. So if you click here on the, sorry, on then navigation, the main navigation, then tools, under general, you scroll all the way down, you will see a translation configuration. This is where you set up then translation rules. So I have to pick a context here. And the translation rules are basically the ones that are going to define specifically what are the properties that are going to be translated. This will in the end, result in the production of an XML file, XLIFF, which should follow standards for translation. And these property names as you see here were added by the fact that someone came in here and click on other components, selected a component from the work that they have, and that would add the properties that are defined by that component. You can also apply filters for things that you don’t know, what you do not want to translate? Like for example, CQ annotations, the annotations that people add when they are collaborating. You don’t want to translate them, so you can put that there, for example. In references, component sometimes will have references to a content fragment, to an asset. So what are the things that you would like to actually translate in terms of references? And this is an example of that here and what are the name of the property that has the reference? Let me now go back into the translation job. This probably is already finished by now. Go back into projects.

Spanish language. So it is completed.

Group.

Now, if I go into sites, We.Retail, language masters, now we have Spanish edition of the site already created, already translated.

Only I have to set up the title here. I’m not going to do it right now to save time, but what I want to do now, now that I have a Spanish edition of the site, I want to use that when I create that country site. So I’m going to create that Argentinian country site. I’m going to select the parent, We.Retail, select it where we have all the country sites, click create. Now, I’m going to select site. This is also part of the multi-site management. So we just transitioned back into the multi-site management features, so we were in translation framework, now, we’re back in multi-site management, where we want to use the site creation wizard to create that whole country site. And at here, I have to pick a blueprint for a site. I’m going to select the We.Retail blueprint, which basically sets the language masters folder at its roots, so that all of the language copies within language masters will appear here as options in terms of languages that I can pick for Argentina. So I’m going to select English and Spanish, and I’m going to get rid of Italian, French, and German, Portuguese.

And I can also select whether I do not want to add something to the Argentinian edition of the site, like for example, I want to remove time warp or some other section of the site. I don’t know if want to include it in the Argentinian edition of the site. You’re going to pick Argentina, the ISO code, ar.

Admin will be in this case, the owner. Pick a live copy. I mean, make it a live copy, so that once we perform this operation, there will remain an inheritance relationship between the Argentinian edition of the Spanish site and the English site with the language masters. Click create. And now, this is going through the process of actually creating the live copy for both the English and the Spanish edition of the site within Argentina.

Going to take a little bit of time. While that is going on, let me go ahead and have a look at our key takeaways here for the translation framework. So this translates third party translation services, such as Translation.com, Lionbridge, Smartling, and there are several others to create language copies that you basically translate from a language masters, but then those language copies themselves, become the language masters for live copies that you’re going to create based out of those.

But they themselves are language copies of your regional language that you choose. In our case, it was English.

Then, we have a translation projects, which is where you can have those translation jobs that you can manage the translation job before actually executing the job. The job will have a LiveCycle that you can work on. So we are currently using the automatic approval. So that’s why we didn’t do much. Here, it got automatically approved for us, but there’s also the possibility for the translation job to go through an approval process as well. Translation rules are used to fine tune what specific content from the components on the pages we will actually get translated. And so, we could filter some things such as annotations, for example, which is default in AEM to exclude that. Then you have the multi-site manager. We use it to define a blueprint for full site deployment, a country or region site. So we created the Argentinian site using the multi-site manager again, using the site creation wizard, which allowed us to pick a blueprint, a site blueprint, which was pointing to language masters. It gave us the list of language copies to pick from, that we wanted to create live copies out of. Then we use the multi-site manager’s live copy overview so we can get insights on and manage live copies status. So this last one, the live copy overview, you can get it by going into any language masters site, any page that is considered a blueprint, like for example, this one, English.

Select it. And then I can pick here, references and then go to live copies so I can see all of the live copies of English.

So there it is.

Language masters, English.

It didn’t load correctly. Let me refresh the page.

Select English.

I’m not looking at the right thing.

I don’t know why it’s not coming there, but we do have a bunch of live copies for English. So I’m going to go ahead and… There’re multiple ways to do it. You can select it and go to page properties.

Page properties, blueprint. Here, you can open the live copy overview as well.

So go to the page properties, blueprint, and then live copy overview. This will give you an overview of all the live copies of the English edition of the site. We have one in Canada, in the US over here, in Italy. So it’s pretty much everywhere and you can select any one of these. Like for example, the blueprint was modified. And the live copy hasn’t been updated in Germany. So I can select that and synchronize. It will roll that page out and all of its subpages. And I can begin to go in and see the child pages and see what are their status in the corresponding live copies.

And by now, by the way, we should already have the Argentinian site done.

So let’s see, Argentina, we have it English and Spanish.

So that’s it for today’s webinar. So let me see, I know we went a little bit further in terms of time. Let me see if I can actually see some of the questions here that may be relevant for us.

Let me see.

“Will it be recorded?” Yes. “Is the translation real time and how is the creation handled for sensitive content?” So the translation can be in real time or not, depends on whether you’re using machine translation. You’re using machine translation and you have it set to auto-approve. Then in that case, it’s going to be automatic just like what we just did, but you can also set it up with another vendor that you integrate into AEM. You set up the translation integration framework so that when you translate a page, it doesn’t help to approve. It makes you go through a process where you first, you submit it for a draft, then they send you a draft, then you approve the draft. And it goes through several steps until it gets approved.

Let’s see. “Is the recording will be shared?” What other questions do we have here? I don’t see any other questions.

No, Luis. I think you’ve covered everything.

Okay. So, a big thank you for your presentation and for a wonderful series. We’ve done five days of this, the “Adobe Experience Manager Sites Basic Series”. And all of the recordings will be shared with all of you after the session, so please keep an eye out for emails.

We also have a couple of resources available for you to download in the resource pod here on your screen. So we do encourage all of you to take a look at those as well.

And a big thank you to all of you who have joined us today and throughout the series. We- -