New iNat Widget

Trying out the new iNat widget. Added the following code to the layout to the right -->

<div
  data-inat-widget
  data-inat-source="casual-woodland-garden"
  data-inat-source-type="project"
  data-inat-theme="transparent-light"
  data-inat-title="Casual Woodland Garden"
  data-inat-layout="grid"
  data-inat-limit="10"
  data-inat-order-by="observed_on"
  data-inat-compact="true">
</div>
<script 
  src="https://glauberramos.github.io/inat/inat-widget.js">
</script>

Outlinks With Return-To

This is a sample blog post with out-links that access iNat data.  

Sample Out-Link:
Wildlife Activity

If I only wanted to see wildlife activity on goldenrods...
Wildlife Activity ~ Only Goldenrods

A "return to" parameter is automatically appended to the end of the url using the following javascript that's been added to a widget in the footer. 

---

<script> // append return_to to the end of outlinks

document.addEventListener('DOMContentLoaded', function() {

  var pageUrl = encodeURIComponent(window.location.href); 

  document.querySelectorAll('a').forEach(function(anchor) {

    // targets links that point to stockslager github repo

    if (anchor.href.includes('stockslager') ||

anchor.hostname.includes('stockslager') ) {

      const separator = anchor.href.includes('?') ? '&' : '?';

      anchor.href = `${anchor.href}${separator}returnto=${pageUrl}`;

    }

  });

});

</script>