Hi there, I’ve started using Kirby quite recently and I’m very new to all of this. Here is a simplified example of the situation i’m in: I’m able to use informations like <?= $image->title()?>"> quite simply in my html. But now, i’m making a script that will react when you hover an image. So I’…

It looks like you’re trying to run PHP in a javascript or an HTML file. That won’t work unless you explicitly tell apache to execute .js / .html files as PHP (but you really shouldn’t). [image] paubou: an example ? In a kirby template: <img <?= attr([ 'src' => $image->url(), 'alt' =>…

You can make use of Kirby’s JSON::encode and create a javascript object with all the data you need. Maybe something like this (not tested): <?php $data = JSON::encode([ 'title' => $image->title(), ]); ?> <script> const data = <?= $data ?> $("img").hover(function () { alert(data.title); })…

thanks for the help. Unfortunately, I’m not sure this is working since the console is giving me this error : Uncaught SyntaxError: expected expression, got '<' as I add the new const.

I think it would make more sense to store this information in a data attribute in your HTML you can then reference in your script. That way, your JS can live in a script file. If you need more data, calling a route or content representation could be options

Hi, thanks for the help! I’m not sure it’s very clear for me though… Is there any documentation I could use, or an example ?

Hi rasteiner, Seems pretty clear now. I’ll investigate and dig around that. It’s working and doing what I wanted it to do. Any documentation I could read to try to understand that better? Thanks.

[image] paubou: Any documentation I could read to try to understand that better? There are different topics in my post: There’s Kirby’s attr() function that formats and escapes HTML attributes for elements There’s jQuery’s this in the hover handler, that refers to the event “target” that tr…

Keep in mind you can access the attributes with Vanilla JS too, without the weight of jQuery. [image] Using data attributes - Learn web development | MDN HTML5 is designed with extensibility in mind for data that should be associated with a particular element but need not have any defin…

Using php page informations in javascript

The CMS Questions

jimbobrjames September 29, 2021, 2:38pm 9

Keep in mind you can access the attributes with Vanilla JS too, without the weight of jQuery.

Topic		Replies	Views
Fetching php in javascript Questions v3	3	959	October 1, 2022
Passing image from backend into javascript Kirby Questions	1	316	March 20, 2021
How to load page content using Ajax? Questions v3	5	3106	May 28, 2019
Export all site content as JSON Solutions v2	1	3406	February 6, 2025
Add Images on Website Questions	8	736	February 22, 2021

Using php page informations in javascript

Related topics