Here’s a visual HTML hook guide for the WooCommerce Single Product Page. through which you can find WooCommerce hooks quickly and easily by seeing their actual locations (and you can copy/paste). If you like this guide and it’s helpful to you Now that you know the Single Product Page hooks, all you need to do in…
You can make the ‘slug’ for the submenu page equal that of the top-level page, and they’ll point to the same place:
In VueJs, you can register your filters in two different ways: Globally and Locally. Filters are JavaScript functions, they take the value to be transformed as the first parameter, but you can also pass in as many other arguments as you will need to return the formatted version of that value. VueJs Global Filters Here is what a…
Axios is a great HTTP client library for making Ajax requests. It’s also quite easy to use with Vue. It uses promises by default and runs on both the client and the server (which makes it appropriate for fetching data during server-side rendering). It provides a simple and rich API. You can combine it with async/await. See…
VueJS does not have a built-in router feauture. We need to follow some additional steps to install it. Direct Download from CDN The latest version of vue-router is available at https://unpkg.com/vue-router/dist/vue-router.js See the Pen VueJs Router by Mohit Sharma (@mohitprakashsharma) on CodePen. The router-link is what we use to generate the links, with “to” we set…
In Vue.js you can output any data value using parentheses: Computed properties are typically dependent on other data properties. They behave exactly like the language standard get/set properties. Any change to the dependent properties will trigger the logic for the computed property.Computed properties are cached based on their dependencies so they’ll only rerun if a dependency changes. (for…
A Vue watcher allows you to listen to the component data and run whenever a particular property changes. A watcher is a special Vue.js feature that allows you to spy on one property of the component state, and run a function when that property value changes. It is most useful when you want to perform…
transition serve as transition effects for a single element/component. The only applies the transition behavior to the wrapped content inside; it doesn’t render an extra DOM element or show up in the inspected component hierarchy. Html:- Style:- Script:- Example:- See the Pen VueJs Transition by Mohit Sharma (@mohitprakashsharma) on CodePen.
Components and Passing Data If you’re familiar with React or Angular, the idea of components and the passing state won’t be new to you. In case you’re not, let’s go through some of the main concepts. This works but isn’t terribly useful as it can only be used once and we’re not yet passing the…
v-once render the element and component once only. On subsequent re-renders, the element/component and all its children will be treated as static content and skipped. This can be used to optimize update performance. Below the example of without using v-once Html:- Script:- See the Pen VueJs v-once by Mohit Sharma (@mohitprakashsharma) on CodePen.