That doesn't look right (or at least complete). Adding/removing a class on a data block doesn't do anything on its own.
You want more like
<div hidden data-datesensitive-show-until="{{my.Expiration Date}}">{{my.Live Content}}</div>
<div hidden data-datesensitive-show-after="{{my.Expiration Date}}">{{my.Expired Content}}</div>
<script>
/*
No need to make any changes to this code!
All config is via data- attributes on
conditional elements, as above.
*/
/*
* Naive date-sensitive element revealer
* @author Sanford Whiteman
* @version v1.1.0 2021-05-15
* @copyright © 2021 Sanford Whiteman
* @license Hippocratic 2.1: This license must appear with all reproductions of this software.
*
*/
(function(){
const arrayify = getSelection.call.bind([].slice);
const now = new Date();
let axes = ["after","until"];
let stor = axes.map(function(axis){
return "[hidden][data-datesensitive-show-" + axis + "]";
}).join(",");
function makeDate(dateLike){
dateLike = dateLike.replace(/ /,"T"); // IE requires 'T' as in ISO 8601:2019
return new Date(dateLike);
};
arrayify(document.querySelectorAll(stor))
.map(function(el){
let conditions = axes.reduce(function(acc,nextAxis){
acc[nextAxis] = el.getAttribute("data-datesensitive-show-" + nextAxis);
return acc;
},{});
return {
el : el,
after : conditions.after ? makeDate(conditions.after) : -Infinity,
until : conditions.until ? makeDate(conditions.until) : Infinity
};
})
.filter(function(desc){
return (desc.after <= now) && (now < desc.until);
})
.forEach(function(desc){
desc.el.hidden = false;
});
})();
</script>
You do not have to alter the JS at all in this method; it automatically applies to an unlimited number of containers with the data-datesensitive-show attribute.
Thanks Sanford,
Not sure why It doesn't work for me.
Copied code straight into an html box in my LP page.
Created the tokens
this is my test - Marketo lp
I mean a link to the real page, not a screenshot.
Hi @SanfordWhiteman ,
Hope you're keeping well!
I am trying to set the expiration on either form or Landing Page once the webinar has expired and navigate to a different landing page.
Out of the other solutions, I tried this code as you've shared years ago but it is not working at my end. Perhaps, I am not passing the right values in the newdate function.
Here is the link to my landing page. Not sure if you can access this.
<div hidden data-datesensitive-show-until="{{my.WBNExpirationDate}}">{{my.WebinarLive-Page}}</div>
<div hidden data-datesensitive-show-after="{{my.WBNExpirationDate}}">{{my.WebinarExpired-Page}}</div>
<script>
/*
No need to make any changes to this code!
All config is via data- attributes on
conditional elements, as above.
*/
/*
* Naive date-sensitive element revealer
* @author Sanford Whiteman
* @version v1.1.0 2021-05-15
* @copyright © 2021 Sanford Whiteman
* @license Hippocratic 2.1: This license must appear with all reproductions of this software.
*
*/
(function(){
const arrayify = getSelection.call.bind([].slice);
const now = new Date();
let axes = ["after","until"];
let stor = axes.map(function(axis){
return "[hidden][data-datesensitive-show-" + axis + "]";
}).join(",");
function makeDate(dateLike){
dateLike = dateLike.replace(/ /,"T"); // IE requires 'T' as in ISO 8601:2019
return new Date(dateLike);
};
arrayify(document.querySelectorAll(stor))
.map(function(el){
let conditions = axes.reduce(function(acc,nextAxis){
acc[nextAxis] = el.getAttribute("data-datesensitive-show-" + nextAxis);
return acc;
},{});
return {
el : el,
after : conditions.after ? makeDate(conditions.after) : -Infinity,
until : conditions.until ? makeDate(conditions.until) : Infinity
};
})
.filter(function(desc){
return (desc.after <= now) && (now < desc.until);
})
.forEach(function(desc){
desc.el.hidden = false;
});
})();
</script>
However, I have not changed much and tried to achieve the output from your code.
Any help would be appreciated.
Kind Regards,
Vidhi
Hi Alec,
Marketo Sky (MS) has an 'Expiration' feature that allows you to set an expiration date for Landing pages & Smart campaigns.
In MS go the the program containing the landing page, navigate to assets where you should see an option for Expiration. Now select the asset and there is a button on the far right 'Set expiration' which allows setting an expiration date and time.
Try it out 😀.
-Manish
Hi Manish,
Marketo Sky (MS) has an 'Expiration' feature that allows you to set an expiration date for Landing pages & Smart campaigns.
That feature doesn't meet the requirements in this case.
thanks Manish, however I need the redirecting to the new landing page as well