Tag Archives: AEM Communities

Standard

Posted by

Posted on

March 28, 2017

Posted under

AEM, AEM Communities

Comments

Leave a comment

Extending the communities component – Part 2

In one of the earlier post, I talked about extending the communities component. While working on this in my project, I faced another problem. I had a use case to override the toolbar in order to adhere to the custom styles we wanted to apply on the component.

Problem:

  • In comment.hbs, the below line includes the toolbar.hbs. 
{{include this template="toolbar"}}
  • The problem that I faced was that my template changes were not getting picked. I was over-riding the toolbar.hbs, but it was always picking the default OOTB template file.
  • The reason is that whenever we post a comment, it gets saved in the usergenerated content and resource type always points to the OOTB component.community.PNG
  • This resourceType property gets picked up and passed as a parameter to a servlet which resolves the template. You should be able to see the below call in the networks tab of the browser.

http://localhost:4502/services/social/templates?resourceType=social/commons/components/hbs/comments/comment&ext=hbs&selector=toolbar

Solution:

To resolve this issue, we need to tell AEM that it needs to pick our custom resource type rather than OOTB one. There is a configuration for this in the component.

  • Go to the design mode and open the design dialog for comments component.

communities-design-dialog

  • As shown in the above image, you need to specify the path of the custom comment resource type that you want to use in the design dialog. Once you save the changes, you should be able to see your template loading fine.

Hope it helps !! 🙂

Advertisement
Standard

Posted by

Posted on

March 22, 2017

Posted under

AEM, AEM / CQ5, AEM Communities

Comments

Leave a comment

Communities Component Guide

Adobe has provided one of the most useful feature/utility for developing communities components, known as Communities Component Guide. It is an interactive development tool for the Social Component Framework (SCF). It provides a list of available communities components and complex features built of community components.

Apart from providing the basic information for each component, it lets you experiment with the features as well. You can access the community guides on your instance by following the below URL

http://<server>:<port>/content/community-components/en.html.

The left rail provides the list of the SCF components. Clicking on the component will display the information related to that component. e.g.

  • You should be able to see the title of the component.
  • Clientlibs are very important when it comes to community components. Your component might not behave correctly if the required clientlibs are not included on the page. You should be able to see the required clientlibs for the selected component.
  • It also has the instance of the component on the page so that you can experiment with it. The behavior of the component depends on the instance where you are accessing the guide from. If you are accessing it on the author, then you should be able to see the dialog, can edit the template scripts etc. If you are accessing it on publish then you should be able to experience the features as a site visitor.

It looks like below:

component-guide

Customization:

If you want to do some customizations on the fly, the scg:showIde property must be added to the component page’s content JCR node and set to true.

Lets’ take an example of the comments component:

  1. Go to CRXDE Lite e.g. http://<server>:<port>/crx/de
  2. Select the component’s jcr:content node e.g. /content/community-components/en/comments/jcr:content
  3. Add below property and save.
    • Name  scg:showIde
    • Type   String
    • Value  truecomments-comp
  4. Reload the Comments page in the guide. You should be able to see 3 more tabs.
    http://<server>:<port>/content/community-components/en/comments.html

comments-comp-edit

  • Template Tab: It lets you see the template associated with the component. You can make changes to it, compile and see the results on the screen. Nothing will be saved in the repository.
  • CSS Tab: It lets you modify the CSS and see the changes on the component placed on the page.
  • Data Tab: To modify the.social.json associated with the component.

If you are a beginner and trying your hands with AEM communities, this will surely help you.

Hope it helps !! 🙂

 

Standard

Posted by

Posted on

March 21, 2017

Posted under

AEM, AEM / CQ5, AEM Communities

Comments

Leave a comment

Extending a Communities Component

More often than not, to meet the business requirement we need to create our custom components. It’s easy when it comes to AEM Sites, but I faced a lot of problems while extending the communities component. AEM Communities provides a lot of the OOTB components which in most scenarios meets our requirement. But, these components have basic layout and skinning. If you have to modify the appearance or behavior of the component that matches your site layout and meets the requirements then you would have to customize it. As explained in the documentation also  that there are two approaches for the same:

  • Overlaying: Overlaying the component changes the default component and affects every reference to it. Since we are overlaying, we would be copying it to apps hierarchy and then making changes to it. As paths are first looked into apps and then in libs. So overlaying it simply overrides the default behavior.
  • Extending: Extending the component limits the scope and is the recommended way to customize component.

While working on customizing the component, I faced quite a lot of issues. I followed this documentation but I was still not able to get it working. There is an issue here w.r.t the way clientlibs being defined. While defining the clientlib, categories  should be unique, as in this case

aembootstrap.communities.comments

clientlib-social

Add this as a dependency in the main clientlib.

clientlib1

After these changes, your component should work fine. It looks like below once you drag and drop this component to the page and post comments. 🙂

communities-example

I have also added it the Github Repository here.

Feel free to comment if you face any issues. 🙂

Hope it helps !! 🙂

Standard

Posted by

Posted on

July 28, 2016

Posted under

AEM / CQ5

Comments

Leave a comment

Managing Community Users in AEM | Tunnel Service

The trend of having the interactive websites is more common these days. Users can interact through forums, by posting comments, by participating in quizzes etc. AEM Communities provides a rich framework to have such interactive websites. Users can either come from LDAP/AEM or you can allow Social logins as well. But, with this increases the need of managing such users in a highly interactive website.

Recently, we encountered a serious issue in one of our projects.

Problem/Use Case: 

Usually, the logins happen on a Publish instance which makes the users being created on the Publish instance itself. Now, in an interactive community site, users are added to Community Groups so that they can interact. Now, there are two options to add these users to the groups:

  1. Have some trusted users who can use the useradmin console and assign the users to the particular Community groups.Users who gets assigned to such community groups are called members on the publish instance.
  2. Have the same users on author instance, add them to appropriate Community groups and activate it.

Now, the first option imposes some of the security risks, so we were using the 2nd option. But lately, we realized that as the number of users increases the performance of author instance starts degrading.

Solution:

Adobe has provided a way to have these users in the publish instance and yet manage it from the author instance. You can use the tunnel service to have the publish users available in the author instance. Follow the below steps:

  1. Go to Configuration Manager on author instance and look for the AEM Communities Publish Tunnel Service  and click on enable. This service needs to be enabled on the author instance only.tunnel service
  2. Now, Go to the members console on author instance. You should be able to see all the users now. members console
  3. Clicking on create button will allow you to add a new member into the publish instance and assign it to particular Community Site and Community Groups.
  4. Similarly, Groups console will allow you to manage the Community Groups.

Troubleshooting:

  1. Make sure both the author and publish instance will have the same configuration i.e. Both should be on AEM 6.1 (SP1+FP4) or above. In FP3, tunnel service does not allow the management of members from author instance. This feature was added in FP4.
  2. Make sure the bundles are up and running in both the instances. Otherwise,you will not be able to see any users in the members console.
  3. If you are not able to see the default users, make sure you are not running on nosamplecontent runmode.

References:

https://docs.adobe.com/docs/en/aem/6-1/administer/communities/users.html

https://docs.adobe.com/docs/en/aem/6-1/administer/communities/consoles/members.html

Hope it helps !! 🙂