Skip to Main Content

Kishor's Blog

Learn how to improve your Core Web Vitals score and Elementor’s Skills to the next level.

Core Web Vitals Related

Preload hero image to improve Largest Contentful Paint

Preload hero image to improve LCP in the Field-data and lab-data

Preload lets you tell the browser about critical resources that you want to load as soon as possible, before they are discovered in HTML. This is especially useful for resources that are not easily discoverable, such as fonts included in stylesheets, background images, or resources loaded from a script.

monitor Core web vitals with web-vitals js

Monitor & Set-up Core web vitals report with Web-vitals JavaScript

Core Web Vitals focuses on three aspects of User Experience – Loading performance (LCP), Interactivity (FID) and visual stability (CLS).

The web-vitals library is a tiny (~1K), modular library for measuring all the Web Vitals metrics on real users, in a way that accurately matches how they’re measured by Chrome and reported to other Google tools (e.g. Chrome User Experience Report, Page Speed Insights, Search Console’s Speed Report).

These web-vitals JS help you generate Report and display in a histogram and timeline of each Web Vitals metric.

Elementor Page Builder & CSS

Sticky header in WordPress using Elementor

How To Create a Sticky Header with Elementor without using any 3rd parties plugins

In this step-by-step article, we will learn how to create a sticky header with Elementor pro without using any 3rd parties addons.

We will also discuss-

  • Learn how to change sticky header change background color on scroll
  • Learn how to swap/ logo when scroll
  • Learn how to change transparent header to sticky header
  • Learn how to shrink header when sticky header is applied and when user scroll
pseudo-elements with Elementor

13 examples of Pseudo-Elements With Custom CSS with the help of Elementor Pro

before and after Pseudo-Elements are really good ways to add style to the Elements without the need for Extra Markup you don’t need.

With the help of Elementor Pro: Custom CSS functionalities, whatever CSS you’re writing and will reflect directly to the editor itself in real-time that makes it super easy and faster and productive.