Expand my Community achievements bar.

SOLVED

AEM5.6.1 LOGO COMPONENT FOR DIFFERENT IMAGE ON EACH LOCALE FOR EACH WEBSITE

Avatar

Level 4

Hi,

I have a requirement in AEM5.6.1 LOGO COMPONENT  for different image on each locale for each website.

So on a website http://abc.com

For http://abc.com/en_US.html  and its child pages it must show different logo image

For http://abc.com/fr_FR.html  and its child pages it must show different logo image

Similar i will need to different locales on the same website.

I took a look on /libs/foundation/components/logo. But this creates just one logo for the whole website.

Could you please let me know who can i achieve it.

 

Thanks.

1 Accepted Solution

Avatar

Correct answer by
Level 4

Hi,

Thanks for the reply.I have the same homepage template being used for different locales in a website

Now if i change the logo image at en_US the  same gets reflected in other homepages  locales to, as the logo component just adds the details to specific template.

Could you please let me know based on above how could i separate out the image details per locale in logo component

View solution in original post

4 Replies

Avatar

Level 10

Have an AEM author open each locale site and manually change the logo. An AEM Logo component lets an author select a logo.

Bu default, there is no logic that adds a logo dynamically.

Avatar

Correct answer by
Level 4

Hi,

Thanks for the reply.I have the same homepage template being used for different locales in a website

Now if i change the logo image at en_US the  same gets reflected in other homepages  locales to, as the logo component just adds the details to specific template.

Could you please let me know based on above how could i separate out the image details per locale in logo component

Avatar

Administrator

Option 1:

I would recommend you to overlay the logo component.

So, add the logic which would check the locale of the site and choose image from DAM accordingly. 

Option 2:

Another way would be, to play with CSS,

Link:- http://help-forums.adobe.com/content/adobeforums/en/experience-manager-forum/adobe-experience-manage...

// 

CSS :lang Selector is the thing you are looking for.

Example:- 

<html>
  <head>
    <style type="text/css">
      p:lang(en) {color:blue; background: white;}
      p:lang(pl) {color: white; background: red;}
    </style>
  </head>
  <body>
    <p lang="en">Some English text.</p>
    <p lang="pl">Jakiś Polki tekst.</p>
  </body>
</html>

I hope this would help you.

Thanks and Regards

Kautuk Sahni



Kautuk Sahni

Avatar

Level 7

By default when we overlay a logo component , it uses design dialog which store content under /etc/design. So if you change at any locale it will be reflect at all locales which is expected behaviour.

If you want to have different logo, then i suggest that try adding logo component at locale level template instead of base page template.