Adobe Experience Manager Sites & More

josip_marković · 5/6/16

I've only started a few days ago, first with research and now with tutorials to get myself familiar with the technology at hand. I'm following the-basics /website tutorial which went well until Sidekick had to appear. I've ignored the fact that it did not appear (and that no expected JS is in the source), however some steps now require that I have Sidekick available.

I've done all steps exactly as it is written, not even changing descriptions. My contentpage.jsp looks as expected:

<%@include file="/libs/foundation/global.jsp"%><% %><%@page session="false" contentType="text/html; charset=utf-8" %><% %><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <cq:include script="head.jsp"/> <cq:include script="body.jsp"/> </html>

I did some research and found out that the block of JS code that shows Sidekick should be in /libs/wcm/core/components/init/init.jsp and that script should be imported in head.jsp. Both of this is true, I can see that the init.jsp is included in head.jsp and that init.jsp contains the block of code.

I'm fairly sure that everything else is done correctly, but I will check on request. Please, this might be very trivial to most of you, but basically blocks me as I do not know where to look and for what. I'll add as much info as you need.

Thanks for your time!

kautuk_sahni · 5/9/16

Josip Marković wrote...

Hello, Smackdonald

I've uploaded and installed the package you mentioned. The same package is also mentioned in the tutorial, but I avoided installing it so I could teach myself by doing.

However, I still do not see Sidekick. I made sure that the package has been applied and that the code is now updated, web page even looks complete now. I've attached the screenshot of what I see to this post (upload does not work for some reason, here's a link instead).

Are there some other prerequisites I need to satisfy? I'm running the page and everything else in Firefox for Ubuntu 44 from Canonical, installed on Xubuntu Linux 15.10, which is run inside VirtualBox instance on a Mac.

AEM is running in author instance (by default called AEM_6.1_Quickstart until I renamed it to cq_author_p4052). The trial license is still available and sits next to the runnable jar.

I've also snooped through the code, specifically, init.jsp and saw this if statement

if (WCMMode.fromRequest(request) != WCMMode.DISABLED) {
...
}

It seems that this can completely block Sidekick from appearing, and I'm not entirely sure what WCMMode is or does. Could you shed some light on this issue?

Kind regards, Josip

Add the "cf#" or "editor.html" after locaohost:4502/

So, in your case it would be:

localhost:4502/cf#/content/mywebsite/en/product.html [Classic UI] and

localhost:4502/cf#/content/mywebsite/en/product.html [Touch UI]

Read the Reference article for changing the User interface in AEM, so by configuring this your can change the default opening of page:

Link:- http://aempodcast.com/2014/aem-interface/switching-user-interfaces-within-aem-6/#.VzBqKPl97RZ

I hope this would be helpful.

Thanks and Regards

Kautuk Sahni

View solution in original post

Hemant_arora · 5/6/16

include <cq:include script="/libs/wcm/core/components/init/init.jsp"/>

smacdonald2008 · 5/6/16

There is a lot of information in that tutorial. However to make it easier - you can download the package and run the app:

Download the final result

To follow along with the tutorial rather than performing the exercises, download website-1.0.zip. This file is an AEM content package that contains the results of this tutorial. Use Package Manager to install the package to your author instance.

NOTE: Installing this package will overwrite any resources on your authoring instance that you have created using this tutorial.

website-1.0.zip
Website content package

Then you can see how it differs from your app to see where you made a mistake.

Also - we have many smaller artilces that teach you how to include the sidekick - see this one that talks about how to get a Sightly component onto the SideKick:

https://helpx.adobe.com/experience-manager/using/creating-sightly-component.html

As mentioned above - to get the sidekick - you need the underline of code:

<html>

<%@include file="/libs/foundation/global.jsp" %>

<cq:include script="/libs/wcm/core/components/init/init.jsp"/>

<body>

<h1>Here is where your Touch UI component will go</h1>

<cq:include path="par" resourceType="foundation/components/parsys" />

</body>

</html>

josip_marković · 5/9/16

For some reason, my original response got deleted, so I'll paste it from backups I have:

Hello, Hermant. Thanks for replying.

Where exactly would you suggest that I add the include statement? Nothing really happens when I add it in contentpage.jsp like in the example below.

<%@include file="/libs/foundation/global.jsp"%><% %><%@page session="false" contentType="text/html; charset=utf-8" %><% %><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <cq:include script="/libs/wcm/core/components/init/init.jsp"/> <cq:include script="head.jsp"/> <cq:include script="body.jsp"/> </html>

And I can see that head.jsp already has init.jsp included so it's not surprising that nothing is added to the source. If I leave my file as in original post, this is the header

<head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <meta name="keywords" content=""> <meta name="description" content=""> <link rel="stylesheet" href="https://forums.adobe.com/etc/clientlibs/foundation/main.css" type="text/css"> <script type="text/javascript" src="/etc/clientlibs/granite/jquery.js"></script> <script type="text/javascript" src="/etc/clientlibs/granite/utils.js"></script> <script type="text/javascript" src="/etc/clientlibs/granite/jquery/granite.js"></script> <script type="text/javascript" src="/etc/clientlibs/foundation/jquery.js"></script> <script type="text/javascript" src="/etc/clientlibs/foundation/main.js"></script> <link href="https://forums.adobe.com/etc/designs/mywebsite.css" rel="stylesheet" type="text/css"> <!-- I believe these three lines are added by init.jsp --> <link rel="stylesheet" href="https://forums.adobe.com/libs/cq/gui/components/authoring/clientlibs/page.css" type="text/css"> <script type="text/javascript" src="/libs/granite/author/deviceemulator/clientlibs.js"></script> <script type="text/javascript" src="/libs/cq/gui/components/authoring/clientlibs/page.js"></script> <title>Products</title> </head>

With that include added at the top, the source is almost the same with three lines I pointed out shifted above HTML head (which is invalid).

<!-- same three lines, now above head --> <link rel="stylesheet" href="https://forums.adobe.com/libs/cq/gui/components/authoring/clientlibs/page.css" type="text/css"> <script type="text/javascript" src="/libs/granite/author/deviceemulator/clientlibs.js"></script> <script type="text/javascript" src="/libs/cq/gui/components/authoring/clientlibs/page.js"></script> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <meta name="keywords" content=""> <meta name="description" content=""> <link rel="stylesheet" href="https://forums.adobe.com/etc/clientlibs/foundation/main.css" type="text/css"> <script type="text/javascript" src="/etc/clientlibs/granite/jquery.js"></script> <script type="text/javascript" src="/etc/clientlibs/granite/utils.js"></script> <script type="text/javascript" src="/etc/clientlibs/granite/jquery/granite.js"></script> <script type="text/javascript" src="/etc/clientlibs/foundation/jquery.js"></script> <script type="text/javascript" src="/etc/clientlibs/foundation/main.js"></script> <link href="https://forums.adobe.com/etc/designs/mywebsite.css" rel="stylesheet" type="text/css"> <title>Products</title> </head>

Sidekick is still not visible. Am I adding the include statement in the right file?

And thanks Smackdonald for answering. I'll try what you said and report back if I still have issues.

josip_marković · 5/9/16

Hello, Smackdonald

I've uploaded and installed the package you mentioned. The same package is also mentioned in the tutorial, but I avoided installing it so I could teach myself by doing.

However, I still do not see Sidekick. I made sure that the package has been applied and that the code is now updated, web page even looks complete now. I've attached the screenshot of what I see to this post (upload does not work for some reason, here's a link instead).

Are there some other prerequisites I need to satisfy? I'm running the page and everything else in Firefox for Ubuntu 44 from Canonical, installed on Xubuntu Linux 15.10, which is run inside VirtualBox instance on a Mac.

AEM is running in author instance (by default called AEM_6.1_Quickstart until I renamed it to cq_author_p4052). The trial license is still available and sits next to the runnable jar.

I've also snooped through the code, specifically, init.jsp and saw this if statement

if (WCMMode.fromRequest(request) != WCMMode.DISABLED) { ... }

It seems that this can completely block Sidekick from appearing, and I'm not entirely sure what WCMMode is or does. Could you shed some light on this issue?

Kind regards, Josip

kautuk_sahni · 5/9/16

Josip Marković wrote...

Hello, Smackdonald

I've uploaded and installed the package you mentioned. The same package is also mentioned in the tutorial, but I avoided installing it so I could teach myself by doing.

However, I still do not see Sidekick. I made sure that the package has been applied and that the code is now updated, web page even looks complete now. I've attached the screenshot of what I see to this post (upload does not work for some reason, here's a link instead).

Are there some other prerequisites I need to satisfy? I'm running the page and everything else in Firefox for Ubuntu 44 from Canonical, installed on Xubuntu Linux 15.10, which is run inside VirtualBox instance on a Mac.

AEM is running in author instance (by default called AEM_6.1_Quickstart until I renamed it to cq_author_p4052). The trial license is still available and sits next to the runnable jar.

I've also snooped through the code, specifically, init.jsp and saw this if statement

if (WCMMode.fromRequest(request) != WCMMode.DISABLED) {
...
}

It seems that this can completely block Sidekick from appearing, and I'm not entirely sure what WCMMode is or does. Could you shed some light on this issue?

Kind regards, Josip

Add the "cf#" or "editor.html" after locaohost:4502/

So, in your case it would be:

localhost:4502/cf#/content/mywebsite/en/product.html [Classic UI] and

localhost:4502/cf#/content/mywebsite/en/product.html [Touch UI]

Read the Reference article for changing the User interface in AEM, so by configuring this your can change the default opening of page:

Link:- http://aempodcast.com/2014/aem-interface/switching-user-interfaces-within-aem-6/#.VzBqKPl97RZ

I hope this would be helpful.

Thanks and Regards

Kautuk Sahni

josip_marković · 5/9/16

Yes, that's it! I knew it should be something obvious.

Thanks for your time.

Kind regards, Josip

Adobe Experience Manager Sites & More

Sidekick doesn't load [Basics tutorial]

Kautuk Sahni

Kautuk Sahni

Learn

Documentation

Community

Support

Resources

Adobe account

Adobe