pipfroschpress

<p>The jQuery that current ships as part of WordPress is (as of WP 5.4.1) an older version of jQuery. As in ancient. This plugin allows you to instead use a much more modern version of jQuery, with optional compatibility for scripts that need the older jQuery calls.</p>
<p>This plugin also optionally allows you to securely select a public CDN for jQuery, including the appropriate Subresource Integrity (SRI) and CrossOrigin attributes. Using a CDN can speed up the loading of your website as there is a good chance a client visiting your website already has the identical file in their browser cache and does not need to fetch it again.</p>
<p>When a CDN is used, a small amount of code is added to your pages to provide a fallback where jQuery and the jQuery Migrate plugin are served from your site if either the CDN can not be reached by the client or if the SRI check fails.</p>
<p>The updated jQuery will not replace the core jQuery for administration pages. This is to avoid potential breakage of administrative pages.</p>
<p>The options for this plugin are managed from the WordPress ‘Dashboard’ in the ‘Settings’ area, using the ‘jQuery Options’ menu option within the ‘Settings’ area.</p>
<h3>Plugin Options</h3>
<p>There are four configurable options you can customize.</p>
<h4>‘Use Migrate Plugin’ option</h4>
<p>Enabled by default.</p>
<p>You may disable compatibility with scripts that require older versions of jQuery. This is not recommended.</p>
<p>The jQuery Migrate plugin provides compatibility with jQuery 1.9 through 3.0. It is enabled by default and provides compatibility with the version of jQuery that currently (WP 5.4.1) ships in WordPress, which is jQuery version 1.12.4.</p>
<p>Scripts written to use the version of jQuery that ships with WordPress may be registered with a dependency of <code>jquery-core</code> but use functions that are no longer supported in jQuery 3.5.1. When ‘Use Migrate Plugin’ is enabled, scripts that are registered with a dependency of <code>jquery-core</code> will trigger enqueuing of the Migrate plugin so that those scripts written for the older jQuery will still work. When ‘Use Migrate Plugin’ is disabled, then enqueuing of the Migrate plugin will only happen if scripts explicitly specify <code>jquery-migrate</code> or <code>jquery</code> as a dependency.</p>
<p>If some jQuery scripts break even with ‘Use Migrate Plugin’ enabled, they are likely written for jQuery prior to version 1.9. The only option in that case is to not use this plugin until you have upgraded that very old code.</p>
<p>It is highly recommended you update such old code as soon as possible, whether or not you plan to use this plugin.</p>
<h4>Note</h4>
<p>Please note that WordPress has provided jQuery for years, this results in many plugins and themes using jQuery out of convenience when they really did not need to.</p>
<p>Rumor is that a future release of WordPress may only use native JavaScript for everything JavaScript in WP Core. If hiring a JavaScript developer to update old jQuery code, make sure the JavaScript developer is wise enough to know when porting the code to native JavaScript makes more sense than continuing to use jQuery and when using jQuery really is the best approach. In other words, do not hire someone like me, I pretty much only use jQuery but that is admittedly not always the best approach, just the convenient approach.</p>
<h4>‘Use Content Distribution Network’ option</h4>
<p>Disabled by default.</p>
<p>By default, the updated jQuery scripts are served from within this WordPress plugin. This is because responsible plugin and theme developers do not (in my opinion) utilize third party resources by default.</p>
<p>I recommend you enable this option however doing so will result in front-end pages being served that reference a Third Party Resource. Links to those services and their privacy policies follows the section on Plugin Options.</p>
<h4>‘Use Subresource Integrity’ option</h4>
<p>Enabled by default.</p>
<p>This option only has meaning when the ‘Use Content Distribution Network’ option is enabled.</p>
<p>This option will add a Subresource Integrity hash that browsers can use to verify the resource retrieved is valid opposed to a modified possible trojan.</p>
<p>The only logical reason I can think of to disable this option is if you already have a different plugin that manages Subresource Integrity.</p>
<h4>‘Select Public CDN Service’ option</h4>
<p>Set to ‘jQuery.com CDN’ by default.</p>
<p>This option only has meaning when the ‘Use Content Distribution Network’ option is enabled.</p>
<p>This option lets you select which public CDN you wish to use from a list of five Public CDN services that are listed at https://jquery.com/download/#using-jquery-with-a-cdn</p>
<p>For many websites, the default ‘jQuery.com CDN’ is <em>probably</em> the best choice but it may not be the best choice for all websites, depending upon where the majority of your users are located geographically and which public CDN has a better response time in that geographical region.</p>
<h3>External Third Party Services</h3>
<p>When you enable the CDN option (recommended but disabled by default) a third party service will be used. You should make sure your website Privacy Policy makes users are aware of this. In the current version of WordPress (WP 5.4.1), the default Privacy Policy does make users aware that third party resources may be used, but you have to actually publish that policy and you should check it yourself in case it has been modified or in case the policy you have predates the current default policy and does not include a Third Party Resource notice.</p>
<p>This plugin <em>always</em> sets the <code>crossorigin="anonymous"</code> attribute in association with the Third Party Service. This attribute instructs the browser not to send cookies or any other authentication information to the third party when retrieving the resource. Most modern browsers respect this attribute but some may not.</p>
<p>By default, the plugin will set the <code>integrity="[[expected base64 encoded hash]]"</code> attribute in association with the Third Party Service. This instruct the browser not to use the downloaded resource if the hash does not match, protecting your users from possible trojans.</p>
<p>For SRI, this plugin uses the hashes associated with the files as provided by https://jquery.com/download/ with one exception (see the Hard-coded SRI Hashes section of this readme).</p>
<p>These are the potential third party services:</p>
<h4>jQuery.com CDN</h4>
<p>The default CDN used by this plugin when a CDN is enabled.</p>
<p>Link to service: https://code.jquery.com/</p>
<p>jQuery.com CDN is actually powered by StackPath.</p>
<p>Link to service: https://www.stackpath.com/<br />
Privacy Policy: https://www.stackpath.com/legal/privacy-statement/</p>
<h4>CloudFlare CDNJS</h4>
<p>When you have a CDN enabled and have selected the CloudFlare CDNJS option then<br />
the CloudFlare CDNJS service will be used.</p>
<p>Link to service: https://cdnjs.com/libraries/jquery/</p>
<p>For jQuery, CDNJS is powered by CloudFlare.</p>
<p>Link to service: https://www.cloudflare.com/<br />
Terms of Use: https://www.cloudflare.com/website-terms/<br />
Privacy Policy: https://www.cloudflare.com/privacypolicy/</p>
<h4>jsDelivr CDN</h4>
<p>When you have a CDN enabled and have selected the jsDelivr option then the<br />
jsDelivr CDN will be used.</p>
<p>Link to service: https://www.jsdelivr.com/<br />
Privacy Policy: https://www.jsdelivr.com/privacy-policy-jsdelivr-net</p>
<h4>Microsoft CDN</h4>
<p>When you have a CDN enabled and have selected the Microsoft CDN option then the Microsoft CDN will be used.</p>
<p>Link to service: https://docs.microsoft.com/en-us/aspnet/ajax/cdn/overview<br />
Terms of Use: https://docs.microsoft.com/en-us/legal/termsofuse<br />
Privacy Policy: https://privacy.microsoft.com/en-us/privacystatement</p>
<h4>Google CDN</h4>
<p>When you have a CDN enabled and have selected the Google CDN option then the Google CDN will be used.</p>
<p>Link to service: https://developers.google.com/speed/libraries<br />
Terms of Use: https://developers.google.com/terms/site-terms<br />
Privacy Policy: https://policies.google.com/privacy</p>
<p>The Google CDN does not host the jQuery Migrate plugin. When you have a CDN enabled and the Migrate option enabled and have selected the Google CDN option then the jQuery.com CDN will be used for the jQuery Migrate plugin. The Privacy Policy for that CDN is listed earlier in this <code>readme.txt</code> file.</p>
<h3>Hard-coded SRI Hashes</h3>
<p>This plugin includes hard-coded Subresource Identity public hashes for the minified versions of the jQuery core library and the jQuery Migrate Plugin.</p>
<p>For a better understanding of what SRI is and why hard-coding the hashes is a necessary security feature, please see the file <code>SubResourceIntegrity.md</code> in this directory.</p>
<p>The hard-coded hashes can be verified against what is published at the https://code.jquery.com/ website.</p>
<p>Click on the minified link for the same version of jQuery (3.5.1) and a window will pop up with a script tag including the same SRI as what is defined by the <code>PIPJQVSRI</code> constant in <code>versions.php</code>.</p>
<p>Click on the minified link for the same version of jQuery Migrate (3.3.0) and a window will pop up with a script tag including the same SRI as what is defined by the <code>PIPJQMIGRATESRI</code> constant in <code>versions.php</code>.</p>
<h4>CloudFlare CDNJS and jdDeliver CDN</h4>
<p>The minified jQuery Migrate plugin hosted at CloudFlare CDNJS and jsDelivr CDN have the following addition at the end of the JS file that cause their hash to be different:</p>
<pre><code>//# sourceMappingURL=jquery-migrate.min.map
</code></pre>
<p>For this reason, an SRI specific to them is used when CloudFlare CDNJS or jsDelivr CDN is the selected Public CDN.</p>
<p>This SRI value can be obtained from https://cdnjs.com/libraries/jquery-migrate</p>
<p>Mouse over the minified version and from the menu that appears select <em>Copy SRI</em> and the SRI that matches the file they serve will be copied to your clipboard and if the version is the same, it will match what is defined by the <code>PIPJQMIGRATESRI_CDNJS</code> constant in <code>versions.php</code>.</p>
<h3>Public CDN Notes</h3>
<p>As of May 28th, 2020 the following notes apply.</p>
<p>The Microsoft CDN does not yet have current versions of either the core jQuery library or the Migrate plugin. If you select that CDN, the files will be served from your host until the Microsoft CDN has them.</p>
<p>The Google CDN does not host any version of the jQuery Migrate plugin. If you select that option and have the Migrate plugin enabled, that plugin will be served from the jQuery.com CDN.</p>
<h3>Plugin / Theme Compatibility</h3>
<p>This plugin does not set the version for jQuery when registering the script. Unfortunately when registering a script with a version in WordPress, it always applies the query tag <code>?ver=whatever</code> to the end of the resource and doing so with a CDN greatly reduces the odds that a browser will recognize it already has the scripts cached. Some plugins and themes may query for the version of jQuery being used. They should not do so, but some do. They will not get an answer if this plugin has run before they run and they will get the wrong answer if they run before this script has run.</p>
<p>jQuery scripts that depend upon certain versions should query for the capability within the JavaScript rather than depending upon a version specified to WordPress which may not always reflect what is actually served.</p>
<h3>Update Policy</h3>
<p>I will try to update this plugin when new versions of jQuery are released but it may not be as fast as some may like. You can bug me by leaving sending an e-mail to pipfroshpress[AT]gmail[DOT]com.</p>
<p>Please note updates to this plugin with new versions of jQuery will not be pushed until that majority of the supported CDNs have the file. New versions also will not be published if the accompanying Migrate plugin does not give support for scripts written for jQuery 1.12.4.</p>
<p>For the included jQuery Migrate plugin, I am less likely to notice when new versions are available but I do check whenever a new version of jQuery itself is released. Again you can bug me if needed.</p>
<p>Development takes place on github at https://github.com/pipfrosch/pipfrosch-jquery</p>
<p>The <code>master</code> branch will usually be exactly the same as what is distributed through WordPress except it will have a small <code>README.md</code> file. The branch <code>pipjq</code> is where I develop and what is in that branch may not always be stable. When a new release is ready <em>and tested</em> from the <code>pipjq</code> branch, it will be merged with <code>master</code> and then repacked for distribution through the WordPress SVN.</p>
<p>Please use the distribution from WordPress rather than from github unless you are testing. The version from WordPress is audited by more eyes than my github.</p>
<h3>Versioning Scheme</h3>
<p>Versions use the standard <code>Major.Minor.Tweak</code> scheme using integers for each. Code in my github may have a <code>pre</code> appended at the end to indicate is not a released version and should not be used on production systems.</p>
<h4>Tweak bump</h4>
<p>The <strong>Tweak</strong> is incremented by one when a minor change is made, such as adding a new language to the translation support. Generally you can ignore upgrading this plugin when there is just a <em>Tweak</em> bump.</p>
<h4>Minor bump</h4>
<p>The <strong>Minor</strong> is incremented by one when a functional bug is fixed or when an update to jQuery or the jQuery Migrate plugin is made that is not a substantial jQuery change. When <em>Minor</em> is bumped, <em>Tweak</em> will reset to <code>0</code>. Generally you should upgrade when <em>Minor</em> is bumped.</p>
<h4>Major bump</h4>
<p>The <strong>Major</strong> will be incremented when there is an upgrade to jQuery that is significant in nature. Both <em>Minor</em> and <em>Tweak</em> are reset to <code>0</code> when <em>Major</em><br />
is bumped.</p>
<p>Generally you should test an update to <em>Major</em> before updating on a production system just in case some of your jQuery code needs tweaks before deployment.</p>
<h3>Translations</h3>
<p>This plugin is ready for translations but so far does not actually have any. Note that the only strings where translations are beneficial require administrative privileges to see (the Settings). Hopefully translations will soon be made for the benefit of WordPress administrators who have a preferred written language other than English.</p>
<h3>Developers</h3>
<p>If you have a plugin or theme that wants to know about versions, the following options are defined if this plugin is active:</p>
<ul>
<li><code>pipjq_plugin_version</code> defines the plugin version.</li>
<li><code>pipjq_jquery_version</code> defines the jQuery version.</li>
<li><code>pipjq_jquery_migrate_version</code> defines the jQuery Migrate plugin version</li>
</ul>
<p>All three those of those options are defined as strings.</p>
<p>You can also get them directly from the defined constants <code>PIPJQ_PLUGIN_VERSION</code>, <code>PIPJQV</code>, and <code>PIPJQMIGRATE</code> respectively but I do not guarantee that I will continue to specify them with those constant into the long-term future. For example, if I switch to a more OOP approach they may be defined within a class rather than as constants. The options however will always be defined.</p>


Pipfrosch jQuery

Use jQuery 3.5.1 and jQuery Migrate 3.3.0 with your WordPress powered website with a third party CDN if so desired.

Robert Neu

Ozzy Rodriguez

Cipher

<p>WP Featherlight is a WordPress lightbox plugin for adding a minimal, high-performance, responsive jQuery lightbox to your WordPress website. At its core, WP Featherlight is a WordPress plugin wrapper for the Featherlight jQuery lightbox plugin. When installed, the plugin will automatically display all standard WordPress images and galleries in a simple, minimalistic lightbox popup.</p>
<p>In order for WordPress images and galleries to be lightboxed, you need to select the “Media File” option when choosing where the thumbnails should link. You can also select the “Custom Link” option if you make sure to link directly to an image file. This should work for any image file, even if it’s hosted on another website.</p>
<p>It’s also possible to lightbox videos, iframes, and ajax content with WP Featherlight by adding data attributes to your content. For more details on custom content loading, check out the <a href="https://github.com/noelboss/featherlight/#usage" rel="nofollow ugc">featherlight documentation</a>.</p>
<p>There are no settings for WP Featherlight, so you should be able to install it without needing to configure anything. In the event you don’t want a lightbox on certain pages or posts, there is an option to disable it from within the post editor screen.</p>
<p>If you find a display problem, it may be related to your theme but please <a href="https://wordpress.org/support/plugin/wp-featherlight" rel="ugc">open an support request</a> about it so we can look into it. For more information about the Featherlight script itself, check out their <a href="http://noelboss.github.io/featherlight/" rel="nofollow ugc">GitHub plugin page</a>.</p>
<h4>Developer Notes</h4>
<p>While there are no options in the plugin, there are some handy filters to modify the default behavior. As of <code>0.3.0</code> all images which use the default WordPress captions will also include a caption when the image is lightboxed. To disable this behavior, filter <code>wp_featherlight_captions</code> to false.</p>
<p>You can also disable inclusion of the CSS and JavaScript conditionally using filters which can be found in the <code>/includes/class-scripts.php</code> file. If you have questions about how any part of the plugin works, please don’t hesitate to <a href="https://github.com/cipherdevgroup/wp-featherlight/issues" rel="nofollow ugc">open an issue on GitHub</a>.</p>
<h4>Contributing</h4>
<p>If you’d like to submit code patches or contribute in any other way, please <a href="https://github.com/cipherdevgroup/wp-featherlight" rel="nofollow ugc">fork the plugin on GitHub</a>.</p>


WP Featherlight – A Simple jQuery Lightbox

Needed a lightbox for a project. Installed an other one first which had tons of (for me unnecessary) features and slowed down the page. Downloaded some more of the usual suspects from the repo and just compared them by size. Instead of almost 4 MB (the a.m. one) I came down to less than 200 kB. And it just does what it's supposed to do. Nothing more, nothing less. And the page flies … !

If you care for pagespeed … this is for you!

just been trying 5/6 different lightbox plugins, all of which failed to work and had 100's of options.

tried this one after looking at featherlight Jquery and integrating it directly, this cropped up and I can happily report "it just works"

Thank you 



First lightbox plugin to work out of the box

Sure, it's not full of options, but it does it job and does it well, no bloat. When I need it, it just works.

Thanks for sharing it and the continuous update.

Simple and light

I love minimalism, saving resources and increasing speed, so this is for sure my choice (even though I expect that a recent review was right that the closing could be better on mobiles).

But I needed to extend the captions on pictures to include a copyright notice in the lightbox view (which would have been too much in page view). So I looked at the code and found that the WordPress media library is not queried at all, so no way will we get the media library description for an image.

This is how to get out of that problem with some manual coding on pages: JS finds all images on the page, and gets their captions e.g. target.parent().find( '.wp-caption-text' )

So if the caption contains a <span> this can be used together with the class „featherlight“ of the outer lightbox <div> to add an extended description hidden on the page via CSS but shown in the lightbox.

Thanks to all the contributors and PLEASE keep this great plugin alive!

Super light, no bloat, tip to extend caption in lightbox

An ultra lightweight jQuery lightbox for WordPress images and galleries.

Pipfrosch jQuery vs WP Featherlight – A Simple jQuery Lightbox