Add “Read More / Read Less†functionality in Elementor Text Editor or any description based on word count
Add a class like rm-25 to any Elementor Text Editor. (You can use any number like rm-10, rm-200 and the number will control the…
Snippets library
WordPress & Shopify Code Snippets
81 fixes pulled straight from client work. Each one is the actual problem, the steps, and the code that solved it. Copy what you need.
Add Animated (Moving) Gradient Effect in any Elementor Section
A Elementor fix, with the code that solves it.
Add Animated Background to Any Section
Add a class to target section: bpers-animated-section
Add Any ACF/SCF Field Using shortcode
Step 1: Enable Shortcode: Add this code in code snippets (php)
Add Copy link button/Icon on any WordPress Page: Step 1: Add a button/Icon etc and give id: copy-post-link Step 2. Add HTML below and Add this code
A WordPress fix, with the code that solves it.
Add custom fonts in shopify
Step 1 — Download Font Files
Add glass effect in wordpress/Elementor in any section background.
Add a class to section: bpers-glass
Add Google Recaptcha In Wp Login Form Without Plugin
Add this php snippet in code snippets.
Adds a custom “Children of Page†condition in Elementor Theme Builder.
Adds a custom “Children of Page†condition in Elementor Theme Builder, allowing you to apply a template automatically to all child pages of a…
Advanced Image with text sections
Advanced Image with text sections
Advanced Subcollections/collection Grid
Advanced Subcollections/collection Grid
Allow upload of VCF/Contact Card in WordPress
A WordPress fix, with the code that solves it.
Animate any section border in elementor or anywhere.
To apply an animated border to any section, you need to use two sections (wrapper + inner section).
Book an Appointment Section – Direct HTML/CSS
This is direct HTML/CSS code that you can directly add in the shopify customize using custom liquid widget/section.
Call Any function/Run any script with Elementor Button
…. Instead of …..
Change any Grid to Horizontal Scroll in Mobile
Main container CSS Class: grid
Change any List style to better using an Image instead of dots
Give content a custom class eg: .cust-service-cont
Change any post Type Name (Posts, Pages, Products) to any other name like Tools etc (In this case products changed to tools)
A WooCommerce fix, with the code that solves it.
Change Header on Scroll – Create New Header on Scroll.
Tutorial Link: https://element.how/elementor-change-header-on-scroll/
Change Shopify Dawn Theme Image Banner to include Video Background
Go to themes > Edit code > Sections > image-banner.liquid
Change/Replace Website Colors WIth One Click Using Code Changes
This is a great way to replace or change colors to whole website just making few changes.
Convert Uploaded Images to WEBP Automatically
Install Code snippets Plugin.
Create 3d gallery on scroll in elementor
You can create a 3d gallery in elementor like this in video: How To Add 3d Image Gallery in WordPress [Elementor]
Creating a Custom WooCommerce Account Journey with Dynamic ACF Fields Based on Purchased Products
Includes reusable code snippets to display specific ACF data based on customer purchases.
Custom Liquid Extended
Custom Liquid Extended
Dawn – Image Banner section with Heading Tags
Dawn - Image Banner section with Heading Tags & Liquid Block with extended limits
Decode Common Special Characters in Meta Titles of Shopify Products of Pages
Often when we use special characters in meta title like &, “â€. â„¢, > or other is shows in title like this: &, &trade,…
Disable Cron Jobs
(Add this in wp - config)
Disable Link of any element/heading with css
Find unique class/selctor/id of that link
Disallow File Edits (Plugin and Theme Installs)
(Add this in wp - config)
Dynamic Sub Collections Display (Grid + Slider) in Collections template on shopify
Go to Shopify Dashboard > Metaobject > Create a metaobject definition. Use the following 👇 names.
Elementor Carousel Pagination dots and Chevron Styling
How To / Short Tutorials by Me:
Elementor Menu Border Width Issue
Add this is custom css
Error 500 Elementor/Server Side Error
A Elementor fix, with the code that solves it.
Fade out any carousel/section left and right – overlay
Add this code to respective carousel or section:
Fade out any section from bottom – Overlay
Add a class to that section: .fade-section And then use this code:
Fading Divider Line in Elementor Horizentally
Add this css to divider selecter.
Generate unique customer/User code – wpForms
A WordPress fix, with the code that solves it.
Hide a Specific section if a Meta field is empty (Shopify)
Create a metafield and copy its name with type. Like a metafield (video_text_section_01_video_url_) created
Hide Any Section from customer for X days Based on Product they purchase
Change the product id and then number of days in front of it.