Jump to content

[SOLVED] Pop-up lightbox text help

Recommended Posts

Posted

Site URL: https://tarantula-porcupine-bkrr.squarespace.com/

Right now I'm using this code injection in the header:

<link href="//cdn.rawgit.com/noelboss/featherlight/1.4.0/release/featherlight.min.css" type="text/css" rel="stylesheet" />   <script src="//code.jquery.com/jquery-latest.js"></script> <script src="//cdn.rawgit.com/noelboss/featherlight/1.4.0/release/featherlight.min.js" type="text/javascript" charset="utf-8"></script></link>

And this code in the code block:

<a href="#" data-featherlight="#popPK-service">

<h2>

  Population pharmacokinetics </h2>

<p2>

Any more info here</p2>

</h2> <div style="display:none;">

<div id="popPK-service">

<h2 style="font-size:36px;">

Population Pharmacokinetics

</h2>

<p style="font-size:18px;">

 • Derivation of pooled analysis-ready datasets and exploratory tabular and graphical analysis

</p>

  </div>

  </div>

 

However, only three of the five pop-ups work, with the remaining two opening a small, empty square. Is this a problem with the code injection? Any help would be greatly appreciated.

Site: https://tarantula-porcupine-bkrr.squarespace.com/

Password is 1234

Thanks!

  • Replies 4
  • Views 932
  • Created
  • Last Reply
Posted
19 hours ago, dl_23 said:

Site URL: https://tarantula-porcupine-bkrr.squarespace.com/

Right now I'm using this code injection in the header:

<link href="//cdn.rawgit.com/noelboss/featherlight/1.4.0/release/featherlight.min.css" type="text/css" rel="stylesheet" />   <script src="//code.jquery.com/jquery-latest.js"></script> <script src="//cdn.rawgit.com/noelboss/featherlight/1.4.0/release/featherlight.min.js" type="text/javascript" charset="utf-8"></script></link>

And this code in the code block:

<a href="#" data-featherlight="#popPK-service">

<h2>

  Population pharmacokinetics </h2>

<p2>

Any more info here</p2>

</h2> <div style="display:none;">

<div id="popPK-service">

<h2 style="font-size:36px;">

Population Pharmacokinetics

</h2>

<p style="font-size:18px;">

 • Derivation of pooled analysis-ready datasets and exploratory tabular and graphical analysis

</p>

  </div>

  </div>

 

However, only three of the five pop-ups work, with the remaining two opening a small, empty square. Is this a problem with the code injection? Any help would be greatly appreciated.

Site: https://tarantula-porcupine-bkrr.squarespace.com/

Password is 1234

Thanks!

I checked those items, these are now accordion, did you solve this?

image.thumb.png.759b2ad1e8d49035499b0f446faf4f68.png

BeyondSpace - Squarespace Website Developer

🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox - Lightbox captions only mode)
🗓️ Delivery Date Picker (Squarespace Date picker form field)
💫 Gallery block 7.1 workaround
🥳 No-code customisations for Squarespace
🚀 Learn how to rank new pages on Google in 48 hours!

If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you!

Posted
17 hours ago, dl_23 said:

Hey @bangank36

Sorry, should have specified!

I'm trying out 2 options for different possible layouts. The lightboxes are on the "Specialties pop out" page.

remove the # in the id="#...", that error repeat on the last 2 block

image.png.cc402ef0e71950612c858457a1d2c90e.png

BeyondSpace - Squarespace Website Developer

🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox - Lightbox captions only mode)
🗓️ Delivery Date Picker (Squarespace Date picker form field)
💫 Gallery block 7.1 workaround
🥳 No-code customisations for Squarespace
🚀 Learn how to rank new pages on Google in 48 hours!

If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you!

Posted
4 hours ago, bangank36 said:

remove the # in the id="#...", that error repeat on the last 2 block

image.png.cc402ef0e71950612c858457a1d2c90e.png

This was exactly the problem. Thanks so much!

  • dl_23 changed the title to [SOLVED] Pop-up lightbox text help

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.