Skip to content

Commit 4b2aa09

Browse files
committed
add docfor static js and css resource registry
1 parent 3feec82 commit 4b2aa09

File tree

1 file changed

+68
-0
lines changed

1 file changed

+68
-0
lines changed

docs/classic-ui/static-resources.md

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,12 +15,80 @@ We often want to ship a website with a static resource, such as an image, icon,
1515
For this, we need to register static resources.
1616

1717

18+
## Registering javascript and css
19+
20+
To register a static resource in Plone 6, we need to use the `plone.base.interfaces.resources.IBundleRegistry` interface.
21+
22+
The following example registers a Javascript resource in `browser/profiles/default/registry` of your Plone 6 project.
23+
The js files have to be in the `browser/static` folder of your Plone 6 project.
24+
25+
```xml
26+
<registry>
27+
<records interface="plone.base.interfaces.resources.IBundleRegistry" prefix="plone.bundles/jscript">
28+
<value key="enabled">True</value>
29+
<value key="jscompilation">++plone++myproject.site/javascript.min.js</value>
30+
<value key="load_async">False</value>
31+
<value key="load_defer">False</value>
32+
<value key="depends">plone</value>
33+
</records>
34+
</registry>
35+
```
36+
37+
You can register a CSS resource in the same way.
38+
39+
```xml
40+
<registry>
41+
<records interface="plone.base.interfaces.resources.IBundleRegistry" prefix="plone.bundles/css">
42+
<value key="enabled">True</value>
43+
<value key="csscompilation">++plone++myproject.site/style.min.css</value>
44+
<value key="jscompilation">++plone++myproject.site/javascript.min.js</value>
45+
<value key="load_async">False</value>
46+
<value key="load_defer">False</value>
47+
<value key="depends">plone</value>
48+
</records>
49+
</registry>
50+
```
51+
52+
Registering a js file and a css file in the same bundle is also possible.
53+
54+
```xml
55+
<registry>
56+
<records interface="plone.base.interfaces.resources.IBundleRegistry" prefix="plone.bundles/css">
57+
<value key="enabled">True</value>
58+
<value key="csscompilation">++plone++myproject.site/style.min.css</value>
59+
<value key="depends">plone</value>
60+
</records>
61+
</registry>
62+
```
63+
64+
1865
(classic-ui-static-resources-available-attributeslabel)=
1966

2067
## Available attributes
2168

69+
The following attributes are available for registering a static resource:
70+
71+
`enabled`
72+
: Whether the bundle is enabled or not. If it is disabled, the bundle will not be loaded.
73+
74+
`jscompilation`
75+
: The path to the compiled js file.
76+
77+
`csscompilation`
78+
: The path to the compiled css file.
79+
80+
`depends`
81+
: A list of bundles that this bundle depends on.
82+
83+
`load_async`
84+
: Whether the bundle should be loaded asynchronously or not. *Only JS*
85+
86+
`load_defer`
87+
: Whether the bundle should be loaded deferred or not. *Only JS*
88+
2289

2390
(classic-ui-static-resources-loading-order-label)=
2491

2592
## Loading order of resources
2693

94+
`depends` is used to define the loading order of resources, by specifying the name of the depending bundle.

0 commit comments

Comments
 (0)