I'm trying to make a custom j4 administrator template - but I am unable to get Web Assets to show the CSS or JS of the new template.
<inheritable>0</inheritable>
administrator/test/joomla.asset.json
rename atum
to test
$wa->usePreset('template.test.' . ($this->direction === 'rtl' ? 'rtl' : 'ltr'))
->useStyle('template.active.language')
->useStyle('template.user')
->addInlineStyle(':root {
--hue: ' . $matches[1] . ';
--template-bg-light: ' . $this->params->get('bg-light', '#f0f4fb') . ';
--template-text-dark: ' . $this->params->get('text-dark', '#495057') . ';
--template-text-light: ' . $this->params->get('text-light', '#ffffff') . ';
--template-link-color: ' . $this->params->get('link-color', '#2a69b8') . ';
--template-special-color: ' . $this->params->get('special-color', '#001B4C') . ';
}');
$wa->registerStyle('template.active', '', [], [], ['template.test.' . ($this->direction === 'rtl' ? 'rtl' : 'ltr')]);
I've tried with my own custom template as well.
If we begin to add the full URL in the joomla.asset.json:
{
"name": "template.test.ltr",
"description": "The css file to be used when the site is left to right (LTR).",
"type": "style",
"uri": "media/templates/administrator/test/css/template.min.css",
"dependencies": [
"fontawesome"
]
},
The template file will show, but Font Awesome and Joomla custom elements output to the wrong directory:
/media/vendor/fontawesome-free/css/fontawesome.min.css
/media/vendor/joomla-custom-elements/css/joomla-alert.min.css
ATUM outputs to:
/media/templates/administrator/atum/css/vendor/fontawesome-free/fontawesome.min.css?2464813a5b080100d427b8bdbd12fcaa
PHP: 8.0.28
Joomla: Joomla! 4.3.4 Stable
Labels |
Added:
No Code Attached Yet
|
@dgrammatiko Thanks - that solved my issue. ?
Quick follow-up: Is there a streamlined way to shorten the directory path for asset folders? The current one feels like a maze:
media/templates/administrator/template_name/scss/
Compared to the old, simpler route:
administrator/templates/template_name/css/
Would love to hear any advice for making this less cumbersome. Cheers!
Quick follow-up: Is there a streamlined way to shorten the directory path for asset folders?
If it's a template css/js you can referencing it directly, ie:
This template.min.css
is equal to this media/templates/administrator/template_name/css/template.min.css
. So the media/templates/administrator/template_name/css
is the base (relative) path for css files and media/templates/administrator/template_name/js
is the base (relative) path for javascript files
Status | New | ⇒ | Closed |
Closed_Date | 0000-00-00 00:00:00 | ⇒ | 2023-10-13 15:08:53 |
Closed_By | ⇒ | iamrobert |
That WON'T work!!!
If you want to remove the child templates then you have to also move all the files from
media/templates/administrator/test
toadministrator/templates/test
BUT it's not recommended as this is the legacy way of doing templates...