Author: GeeksLab Technology
Custom HTML plugins on your websites improve its overall functionalities and user experience. Here’s are easy steps to help you create and integrate custom HTML plugins:Step 1: Define the Purpose of Your PluginBefore starting, clearly define what you are doing and the purpose of your plugin. For example:Add a custom contact form.Display dynamic content.Integrate a third-party service.Create a custom widget (e.g., a weather widget).Step 2: Plan the Plugin StructureDecide how your plugin will integrate with your website:Standalone HTML/CSS/JS: A simple plugin that can be embedded directly into your site.Reusable Component: A plugin that can be used across multiple pages or…
When we work with e-commerce websites, especially when we work on WordPress websites with e-commerce. Then we often need to take partial payment or deposit or delivery charge for the product in advance. There are some WordPress plugins with which we can easily solve this problem.Today we will see how to charge a deposit or advance delivery charge on an e-commerce website in wordpress.Step 1: Plugin installation:From your wordpress dashboard, go to Plugins > Add new PluginSearch for: WooCommerce Deposits and Partial PaymentsBefore install and activation, make sure you have installed and activated the woocommerce plugin. Plugin Link: WooCommerce Deposits and Partial…
Integrating external API data into a WordPress site can be done in multiple ways, depending on your needs.Following the below steps, how you can fetch and display data from an external API in WordPress. We will do this in a live server without any wordpress plugin but you can do this in localhost also.Step 1: WordPress functions:You can use wp_remote_get() or wp_remote_post() to fetch data from an API and display it on your WordPress site.We will use https://jsonplaceholder.typicode.com/users this link for users data and our shortcode will be ‘external_data’. Step 2: Use shortcode:Create a new page and put the shortcode in…
Swiper Slider is a responsive jQuery plugin used for creating sliders on websites.Following the below steps, you will learn how to set up jQuery Swiper Slider on your website.Reference site: Click HereStep 1: Include jQuery and Swipe Slider Libraries:Make sure you have both the jQuery library and the Swipe Slider plugin included in your project. Copy <!– Include jQuery –> <script src=”https://code.jquery.com/jquery-3.6.0.min.js”></script> <!– Include the Swipe Slider jQuery Plugin –> <link rel=”stylesheet” href=”path/to/your/swipe-slider.css”> <script src=”path/to/your/jquery.swipeSlider.min.js”></script> Step 2: Inside the HTML Structure:Create an HTML structure for your Swipe Slider. Wrap your slider items in a container with a class, such as…
OWL Carousel is a responsive jQuery plugin used for creating carousels or sliders on websites.Following the below steps, you will learn how to set up jQuery OWL Carousel on your website.Reference site: Click Here Step 1: Include jQuery and OWL Carousel:You need to include jQuery and the OWL Carousel files in your project. You can either download them or use CDN links. Copy <!– Include jQuery –> <script src=”https://code.jquery.com/jquery-3.6.0.min.js”></script> <!– Include OWL Carousel CSS –> <link rel=”stylesheet” href=”https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css”> <!– Include OWL Carousel theme –> <link rel=”stylesheet” href=”https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.theme.default.min.css”> <!– Include OWL Carousel JS –> <script src=”https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js”></script> Step 2: Inside the HTML Structure:Create…
Adding a jQuery Magnifying Popup lets people zoom in on pictures or parts of a webpage with a magnifying glass effect in a popup window. You can do this by using Magnific Popup (a well-known lightbox plugin) together with ElevateZoom or jquery.magnify to create the zoom effect.Following the below steps, you will learn how to set up jQuery Magnifying Popup on your website.Reference site: Click HereStep 1: Include Required Libraries:Add jQuery, Magnific Popup, and a magnifying plugin like ElevateZoom or jquery.magnify. Copy <!– jQuery –> <script src=”https://code.jquery.com/jquery-3.6.0.min.js”></script> <!– Magnific Popup –> <link rel=”stylesheet” href=”https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/magnific-popup.min.css”> <script src=”https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/jquery.magnific-popup.min.js”></script> <!– ElevateZoom –> <script…
Lightbox is the preferred jQuery plugin for images, galleries and media for webpages as it renders them in an elegant overlay. It improves the UI/UX of the website because the images can be viewed without leaving the page. Following the below steps, you will learn how to set up jQuery Light Box on your website.Reference site: Click HereStep 1: Include jQuery and Lightbox Plugin:Before using the Lightbox, you need to include jQuery and the Lightbox plugin files for CSS & JavaScript in your project. Or, you can also download the files and host them locally.Step 2: How to use a CDN:Add…
WordPress security is an important issue, especially when your website contains sensitive data or you run a blog or business site. Below are some simple steps you can take to increase the security of your WordPress site without any coding:1. Use strong passwords:Strong password for admin account: Use a complex and strong password for your admin account. Use uppercase letters, lowercase letters, numbers, and special symbols in the password.Password policy for users: If you have multiple users on your site, encourage them to use strong passwords as well.2. Enable Two-Factor Authentication (2FA):Using a plugin: You can enable two-factor authentication using…
A WordPress child theme is a copy or version of a WordPress theme that allows customization and changes without affecting the functionality and design of the parent theme. By using child themes you can change the design and functionality of your website without changing the code of the main theme. This reduces the risk of losing your customizations in an update to the original theme.In this post we will discuss the advantages of child themes, how to create a child theme and other details:Advantages of child themes:Protection of the original theme: Updates do not cause any problems as the code…
Sometimes, we need to set up country flags and phone number input in Contact Form 7 (CF7). For this, you need to use a plugin. This plugin will allow users to select their country code with a flag and enter a properly formatted phone number in Contact Form 7 (CF7).To set up country flags and phone number input in Contact Form 7, you can follow these steps:Plugin setup: Log in to your wordpress dashboard.Go to Plugin > Add new plugin.If Contact Form 7 (CF7) is not installed, search, install and activate the plugin.Search for Country & Phone Field Contact Form 7.Install…