Go to main content

Textpattern CMS support forum

You are not logged in. Register | Login | Help

#13 2021-08-31 09:35:52

John-Paul F
Member
Registered: 2021-03-15
Posts: 39
Website Twitter

Re: zoom immagine

I’m really struggling with galleries, sliders, pop-ups.

I’ve saved Magnific to a folder in the home directory of my site, as suggested here

I’ve added this code to the head:


<!-- JPF trying to work out where to put this - Magnific Popup CSS -->
<!-- Magnific Popup core CSS file -->
<link rel="stylesheet" href="<txp:site_url />assets/css/magnific-popup.css"> 

<!-- jQuery 1.7.2+ or Zepto.js 1.0+ -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 

<!-- Magnific Popup core JS file -->
<script src="<txp:site_url />assets/js/jquery.magnific-popup.js"></script>

<!-- Your other scripts in the /assets/js/ folder -->
<script src="<txp:site_url />assets/js/slide.js"></script> 
<script src="<txp:site_url />assets/js/generale.js"></script>
<script>
  $(document).ready(function(){ 
    $('.popup').magnificPopup({ 
      type: 'image', 
      gallery: { 
        enabled: true 
      } 
    });
})
</script>

And I’ve added this HTML to a page:

<txp:images id="1323,1324,1325,1326" wraptag="div" break="" class="">
  <a href="<txp:image_url />" title="<txp:image_info type="caption" />">
    <img src="<txp:image_url thumbnail="1" />" width="<txp:image_info type="thumb_w" />" height="<txp:image_info type="thumb_h" />">
  </a>
</txp:images>

When I click on an image, it takes me to the URL for that image, but there’s no way to move forward through images.

Any suggestions?


Strictly Amateur

Offline

#14 2021-08-31 10:47:18

Bloke
Developer
From: Leeds, UK
Registered: 2006-01-29
Posts: 10,520
Website GitHub

Re: zoom immagine

Hmmm, anything in the browser’s console that gives you a clue? Maybe the script isn’t being loaded or something.


The smd plugin menagerie — for when you need one more gribble of power from Textpattern. Bleeding-edge code available on GitHub.

Txp Builders – finely-crafted code, design and Txp

Offline

#15 2021-08-31 14:07:14

John-Paul F
Member
Registered: 2021-03-15
Posts: 39
Website Twitter

Re: zoom immagine

Bloke wrote #331474:

Hmmm, anything in the browser’s console that gives you a clue? Maybe the script isn’t being loaded or something.

Aha!

I didn’t know quite what that even meant, but remembered Firefox has Tools/Web Developer/Web Console, and this is what I found:

Blocked loading mixed active content "http://addtocalendar.com/atc/1.5/atc-style-blue.css"
textpattern
Feature Policy: Skipping unsupported feature name “payment”. v3:1:43442
Feature Policy: Skipping unsupported feature name “payment”. v3:1:43581
Blocked loading mixed active content "http://addtocalendar.com/atc/1.5/atc-style-blue.css"
textpattern
Some cookies are misusing the recommended “sameSite“ attribute 5
Loading failed for the <script> with source “https://flintoff.org/assets/js/jquery.magnific-popup.js”. textpattern:69:1
Loading failed for the <script> with source “https://flintoff.org/assets/js/slide.js”. textpattern:72:1
Loading failed for the <script> with source “https://flintoff.org/assets/js/generale.js”. textpattern:73:1
Feature Policy: Skipping unsupported feature name “payment”. v3:1:42703
Uncaught TypeError: $(...).magnificPopup is not a function
    <anonymous> (index):76
    jQuery 4
textpattern:76:17
Request to access cookie or storage on “https://stats.g.doubleclick.net/j/collect?t=dc&aip=1&_r=3&v=1&_v=j93&tid=UA-93161266-1&cid=1414722234.1604921454&jid=1579429117&gjid=722547583&_gid=2082544116.1630351177&_u=AACAAEAAAAAAAC~&z=1340596566” was blocked because it came from a tracker and content blocking is enabled.

Does that make any sense? I’m out of my depth here.


Strictly Amateur

Offline

#16 2021-09-01 02:38:56

phiw13
Plugin Author
From: Japan
Registered: 2004-02-27
Posts: 2,474
Website

Re: zoom immagine

John-Paul F wrote #331482:

Loading failed for the <script> ………

For some reason – as yet unknown – the <script /> fails to load. It is not clear why though, as the script loads correctly when accessed directly. Something (browser setting ? some adblocker/contentblocker ?) is blocking the page from seeing it though, and then your image pop up fails.


Where is that emoji for a solar powered submarine when you need it ?

Offline

#17 2021-09-01 09:20:17

etc
Developer
Registered: 2010-11-11
Posts: 4,517
Website GitHub

Re: zoom immagine

phiw13 wrote #331486:

For some reason – as yet unknown – the <script /> fails to load. It is not clear why though, as the script loads correctly when accessed directly.

Only flintoff.org/assets/js/jquery.magnific-popup.js loads for me, the others bounce a 404.

Offline

#18 2021-09-01 16:49:08

colak
Admin
From: Cyprus
Registered: 2004-11-20
Posts: 8,724
Website GitHub Twitter

Re: zoom immagine

Did you consider uploading https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js in your site and calling it from there? Also, I echo etc’s observation that
https://flintoff.org/assets/js/slide.js
https://flintoff.org/assets/js/generale.js
return a 404.


Yiannis
——————————
neme.org | hblack.net | State Machines | NeMe @ github
I do my best editing after I click on the submit button.

Offline

#19 2021-09-03 17:00:54

John-Paul F
Member
Registered: 2021-03-15
Posts: 39
Website Twitter

Re: zoom immagine

Thank you Bloke, phiw13, etc and colak.

I think those things are now working, as I had some additional help. But I still don’t seem to be able to create a slider. Clicking on an image just takes me to that particular image’s URL, and I have to use backspace to go back.

Here’s the HTML on that experimental page:

<txp:images id=“1323,1324,1325,1326” wraptag=“div” break=”“ class=“slider”> <a href=”<txp:image_url />” title=”<txp:image_info type=“caption” />”> <img src=”<txp:image_url thumbnail=“1” />” width=”<txp:image_info type=“thumb_w” />” height=”<txp:image_info type=“thumb_h” />”> </a>
</txp:images>

Till now, the page has been a draft but I’ve now published it so you can see what I mean:
https://flintoff.org/experiment-in-art-gallery-display-2


Strictly Amateur

Offline

#20 2021-09-03 17:41:30

uli
Moderator
From: Cologne
Registered: 2006-08-15
Posts: 4,256

Re: zoom immagine

You’ve two scripts not in place, the two immediately below <!-- Your other scripts in the /assets/js/ folder -->


In bad weather I never leave home without wet_plugout, smd_where_used and adi_form_links

Offline

#21 2021-09-03 17:44:27

John-Paul F
Member
Registered: 2021-03-15
Posts: 39
Website Twitter

Re: zoom immagine

uli wrote #331505:

You’ve two scripts not in place, the two immediately below <!-- Your other scripts in the /assets/js/ folder -->

Thanks uli. I’m really sorry, but I’m lost. Do you mean I should add some scripts to this page / HTML, or do I need to add something else to the head form?

And can you tell me what they are?

Last edited by John-Paul F (2021-09-03 17:44:52)


Strictly Amateur

Offline

#22 2021-09-03 17:51:47

uli
Moderator
From: Cologne
Registered: 2006-08-15
Posts: 4,256

Re: zoom immagine

You have these two lines of code somewhere in Textpattern, probably on one of your pages:

<!-- Your other scripts in the /assets/js/ folder -->
<script src="https://flintoff.org/assets/js/slide.js"></script> 
<script src="https://flintoff.org/assets/js/generale.js"></script>

But the files that are called there are not inside those folders or their names are different somehow.


In bad weather I never leave home without wet_plugout, smd_where_used and adi_form_links

Offline

#23 2021-09-03 17:55:13

John-Paul F
Member
Registered: 2021-03-15
Posts: 39
Website Twitter

Re: zoom immagine

uli wrote #331507:

You have these two lines of code somewhere in Textpattern, probably on one of your pages:

<!-- Your other scripts in the /assets/js/ folder -->...

But the files that are called there are not inside those folders or their names are different somehow.

Oh, I see. Thank you. I’ve now deleted them because I just copied them into my page from a post in this thread.

But I still don’t seem to have a slider effect… Hm.


Strictly Amateur

Offline

#24 2021-09-03 18:10:24

uli
Moderator
From: Cologne
Registered: 2006-08-15
Posts: 4,256

Re: zoom immagine

Your code

$(document).ready(function(){ 
    $('.popup').magnificPopup({ 
      type: 'image', 
      gallery: { 
        enabled: true 
      } 
    });
})

expects a class of popup to work its magic, but there is no such class.


In bad weather I never leave home without wet_plugout, smd_where_used and adi_form_links

Offline

Board footer

Powered by FluxBB