Adobe Experience Manager Sites & More

Linu · ‎07-02-2023

Thanks in Advance. Now I've a problem to solve.

We have to export the Experience Fragment as HTML. I know the the OOB functionality is there, using .plain selector. I need to satisfy certain conditions here.

1. I don't want the enter xf page need to export(exclude <html>,<head> etc). Only the div. I know we can use either bdoy.html for that purpose. But body.html is not giving externalized path, means the css and js are calling via relative path, Not full path.

2. I need to have the fullpath for all resources like css,js,image etc.

Do we have any solution to achieve this?

BrianKasingli · ‎07-02-2023

You can try this to import experience fragment without the <body> and HTML tags,
<sly data-sly-resource="${@path='/content/experience-fragments/my-site/fragment-a/master, selectors='content'}"></sly>

For the CSS and JavaScript, in the XF editable template, page policies where you have configured the client libraries to be used, you should take those and again, refer them in the editable template page where your XF is being served.

View solution in original post

arunpatidar · ‎07-02-2023

you can use content selector

example
xfpath.content.html

Css and JS you have to create and expose as clientlibs. make sure you set CORS so that thirst party can use it.

Arun Patidar

Linu · ‎07-02-2023

I tried .content as well. But see adding the portion of source code below.

It is not fully qualified path. In the consumer-side if this code include, may be virtually it won't load the page properly.

I need path like "https:localhost:4502/content/----/---/footer.js

BrianKasingli · ‎07-02-2023

You can try this to import experience fragment without the <body> and HTML tags,
<sly data-sly-resource="${@path='/content/experience-fragments/my-site/fragment-a/master, selectors='content'}"></sly>

For the CSS and JavaScript, in the XF editable template, page policies where you have configured the client libraries to be used, you should take those and again, refer them in the editable template page where your XF is being served.

Adobe Experience Manager Sites & More

Experience Fragment as HTML by stripping off tags

Arun Patidar

Learn

Documentation

Community

Support

Resources

Adobe account

Adobe