We're evolving to serve you better! This current forum has transitioned to read-only mode. For new discussions, support, and engagement, we've moved to GitHub Discussions.

How to get the photoswipe.hbs to work / manipulating the gallery

  • #6101
    Avatar photo[anonymous]


    I am trying to get the gallery to “work”. I see in the templates that are for free that they have added a photoswipe.hbs in the ‘partials’ folder. Adding that file with this content does not give any result. (‘gallerys galleryIndex ‘ is ‘galleryes[galleryIndex].’)

    var photogalleryInit = function(gallerySelector) {
      var gallerys = document.querySelectorAll(gallerySelector);
      for (galleryIndex in gallerys) {
        gallerys galleryIndex setAttribute("data-str", "'This is a test'"); 

    It does work when adding this code in a .js file that is added to the header. But I prefer to do this change on the server-side and not at the client, I guess that photoswipe.hbs will make the changes when generating the website.

    I have only added this file, in a template that I am building from the ground up.

    Is there an easy fix or should I go for doing this client side?

    In front thanks 🙂

    Edit: I want to use my own fullscreen viewer, which I already have added to the other images like the feature image, that is why I am manipulating the code.

    Avatar photo[anonymous]

    Hi. Now I have found out how it works 🙂

    I see that the gallery actually is ‘build up’ at the client and not when Publii generates the pages. But that is fine, and then I do not do any different than what Photoswipe does. Of course, Photoswipe is more advanced.

    So I did find out that you had to import the photoswipe.hbs file to the pages that you want to use that gallery on, just like how the head.hbs and footer.hbs are. That’s why I could not get it to work.

    Nice program. And I am starting to get an overview on how to make a theme now 🙂