Using javascript/CSS with latte

kevyn124

Hello People,

I've been trying out Latte for the past few weeks, and it's a great tool.

Looking through the documentation, I couldn't find anything about how to use CSS/JSS in templates.

Is there a function that already returns the absolute path or is manual work required?

Šaman

Hi, Kevyn.

If you use Latte together with Nette, you have the {basePath} variable: https://doc.nette.org/…on/templates#…
If you're using Latte Engine on its own, then you'll probably have to pass it into the template yourself.

Example:

	<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
	<script src="{$basePath}/js/netteForms.min.js"></script>

kevyn124

Hey @Šaman thanks for the answer.

That's interesting but just to get everything clear.

The “Latte together with Nette” you mean this Nette Application right?

https://doc.nette.org/en/application

but specifically about the {basePath} variable where does she come from?

Marek Bartoš

It comes from here – https://github.com/…eFactory.php#L71

m.brecher

@kevyn124

The “Latte together with Nette” you mean this Nette Application right?

No “Latte together with Nette” means something different than “Nette Application”. You can use Latte standalone WITHOUT Nette in pure PHP application. In standalone Latte is authomatically generated variable $basePath NOT available.

but specifically about the {basePath} variable where does she come from?

Its created by the Nette framework internally. It is NOT available in default parameters in configuration files:

https://doc.nette.org/…on/bootstrap#…

Last edited by m.brecher (2024-12-02 04:50)

Marek Bartoš

No “Latte together with Nette” means something different than “Nette Application”.

It doesn't, not in this case. Latte, when used with nette/application, has the $basePath variable available. It is set by TemplateFactory from nette/application, as shown in the linked I shared.

It also doesn't have anything to do with nette/bootstrap and the DI parameters it sets.