Foxscribbler's Site LogoFoxscribbler's Site Logo
Close
Image

Latest Blog Posts

Diagram comparing render-blocking CSS and inline critical CSS showing faster above-the-fold rendering with deferred full stylesheet loading

Critical CSS: How to Optimise CSS Delivery and Fix Render‑Blocking CSS

Critical CSS helps your pages load faster by delivering only the essential above-the-fold styles first and deferring the rest. In this guide, you’ll learn why Critical CSS is better than inlining all used styles, how render-blocking CSS slows down...

Image

How to create an Elementor Dark Mode Switch without plugin in 2026

In this tutorial You will learn how to create an Elementor dark mode switch without plugin by utilizing Elementor Global colors that allow you to manage colors for both light and dark modes efficiently

Image

Community Requests, Bug Fixes, Tips, and Tricks Related To Elementor

This compilation incorporates a comprehensive array of bug fixes and feature requests contributed by our valued community members. We've meticulously curated and integrated these enhancements to ensure a smoother user experience and to address any...

Change Menu items in WordPress

How to change the menu color in WordPress and Elementor?

Rather than using Browser's inspect elements to find the right item, WordPress has an inbuilt feature that is hidden by default but if you follow this tutorial properly we can use this to add our custom CSS classes and change the menu color in...

Remove Unused CSS in Wordpress

Remove unused CSS from Elementor website manually

In this step-by-step tutorial, we will learn how to manually remove unused CSS from the Elementor website without breaking the website.

Create horizontal scroll in elementor

Create horizontal scroll in Elementor with GSAP animation libraries

In this step-by-step tutorial, I will show you how to create horizontal scroll in Elementor with the help of GSAP animation libraries

Pass Core Web Vitals

Core Web Vitals Case Study: How I Identified and Fixed My Site’s Issues

In this Case study of my website, I am going to show you how I identify and fix the Core Web Vitals reported on the Page Speed Insights - field data. You will learn what mistakes I made and you can avoid

Elementor Nav Menu broken

Elementor Nav Menu Broken: 6 Ways To Identify & Troubleshoot

Here are the 5 ways to troubleshoot and Fix the Nav Menu bug in Elementor pro

No DOM effected

2 Easy Steps to Fix the Submenu Icon Indicator Delay

With many attempts to fix the submenu icon indicator delay in the Elementor Nav Menu widget in the Elementor's Forum, this is one of the moments where officials can't solve the issue because of JS dependencies but the community tries to fix it. In...

Post Excerpt Length Not Working in Post Widget

How to Fix the Post Excerpt Length Not Working in the Elementor Post Widget with CSS

In this tutorial, I am going to show you how to fix the post excerpt length not working in Elementor post widget's with the help of CSS

Preloading the hero image

Preload hero image to improve LCP in the Field 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...

transparent sticky header with 6 free plugins

How to Create a Sleek Transparent Sticky Header for Free (WordPress & Elementor)

In this Tutorials i will show you how to create transparent sticky header in WordPress and Elementor for free with 3rd parties plugins and recommendations.

horizontal scroll on mobile

3 Easy Steps to Fix The Horizontal Scroll On Mobile

In this tutorial, we are going to discuss how to troubleshoot and prevent Horizontal Scroll on Mobile just by using CSS and JS with easy 3 steps fast

Elementor Fixed sidebar header

5 Easiest Steps To Create Elementor Fixed Sidebar Header

In this tutorials, I am going to show how to create an Elementor fixed sidebar header with CSS without relying on any 3rd parties plugins

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...

Implement and Host Google Noto fonts Locally

2 Easy ways to host and implement Google Noto Fonts locally

Learn how to implement and Host Google Noto fonts locally using 3rd party plugins & using Elementor Pro without writing a single line of CSS.

Picture written how to create Elementor Sticky header

How to Create Elementor Sticky Header: Transparent, Shrinking Logo Tutorial 2026

A sticky header enhances navigation and brand visibility, keeping essential elements accessible as users scroll. This guide covers how to create a transparent sticky header in Elementor, modify colors on scroll, shrink the logo dynamically, and...

Elementor Templates

10 Free and Pro Elementor templates that are easy to import into projects

Here are lists of 10 Elementor templates that come with a lot of free & pro templates and blocks for the homepage, Landing pages, etc that are easy to use and import on the projects that could save you tons of time without searching over the internet...