Adding .html extension to page selected | Community
Skip to main content
December 2, 2015
Solved

Adding .html extension to page selected

  • December 2, 2015
  • 10 replies
  • 8722 views

Is there a way to add the .html extension to the page selected from a granite/ui/components/foundation/form/pathbrowser?

Thank you in advance.

-Dean Anderson

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by Jitendra_S_Toma

@Dean,

You can achieve it. However, That is something difficult and not a ideal solution. Here are the things you need to do to populate URL's with ".html":

  1. Add a listener at the pathBrowser field to get the JSON response with ".html" appended in the URI
  2. Write a servlet to return a JSON response contains entries of URI's with ".html"'s.
  3. Write a extjs code in the listener (line-1) to iterate and set the uril's one by one (if there are multiple).

If you want to save, you still have to write so much code (listener on 'ok' button etc).

--Jitendra

10 replies

Jitendra_S_Toma
December 2, 2015

Hey Dean,

You can. That would be wrong if you get ".html" extension on every URI provided in the pathBrowser field. That's the reason, it has been avoided. In order to get ".html", you can write a small piece of code which determines whether the provided URI is an internal page or not and also checked that URI is a CQ page or not. if it is an internal page, append ".html" extension to that URI.

Here is the piece of code (Groovy) which could help you.

 static String resolveURI(ResourceResolver resolver, String url) {
        resolver.getResource(url)?.adaptTo(Page.class) != null ? url + ".html" : url
    }

The Second option could be, Change the pathBrowser plugin but as I said, that would add ".html" to every URI.

--

jitendra

edubey
December 2, 2015

I guess the simplest solution is you can take care of this at development side in JSP or Sightly file. Below code shows using JSTL in JSP

  1. <c:choose>
  2. <c:when test="${(fn:startsWith(listLink,'/content/dam')) || (fn:contains(listLink,'.'))}">
  3. <c:set var="listLink" value="${listLink}"/>
  4. </c:when>
  5. <c:otherwise>
  6. <c:set var="listLink" value="${listLink}.html"/>
  7. </c:otherwise>
  8. </c:choose>
kautuk_sahni
Community Manager
Community Manager
December 2, 2015

Hi 

Apart from what mentioned above, please have a look the stackoverflow answer.

//

The pathfield xtype has a config option called linkpattern. This allows you to configure the widget to automatically add an extension in case the browsefield is used to select the link. If a user types the text , the extension is not added. Use this option to add '.html' and all internal links will have .html appended (assuming the content authors always use the pathfield's browse option to select the link [which they should be doing ] ). This way the backend code doesn't have to be responsible for checking if link is external or internal and appending the extension.

property : "linkPattern" , value : "{0}.html" (String)

Reference : http://docs.adobe.com/docs/en/cq/5-6/widgets-api/index.html?class=CQ.form.PathField

Link:- http://stackoverflow.com/questions/29792000/how-to-avoid-hardcoding-html-extension-across-all-the-links-for-pages-in-cq

I hope this would help you.

Thanks and Regards

Kautuk Sahni

Kautuk Sahni
edubey
December 2, 2015

Hi kautuk,

Don't you think so we need to take care of selecting an .pdf or .image apart from page.

If user select page, it will work fine, but if pdf is selected, then also it will add .html extension .

Correct me if I am wrong..

Thanks

Jitendra_S_Toma
December 2, 2015

Best option (As my previous post) to go would backend code which could be moved to Util class.

--

jitendra

kautuk_sahni
Community Manager
Community Manager
December 2, 2015

Hi Praveen

 

This is a Good catch. But that could also be filtered out using "maskRe" or "regex" Property .

As mentioned by you in one of the recent thread post :-  http://help-forums.adobe.com/content/adobeforums/en/experience-manager-forum/adobe-experience-manager.topic.html/forum__2cc1-hi_i_have_apath.html

Please correct me if i am wrong somewhere. I would really relish improving AEM skills :).

 

Thanks and Regards

Kautuk Sahni

Kautuk Sahni
December 3, 2015

This is what I'd like to do, but I'm not sure how to implement such a thing.

My current cq:dialog is pointing to a pathbrowser.  I'd like to have some back-end code (utility) that would run when the user selects the path.  Either when they return from the pathbrowser dialog it would be populated with .html (if appropriate) or prior to saving to jcr:content.  Another option would be when they get the content, have something that triggers a utility to determine whether or not to add .html

Is any of that possible?

Thanks again in advance for your assistance.

-Dean

Jitendra_S_Toma
Jitendra_S_TomaAccepted solution
December 3, 2015

@Dean,

You can achieve it. However, That is something difficult and not a ideal solution. Here are the things you need to do to populate URL's with ".html":

  1. Add a listener at the pathBrowser field to get the JSON response with ".html" appended in the URI
  2. Write a servlet to return a JSON response contains entries of URI's with ".html"'s.
  3. Write a extjs code in the listener (line-1) to iterate and set the uril's one by one (if there are multiple).

If you want to save, you still have to write so much code (listener on 'ok' button etc).

--Jitendra

December 3, 2015

All,

Thank you so much for your suggestion and help.

I was able to get this resolved by using some javascript.

Thanks Again.

-Dean

July 15, 2022

Hi @deana66659071 ,

Can you please elaborate on how you did this solution. If possible can you please provide source code if there is no issue.

 

Thanks,

Manikanta

smacdonald2008
October 5, 2018

I just used this solution - in case anyone comes across this again:

<div class="card" style="width:280px" style="padding-top:20px;">

  <img class="card-img-top" src=${properties.path} alt="Card image cap">

  <div class="card-body">

    <h5 class="card-title">${properties.heading}</h5>

    <p class="card-text">${properties.description}</p>

   <a href="${properties.page}.html" class="btn btn-primary">${properties.button}</a>

  </div>

</div>

That works fine!