I’ve previously written on how to make a sticky header in Elementor Pro. Now we’re going to take that to the next level. We’re going to create a sticky header that is transparent over a video background: And when the user scrolls down, the header turns into a sticky header with a white background. You
This is a new error message in Beaver Builder. I’m currently running Beaver Builder Pro 2.4.0.6 on the site. Judging by the changelog, the error message was introduced with Beaver Builder Pro 2.4 in August 2020. The error message comes up when you try to save the Slider module and says “Transition value should be
Following on from the post on making the Divi Accordion module web accessible, today we’ll tackle the Divi Toggle module. The functionality of the Toggle module is similar to the Accordion module. The main difference is each Toggle element stands alone. Because of that, I think the Toggle module should follow the WAI-ARIA Disclosure Design
My favorite page builders for WordPress are Beaver Builder and Elementor. They’re easy to setup and quickly get to designing great looking pages. There are three main ways to get started. How to install Elementor: Use one of the following methods. Download from Elementor and upload through the WordPress Dashboard Install directly from the WordPress
If you’re building a page with Elementor, you might not want the title of the page to be visible. Basically, we want to hide this: Different themes handle hiding the title differently. For example, in Astra, there’s a checkbox on the page editor to hide the title. Thankfully, Elementor has the ability to do this
A lot of websites use sticky headers. This is where the header appears to “stick” to the top of the browser window as the user scrolls down the page. If you have Elementor Pro, you can create a sticky header across the whole site, replacing the current theme header. This has been a feature since
One of our readers commented on the tutorial about responsively hiding elements in Elementor raising a great question: what if you don’t just want the element to be hidden – what if you wanted to prevent an image from even loading on mobile. With most methods of hiding elements for mobile, you’re just assigning this
As a web designer, it’s important that your website looks good on all sizes of screens. Sometimes you need to display two columns side-by-side on mobile. Elementor defaults to having columns be full width on the smaller screens. Usually that’s what we want, but how do you get this dark image to sit up next
A site I build some time ago had problems after one of the recent Elementor updates. We don’t know which update caused the problem, because Elementor is only used on the home page, which isn’t changed very often. The fix was simple, but not intuitive. When you get the “Elementor White Screen of Death”, there
There are times when you need to hide a column on Elementor for mobile or tablet devices. This is not something that Elementor shines at, and implementing it is a little counter-intuitive. How do you hide a column on mobile or tablet in Elementor? Right click on the column, Click Edit Column, Select the Advanced Tab, Add