When building components in AEM, by default new components are created with an associated JSP file for rendering.
For builds using Sightly, each time a component is created the developer must delete the JSP file and create the required HTML file.
This leads to wasted time and effort, not to mention frustration for developers having to complete a repetitive task.
Can AEM be configured so the default rendering generated is HTML rather than JSP?
Thank you
I don't think such a configuration is possible in AEM, primarily because, the creation of component and its JSP is handled through Javascript.
/crx/de/js/CRX/plugins/action/CreateComponentAction.js
Even the initial content available within the JSP file is populated through this JS only.
A short snippet from the JS, is shown here
// create component JSP
var nodeName = label + ".jsp";
var compJspFile = CRX.Util.createNode(nodeName, nodeName,
CRX.util.NT_FILE, component, loader);
Related
I want to localize strings of shared components like "NavMenu.razor" or the "App.razor" page.
I managed to translate content in my pages as described in the general .NET Core instruction and the more specific Blazor documentation:
Create a resource file with the right name (e.g. PageName.de.resx).
Inject localizer into Razor page with #inject Microsoft.Extensions.Localization.IStringLocalizer<PageName> _l10n.
Translate text inside the page with _l10n["Product name"] which gets translated correctly to "Produktname".
This approach did not work for neither "NavMenu.razor" nor "App.razor".
Please note: I use MatNavMenu from the MatBlazor UI lib for main navigation.
I cannot find it documented anywhere. Help is much appreciated.
Easy:
Install Microsoft.Extensions.Localization
in programs.cs
builder.Services.AddLocalization(options => options.ResourcesPath = "Resources");
builder.Services.AddScoped<IStringLocalizer<App>,StringLocalizer<App>>();
Create a Resources folder in your client project. Add a resx file to
that for instance App.resx this will be your default resources. Then
add more files for each language you wish to support. App.fr.resx
App.es.resx ect.
Then in a component inject
#inject IStringLocalizer<App> L
#L["YourText"]
The localizer will use browsers language and look in, in my case, App.en-AU.resx, App.en.resx, App.resx order for the key. If not found it will use "YourText"
Here is a blazor WASM project repo
I have a javascript file under the following folder in my JAR component:
/src/main/resources/META-INF/resources/default/javascript/jquery.marquee.js
If I create a custom JSF component with the following #ResourceDependency annotation:
#ResourceDependency(library = "default", name = "javascript/jquery.marquee.js", target = "head")
The javascript file cannot be found, and in the browser I can see two weird URLs with undefined.css and undefined.js as part of the URL, and also referring the PrimeFaces library ??
http://localhost:8080/acio/javax.faces.resource/undefined/undefined.css.xhtml?ln=primefaces&v=5.3
http://localhost:8080/acio/javax.faces.resource/undefined/undefined.js.xhtml?ln=primefaces&v=5.3
However, if I manually include the script in a XHTML template as follows:
<h:outputScript library="default" name="javascript/jquery.marquee.js" />
Then everything works like a charm as expected, with the expected URL as follows:
http://localhost:8080/acio/javax.faces.resource/javascript/jquery.marquee.js.xhtml?ln=default
I'm completely puzzled about this.
Why, if I use the #ResourceDependency annotation, I get TWO wrong URL's, one about a CSS and another about the JS, related to the PrimeFaces resources, when I'm positively sure the placement of my own JS file is correct? (otherwise the h:outputScript would not work as well)
Tested with Mojarra 2.2.13.SP1 shipped with WildFly 10.1.0.Final, and Mojarra 2.2.12 shipped with WildFly 9.0.2.Final
Any help would be greatly appreaciated !
[UPDATE]
It looks like the the issue may be related to the way we handle page navigation. We are using a SPA approach, with a Facelet template that has a big panel group area inside, with a dynamic JSF include directive. Pages are XHTML fragments that are dynamically included in the template's panel group after an AJAX execution.
It appears that #ResourceDependency only renders the corresponding HTML resource link when a View is created the very first time. As we are using SPA, our View never changes, from the JSF point of view. We handle all the page navigation with AJAX fragment updates using the include directive.
As a test, I placed the tag of my component in the Facelet template itself, instead of a XHTML fragment... and the link is rendered as expected !
It would be great if someone can confirm this behaviour... and if there's any elegant solution to it.
So far, we have to manually include the needed HTML resources on the template definition.
It turns out that the problem goes away when upgrading to PrimeFaces 6.1. Probably Kukeltje is right, and the PF 5.3 Resource Renderer has some kind of bug.
In short, when developing your own JSF PrimeFaces components, PF 5.3 will not render the #ResourceDependency annotations of the JSF component in some situations, like the one described here: using an SPA approach with XHTML fragments.
Moving to PF 6.1 solves the problem. If upgrading is not possible, we have to manually include the needed JS / CSS resources in the fragment with outputScript tags.
I relatively simple question regarding XPM this time. It's about creating Page Type which editors could use to base their new website page on. When defining a Page Type, you can use an exisiting page to enable this as an example page, including its components. You can copy these components to enable editors to edit these freely without tampering with existing pages using these components as well.
On the SDL Live content docs they explain the following:
Change the setting from Include this Component Presentation to
Include a Component Presentation that contains a copy of this
Component. If you use this Component in multiple Component
Presentations on this Page, then saving the Page causes all of those
Component Presentations to have the setting you configured last for
any of those Component Presentations. A number of new controls appear.
This means that whenever an editor clicks 'new page' within XPM, this page type is available and the components that are defined inside it are copied with user-specific prefixes. You can define this inside the page defined as a Page Type itself, by clicking on the component presentations tab, then clicking on a component and selecting Page Type settings. note the following:
As you can see, the copy of the content is being created in 050 - Web - Global, which is, in our blueprint, the wrong publication. However, in the popup you cannot select the correct content location, only the one where the page type is residing.
I've tested this, also with the UI -specific blueprint context settings, where you should define where content and pages are created. However, when creating a new page, the components are copied inside 050 - web - global; the wrong publication. As we're moving to a training, I'd imagine that dynamically created components like this might clog the CMS with content in the wrong location, making it unusable for other publications. Is there a reason for this behaviour, and if so, a way to make this work properly?
If you set the BluePrint Context for Components to the Publication where you want them to be created, it should work as you expect.
My page is showing regular component presentations very well.
I have a flash/video file in my local machine and i want to upload this file on my page.
How can I achieve this?
I have this code snippet for rendering components on my page:
<!-- TemplateBeginRepeat name="Components" -->
<!-- TemplateBeginIf cond="ComponentTemplate == 'HomePageCT'" -->
##RenderComponentPresentation()##
<!-- TemplateEndIf -->
<!-- TemplateEndRepeat -->
Please provide all details related to flash files and video files.
Placing a Flash file on a page follows exactly the same process as placing any image in the output of your templates. The steps are outlined below:
Create a Multimedia Schema which allows the Flash multimedia type (e.g. Flash Video Schema)
Upload your Flash file using your new Schema
Create a Component Template to render the HTML you want to use to display the Flash file, and actually publish the binary itself. (e.g. Display Flash CT)
Create a page template (you seem to have done this part) which renders the Page, and renders the Components on the page using ##RenderComponentPresentation()##
Create a Page, and place your Flash file on it using the Display Flash CT
Publish the Page
Without details of the output you want to produce, it is hard to provide the sample Dreamweaver Template Building Block code for the DisplayFlash CT, but it might look something like this:
<embed src="##Component.Id##" allowFullScreen="true" width="540"
height="438" bgcolor="#000000" type="application/x-shockwave-flash"
pluginspage="http://www.macromedia.com/go/getflashplayer">
</embed>
Make sure you use the Default Finish Actions TBB after this in your Component Template so that the src link is processed and the binary is published.
There is nothing special about Flash files with Tridion. They can be treated just like any other Multimedia Component. You can upload them into the CME (or by using Webdav) and thus you will have a Multimedia Component. Make sure of course, that you Multimedia Schema allows the Flash (and extension) as Multimedia Type.
Regarding how you put the Flash file on the Page - again just like a normal Multimedia Component. In your CT you have to generate the output that will make use of your Flash file URL somewhere. You will have to publish your Flash MMC in order to get its URL. You can use Engine.AddBinary or RenderedItem.AddBinary methods for that, or use the Publish Binaries in Package Default TBB, if your MMC is in the package. Then you can simply refer to your Flash URL as package item. Have a look at this URLs for some inspiration: http://yatb.mitza.net/2012/03/publishing-images-as-variants.html (your case doesn't have to be that complex) and http://yatb.mitza.net/2012/04/referencing-image-variants-from.html.
There are several approaches to rendering Multimedia with a Tridion-managed page.
Multimedia components can be:
Part of a component presentation, added to a page with a template selected
As a linked-to multimedia component within a "container" component, which is added to a page
In a rich text format (RTF) area within another component
You could also just publish binaries with dynamic component templates and handle the markup and links outside of Tridion. Get creative with the above basic scenarios depending on the markup and/or metadata you need.
Chris addresses #1 and Mihai explains schema setup and .AddBinary. The second option would be similar, except you'd have to get the referenced ID rather than the component on the page. The third option requires you to parse multimedia within RTF which depends on your templating language and multimedia type.
I've seen XSLT (<xsl:template match="">), grep, and various .replace options to parse specific markup such as Flash videos.
I could do with a little guidance if possible..
I'm building a class library to contain custom web controls. I've transformed many of the jQuery UI elements into .NET classes for dynamic use in pages. e.g.
Dim Msg As New Dialog("Dialog Title", New LiteralControl("Dialog Content"))
Msg.Width.Value = 500
Msg.Height.Value = 300
Me.Controls.Add(Msg )
The necessary scripts get inserted into the head during CreateChildControls, and any jQuery file references are added to the head e.g.
RegisterScriptFile("~/Scripts/jquery-1.5.1.js")
RegisterScriptFile("~/Scripts/UI/jquery.ui.core.js")
RegisterScriptFile("~/Scripts/UI/jquery.ui.widget.js")
RegisterScriptFile("~/Scripts/UI/jquery.ui.mouse.js")
RegisterScriptFile("~/Scripts/UI/jquery.ui.draggable.js")
RegisterScriptFile("~/Scripts/UI/jquery.ui.position.js")
RegisterScriptFile("~/Scripts/UI/jquery.ui.resizable.js")
RegisterScriptFile("~/Scripts/UI/jquery.ui.dialog.js")
The WebControl base class handles inserting the references into the Page Head.
This is brilliant, however there's a problem...the file paths may differ between applications which consume the control library.
My choices that I can see are:
A) Embed the files as resources within the library itself....however the CSS styling would be non-customisable between the individual aplications, and any changes to CSS/JS would need a re-compile.
B) Define and use a standardised file heirarchy. Each application needing a folder call 'Scripts' with a fixed file heirarchy within, so the control knows where to reference the required files. The problem I can see here is that it might not always be possible to use this standardised heirarchy and could make using the library cumbersome.
C) Create a property for each control, for each file it requires. Again this would become cumbersome and a pain to use, because each instantiated control would have to have those properties set.
D) Make some kind of ResourceUrlLibrary Dictionary like class which the consuming app can populate, then give to each control as it's instantiated. However, this seems convoluted and could cause confusion for other developers.
If anyone has come across this problem and could spare me some guidance that would be brilliant :)
If its a custom control, it has a reference to the Page class, which then has a method call ResolveClientUrl to generate a relative URL for you. So that can take care of that scenario. You may want to expose a ScriptsFolder property that allows you to store the path to the scripts rather than hard-coding it too.
If this is for your own custom project, standardizing on a folder is fine, but if you are creating a common library to be reused, requiring a specific folder isn't a good idea, and you can then use the ScriptsFolder property to remedy this, or store the folder path in the config. It's OK to standardize on the use of an application setting.
To confirm, I use Telerik controls, and they go the route of having a property that defines a custom path to the script (since they rely on one for a specific control), and they also have certain settings that can be overridden by adding an application setting.
HTH.