Caching: Implement a caching mechanism to store static or less frequently changing content. Popular caching plugins like W3 Total Cache or WP Super Cache can help with this. Lazy Loading: Implement lazy loading for images and other non-critical resources. This ensures that resources are loaded only when they are needed, reducing the initial page load… Continue reading how to optimize the code for Minimizing the main thread work of website(WordPress)
Author: Bibin Johnson
Stop runinng unwanted actions on WooCommerce
Add the following code to the functions.php to stop the action scheduler on the website. function yourprefix_disable_action_scheduler() { if ( class_exists( ‘ActionScheduler’ ) ) { remove_action( ‘action_scheduler_run_queue’, array( ActionScheduler::runner(), ‘run’ ) ); } } add_action( ‘init’, ‘yourprefix_disable_action_scheduler’, 10 ); Now this will disable the running status of all events on the woocoommerce. This may be… Continue reading Stop runinng unwanted actions on WooCommerce
Create a text field in the product data field in the product Data section in woocommerce
// image 5 function add_image_5_meta_field() { global $post; // Get the existing value $image_5 = get_post_meta($post->ID, ‘image_5’, true); // Output the field echo ‘<div class=”options_group”>’; woocommerce_wp_text_input( array( ‘id’ => ‘image_5’, ‘label’ => __(‘Image_5’, ‘woocommerce’), // Updated label ‘placeholder’ => __(‘Enter Image_5 Time’, ‘woocommerce’), ‘desc_tip’ => ‘true’, ‘description’ => __(‘This is a custom meta field for Image_5 time.’, ‘woocommerce’),… Continue reading Create a text field in the product data field in the product Data section in woocommerce
Create a custom inside a product Admin Page to create a editor field
// Add Feature overview meta field to product admin page function add_feature_description_meta_field() { global $post; // Get the existing value $feature_description = get_post_meta($post->ID, ‘feature_description’, true); // Output the field echo ‘<div class=”options_group”>’; echo ‘<p class=”form-field”> <bold><label for=”sub_description”>’ . esc_html__(‘Feature Description’, ‘woocommerce’) . ‘</label></bold> </p>’; wp_editor( $feature_description, ‘feature_description’, array( ‘textarea_name’ => ‘feature_description’, ‘label’ => __(‘Sub Description’, ‘woo… Continue reading Create a custom inside a product Admin Page to create a editor field
Create a custom field on the WooCommerce Category Admin page
function add_custom_category_image() { ?> <div class=”form-field”> <label for=”category_image”><?php esc_html_e(‘Category Image’, ‘textdomain’); ?></label> <input type=”text” name=”category_image” id=”category_image” value=””> <p class=”description”><?php esc_html_e(‘Enter category image URL for this category.’, ‘textdomain’); ?></p> </div> <?php } add_action(‘product_cat_add_form_fields’, ‘add_custom_category_image’, 10, 2); // Save custom category image data when creating or updating a category function save_custom_category_image($term_id) { if (isset($_POST[‘category_image’])) { update_term_meta($term_id, ‘category_image’,… Continue reading Create a custom field on the WooCommerce Category Admin page
To Overide the WooCommerce Templates
add_theme_support( ‘woocommerce’ ); need to Add the following to functions.php After adding this we can override the WooCommerce templates like Archieve-product.php Taxnomy-product_cat.php Single-product.php Files for the Category main page which includes the main categories and the next file includes the subcategory category and Product page with the category is listed in the Taxnomy-product_cat.php file And… Continue reading To Overide the WooCommerce Templates
Build a Simple Static page in GraphCommerce – Magento PWA
Create a new route Add the page GraphQL queries required to render the layout (header, footer) Create a new file, /pages/about/about-us.tsx: export default function AboutUs() { return <>About Us</> } Add GraphQL query In /about/about-us.tsx, replace the previous code with the following: import { PageOptions } from ‘@graphcommerce/framer-next-pages’ import { StoreConfigDocument } from ‘@graphcommerce/magento-store’ import… Continue reading Build a Simple Static page in GraphCommerce – Magento PWA
Overide the product description componenet in magento PWA
In the project, create a new component that extends or replaces the default product description component. For example, you might create a custom component called CustomProductDescription: import React from ‘react’; import { useProductDescription } from ‘@magento/peregrine/lib/talons/ProductFullDetail/useProductDescription’; import defaultClasses from ‘@magento/peregrine/lib/talons/ProductFullDetail/productFullDetail.css’; import { mergeClasses } from ‘@magento/venia-ui/lib/classify’; const CustomProductDescription = props => { const classes =… Continue reading Overide the product description componenet in magento PWA
What is a fetch event in Magento PWA?
After a service worker is installed and the user navigates to a different page or refreshes, the service worker will begin to receive. A event fires every time any resource controlled by a service worker is fetched, which includes the documents inside the specified scope, and any resources referenced in those documents (for example if… Continue reading What is a fetch event in Magento PWA?
Magento PWA Setting Storefront
Setup a storefront project using yarn In your terminal, navigate to the directory where you want to install your storefront project and run yarn create @magento/pwa Select a directory for the installation cd pwa-studio-fundamentals Adding the Custom hostname and SSL Cert. yarn buildpack create-custom-origin ./ NOTE: If you encounter any errors while creating a custom… Continue reading Magento PWA Setting Storefront