Join 2,000,000+ Professionals who use WPCode to Future-Proof Their Websites!
// Using React Router V4 import React from “react”; import { withRouter } from “react-router”; class App extends Component { componentDidMount() { this.unlisten = this.props.history.listen((location, action) => { if (window.om5678_1234) { window.om5678_1234.reset(); } }); } componentWillUnmount() { this.unlisten(); } render()…Continue reading
// Using Vue Router. import Vue from ‘vue’; import Router from ‘vue-router’; Vue.use(Router); const router = new Router ({ // Your vue router settings. }); router.beforeEach((to, from, next) => { if (window.om5678_1234) { window.om5678_1234.reset(); } next(); }); export default router;Continue reading
// Using Vue Router. import Vue from ‘vue’; import Router from ‘vue-router’; Vue.use(Router); const router = new Router ({ // Your vue router settings. }); router.beforeEach((to, from, next) => { if (window.om5678_1234) { window.om5678_1234.reset(); } next(); }); export default router;Continue reading
// Target by ID window.onload = function(){ document.getElementById(“someID”).href=”MONSTERLINK_URL”; }Continue reading
// Target by class name window.onload = function(){ const dynamicMonsterLinks = document.querySelectorAll(“a.myClass”); dynamicMonsterLinks.forEach(dynamicMonsterLinks => dynamicMonsterLinks.href = “MONSTERLINK_URL”); }Continue reading
document.addEventListener(“DOMContentLoaded”, function() { // Create and insert CSS styles for fade-in and fade-out const style = document.createElement(‘style’); style.innerHTML = ` .fade-out { opacity: 0; transition: opacity 0.5s ease-in-out; } .fade-in { opacity: 1; transition: opacity 0.5s ease-in-out; } `; document.head.appendChild(style);…Continue reading
document.addEventListener(‘click’, function(e) { // Check if the clicked element is an anchor with href starting with ‘#’ if (e.target.tagName === ‘A’ && e.target.getAttribute(‘href’) && e.target.getAttribute(‘href’).startsWith(‘#’)) { e.preventDefault(); const targetId = e.target.getAttribute(‘href’).slice(1); // Remove the ‘#’ from the href const targetElement…Continue reading
// Get the butterflies container const butterfliesContainer = document.querySelector(‘.butterflies’); // Create a function to generate a butterfly function createButterfly() { const butterfly = document.createElement(‘div’); butterfly.className = ‘butterfly’; butterfliesContainer.appendChild(butterfly); return butterfly; } // Create multiple butterflies for (let i = 0;…Continue reading
// Convert native WP Code date formats into relative formats function timeAgo(inputDateStr) { let datePart, timePart, monthNames, targetDate; // Check if the format is “Y-m-d g:i A” (e.g., “2024-08-06 at 5:29 PM”) if (/\d{4}-\d{2}-\d{2} at \d{1,2}:\d{2} (AM|PM)/.test(inputDateStr)) { [datePart, timePart]…Continue reading