Tag: frontend

Include JSON Lottie files in Next JS Project

Sometimes, there might be situation arises where we have to add JSON Lottie files in our project for improving UI and also making user friendly. We cannot directly use Lottie files in Next JS project instead we have to do the followings. Install lottie-react using npm i lottie-react –legacy-peer-deps Create a folder to add Lottie… Continue reading Include JSON Lottie files in Next JS Project

Advantages of Next JS as a frontend Framework.

As React became the most widely adopted web framework, encompassing over 40% of developers in 2021 according to Statista, Next.js adoption has also grown dramatically. Vercel, the company that maintains Next.js, cites over 6 million downloads since its launch and 50% usage growth in the top ten-thousand websites for the period of October 2020 to… Continue reading Advantages of Next JS as a frontend Framework.

How to set a template as the front page of wordpress website.

From settings: Visit your site’s dashboard Go to Settings → Reading in the left sidebar: 3.Locate the dropdown option Your homepage displays at the top of the screen: Choose from the following options: Select the — Default — option to use the homepage design from your site’s theme. You can edit the design of this homepage by going to Appearance → Editor. To… Continue reading How to set a template as the front page of wordpress website.

Change the color of the Png image to black in hover.

The color of the image that is inside a parent div can be changed into black using some CSS codes.  The icon images has to change to black while hovering on the parent div.  So we have to call the total div in CSS and make it hover  Then call the div along with the… Continue reading Change the color of the Png image to black in hover.

Project the image gallery to front(150%) without using extra images(while making responsive)

While we are making a site responsive, we can make too many alterations especially while making image gallery responsive. My requirement was to make each of the image project 150% to the front in small devices. One image should occupy the entire row and next image after the other. The cod used here to change… Continue reading Project the image gallery to front(150%) without using extra images(while making responsive)