Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
Bedrock Mission!

Learn more

View all

Sign in to view all badges

SOLVED

How can we develop a custom editable template in AEM 6.4?

surenk
Level 4
Level 4

Our customer gave us a design mockup and asked us to develop a template similar (background image, over title, text on bottom) to the mockup.

How can we develop an editable template to look like a design mockup? What are the steps/process involved to bring in the HTML and CSS to the editable template?

1 Accepted Solution
jbrar
Correct answer by
Employee
Employee

Go through WKND chapter 4 that covers everything you mentioned above.

[1] 4 - Style System

View solution in original post

0 Replies
surenk
Level 4
Level 4

Thanks hamidk11679710

The PageProperties section at Creating Page Templates isn't detailed enough.

We built a sample project using GitHub - Adobe-Marketing-Cloud/aem-sites-example-custom-template-type: Sample for building an AEM Te...

Screen Shot 2019-08-13 at 3.36.43 PM.png

and want to apply our custom CSS (global.css) to the Editable Template and then apply individual styles to components being placed in the editable template as below:

Screen Shot 2019-08-13 at 3.42.08 PM.png

Screen Shot 2019-08-13 at 3.42.50 PM.png

Should we apply the STYLES at Component level instead at TEMPLATE level?

joeb21688728
Level 4
Level 4

Working with Editable templates and client libs are covered in this doc:

WKND Tutorial Overview

Using LESS CSS and developing components in an editable template - you can design most sites to meet your customer requirements

jbrar
Correct answer by
Employee
Employee

Go through WKND chapter 4 that covers everything you mentioned above.

[1] 4 - Style System