How to Add Magnifying Zoom for Images in WordPress

Do you want to add an Amazon like magnifying zoom for images in WordPress? Zooming images allow users to see details that they would not see in a normal sized image. In this article, we will show you how to easily add magnifying zoom for… Read More »

The post How to Add Magnifying Zoom for Images in WordPress appeared first on WPBeginner.

The Ultimate Guide to WordPress and GDPR Compliance – Everything You Need to Know

Are you confused by GDPR, and how it will impact your WordPress site? GDPR, short for General Data Protection Regulation, is an European Union law that you have likely heard about. We have received dozens of emails from users asking us to explain GDPR in… Read More »

The post The Ultimate Guide to WordPress and GDPR Compliance – Everything You Need to Know appeared first on WPBeginner.

How to Upload a HTML Page to WordPress without 404 Errors

Do you want to upload a HTML page to your WordPress site? Sometimes you may need to add a static HTML page and make it accessible along with your WordPress site. In this article, we will show you how to properly upload a HTML page… Read More »

The post How to Upload a HTML Page to WordPress without 404 Errors appeared first on WPBeginner.

A Strategy Guide To CSS Custom Properties

CSS preprocessor variables and CSS custom properties (often referred to as “CSS variables”) can do some of the same things, but are not the same.

Practical advice from Mike Riethmuller:

If it is alright to use static variables inside components, when should we use custom properties? Converting existing preprocessor variables to custom properties usually makes little sense. After all, the reason for custom properties is completely different. Custom properties make sense when we have CSS properties that change relative …

The post A Strategy Guide To CSS Custom Properties appeared first on CSS-Tricks.

The backdrop-filter CSS property

I had never heard of the backdrop-filter property until yesterday, but after a couple of hours messing around with it I’m positive that it’s nothing more than magic. This is because it adds filters (like changing the hue, contrast or blur) of the background of an element without changing the text or other elements inside.

Take this example where I’ve replicated the iOS notification style: see how the background of each of these boxes are blurred but the text isn’t?…

The post The backdrop-filter CSS property appeared first on CSS-Tricks.

Responsive tables, revisited

Lea Verou with some extra super fancy CSS trickery. No way we could miss linking this one up!

One of the problems with responsive table solutions, at least the ones where you are using CSS to rejigger things, is that there is duplicated content somewhere. Either in CSS or HTML.

Lea finds two ways to prevent that. One of which uses text-shadow to “duplicate” a copy of the text and move it into place. Another uses the Firefox-only element() function. …

The post Responsive tables, revisited appeared first on CSS-Tricks.

The Ultimate Guide to Headless CMS

(This is a sponsored post.)

The World Has Changed—So Must the CMS

Having a responsive website is no longer enough. Your audience expects a seamless and personalized customer experience across all their devices—the age of headless technology is coming.

Headless CMS is the next generation in content management for brands that want to stay ahead of the curve by engaging customers through the growing number of channels.

Download The Ultimate Guide to Headless CMS ebook for a deep look …

The post The Ultimate Guide to Headless CMS appeared first on CSS-Tricks.

How React Reconciliation Works

React is fast! Some of that speed comes from updating only the parts of the DOM that need it. Less for you to worry about and a speed gain to boot. As long as you understand the workings of setState(), you should be good to go. However, it’s also important to familiarize yourself with how this amazing library updates the DOM of your application. Knowing this will be instrumental in your work as a React developer.

The DOM?

The …

The post How React Reconciliation Works appeared first on CSS-Tricks.

Build Nodejs APIs Using Serverless

Simona Cotin did a great talk at Microsoft Build about Serverless technologies, called “Build Node APIs Using Serverless.” In this talk, she addresses pretty much every major gotcha that you might run into while creating Serverless infrastructure for JavaScript applications. Some of the topics included, but are not limited to:

  • CORS
  • Local Debugging with VS Code
  • Installing npm packages
  • Configuring REST-like URLs
  • Saving environment variables

All in all, it’s one of the best talks on Serverless I’ve seen, and if …

The post Build Nodejs APIs Using Serverless appeared first on CSS-Tricks.