Skip to content

Instantly share code, notes, and snippets.

Avatar
👨‍💻
Think Twice, Code Once

Saumya Majumder isaumya

👨‍💻
Think Twice, Code Once
View GitHub Profile
@isaumya
isaumya / customize-woocommerce-checkout-fields.php
Created Aug 21, 2020
Customizing WooCommerce Core Checkout Fields (Removing Address Line 2) and also change the placeholder text of Address Line 1
View customize-woocommerce-checkout-fields.php
<?php
/**
* Remove Address Line 2 from WooCommerce Billing & Shipping Form
* Also add proper placeholder for Address line 1 to include the full address
* @author Acnam Infotech
*/
add_filter( 'woocommerce_checkout_fields', function( $fields ) {
if( is_array( $fields ) ) {
// Remove Address Line 2 from Billing & Shipping fields
unset( $fields['billing']['billing_address_2'] );
@isaumya
isaumya / manage-redirection-and-add-security-headers-via-cloudflare-workers.js
Last active Jul 25, 2020
Cloudflare Workers code to manage redirection of a domain and adding extra security headers to the correct hostname
View manage-redirection-and-add-security-headers-via-cloudflare-workers.js
/**
* CloudFlare Worker to handle each request
* and based on the given condition either redirect it to
* the proper URL
* OR add the security headers in case of Status 200
* @author Acnam Infotech
* @explanation https://acnam.com/why-and-how-to-use-cloudflare-workers-explained-with-sample-code/
*/
addEventListener('fetch', event => {
event.respondWith(handleRequest(event.request))
@isaumya
isaumya / remove-woocommerce-bloat-marketing-hub.md
Last active Aug 16, 2020
Easily Remove WooCommerce Bloated Features like Marketing Hub from WordPress Admin Menu
View remove-woocommerce-bloat-marketing-hub.md

Remove WooCommerce Bloated Features from WP Admin Menu

Recently WooCommerce has added a lot of improvements to the plugin which we really appriciate but at the same time a lot of bloated features has alos been added to the plugin like Marketing Hub, a completely useless menu taking extra space among the other important menu items. Now if you find Marketing Hub to be useful, you can keep it.

But just in case you are looking for a way to remove these features that you no longer need from your WordPress Admin menus, take a look at the following code snippets. Please note: though I will show you how you can remove the Marketing Hub from your WP Admin menu list completely and make sure WooCommerce doesn't execute codes for that feature you don't need, you can do the same for other WooCommerce features as well like Analytics.

How to remove Marketing Hub for WooCommerce <= v4.2

If you are using WooCommerce <= v4.2, you can simple add this one line of code in your theme's functions.php f

@isaumya
isaumya / woocommerce-conditional-product-shipping-cost.md
Created May 12, 2020
Enable or Disable Free Shipping or Flat Rate Shipping Based On WooCommerce Product
View woocommerce-conditional-product-shipping-cost.md

Let's say you have a product for which you just want to show the Free Shipping option or the Flat Rate shipping option, you can easuly do it using the following filters.

Hide The Flat Rate SHipping Option For Certain WooCommerce Product

add_filter( 'woocommerce_shipping_flat_rate_is_available', function( $is_available ) {
	// set the product ids that are eligible
	$eligible = array( '1711' );

	// get cart contents
@isaumya
isaumya / get-product-price-by-id-woocommerce.md
Created Apr 29, 2020
A function to get the simple product or variation product's price by passing the product_is or variation_id in WooCommerce.
View get-product-price-by-id-woocommerce.md

When to use it?

Lets say in your template you are doing something like a pricing table, where instead of manually putting the price, you just want to pass the variation_id or the product_id (in case of simple product and dynamically get the price of the product.

This is helpful in many cases:

  • You don't have to manage price in two places & if you update the price of the product it will be reflected everywhere.
  • If you are using country based pricing and want to show the price accordingly.

The Function

@isaumya
isaumya / optimize-svg-files-with-svgo.md
Created Apr 25, 2020
Optimize SVG files with SVGO
View optimize-svg-files-with-svgo.md

Install SVGO

Intsll the node js tool SVGO

$ [sudo] npm install -g svgo

Run Command

svgo *.svg --multipass --enable=removeMetadata,removeTitle,removeDesc
@isaumya
isaumya / native-browser-lazy-loading.md
Last active Nov 14, 2019
Native Browser Lazy Loading - Take Advantage Of It Instead Of Using JavaScript Plugin (Take Work Out of Your Browser Main Thread) 🥳
View native-browser-lazy-loading.md

Native Browser Lazy Loading - Currently supported in Chrome Desktop & Mobile 🥳

If you are using img or the iframe tag you can take advantage of the loading attribute in your HTML and not only it will use the browser's native lazy loading (without using any plugin or javascript for it) it will also make your page faster.

Moreover as this a browser native feature you can get rid of your JavaScript plugins and in terms reduce work load on your Browser's Main Thread and making your web app/site load faster.

This feature is being supported by Chrome Desktop & Mobile as well as the new evergreen Googlebot. Checkout the Chrome Dev Summer 2019 video, also checkout this Can I Use link in case you wanna see the full browser support.

Native Usage for img and iframe Tags

@isaumya
isaumya / http2-server-push-nuxt-js.md
Created Oct 27, 2019
Add HTTP 2 Server Push to Nuxt JS Application (Universal Mode) - Tested in Zeit Now
View http2-server-push-nuxt-js.md

How to do HTTP/2 Server Push in Nuxt.JS App (Tested in Universal Mode & Hosted in Zeit Now)

While developing my Nuxt.js app, the one thing I tried to do most was HTTP/2 Server Push, as I am hosting my app on Zeit Now which does support both HTTP/2 and Server Push. The main reason I wanted to do it was I was using Bootstrap Vue on my project. Whcih add the Bootstrap CSS + Bootstrap Vue's own custom CSS as inline style to the document which was making the document huge. Moreover in bootstrap vue you can do bootstrapCSS: false which will not add the Bootstrap's default CSS to your page, but it will add it's own custom CSS.

Also, in my nuxt have I had a lot of CSS at the component/layout level, which are also getting added to the document as inline style. It was getting crazy. At this point I can either load the bootstrap from a CDN which costed me another external request or I can host it myself (Zeit does have CDN) on my own CDN and then do HTTP/2 server push. So, that is what I diid. I also load a style

@isaumya
isaumya / get-cleint-ip-and-location-details-firebase-cloud-function.md
Created Oct 26, 2019
Get Cleint IP & IP Details with Firebase Cloud Callable Function
View get-cleint-ip-and-location-details-firebase-cloud-function.md

Example Firebase Cloud Function - Callable (not onRequest)

exports.checkReq = functions.region('asia-east2').https.onCall(async (data, { rawRequest }) => {
  try {
    const ip = rawRequest.headers['x-forwarded-for'] || rawRequest.connection.remoteAddress

    const response = await axios.get(
      `http://api.ipstack.com/${ip}?access_key=${IPSTACK_API_KEY}`
    )
@isaumya
isaumya / nuxt-js-firebase-auth-and-cloud-firestore.md
Last active Jul 5, 2020
Nuxt JS: Keep user logged in with Firebase Auth and also fetch the necessary User data from Cloud Firestore and put it in your Vuex store if the user is already logged in before rendering the page
View nuxt-js-firebase-auth-and-cloud-firestore.md

Nuxt JS: Keep user logged in with Firebase Auth and also fetch the necessary User data from Cloud Firestore and put it in your Vuex store if the user is already logged in before rendering the page

Step - 1

Install the required packages.

  • If you use npm npm i firebase firebase-admin cookies js-cookie

  • If you use yarn yarn add firebase firebase-admin cookies js-cookie

You can’t perform that action at this time.