Recently, I had an issue with google Adsense on how to make it responsive in all devices. Since I am starting to earn money on Adsense, I don’t want to remove it so dig in and luckily found the documentation from Google Adsense resource.
This tutorial basically cover how I interprent the tutorial provided by Google Adsense. I believed it will work on all ad units including display ads, in feed ads, in-article ads and even in link ads.
Step 1: Insert a Custom class on your adsense script
Insert a custom class after the adsbygoogle class so we can overwrite the style of our ads. Kindly check the before and after below to see the difference.
< ins class="adsbygoogle"
Now, copy/paste the code on theme options or style.css. Basically, this code will tell the browser to adjust the width of the adsense once it reach the declared viewport. The other css code generally normalize the styling and removing any scrolling styles on your adsense.
Normally, The animation feature from Elegant Themes only works for individual pages and posts when a visual or Divi builder is enabled and dynamic elements like footer, menu don’t have this feature. On my v-tutorial, I am going to add a bouncing animation on our custom button located on menu (by the way, I’m using Extra theme).
Why You Should Consider Adding Animation On your Divi Menu?
Adding an animation on your CTA like button is a very interesting strategy to improve your user experience (UX).
Back to the scenario, make sure you define a custom css where you want to hook the animation. On my example, my class name for this is .acuity-embed-button.
Copy/Paste the code below on Extra or Divi > Theme Options > Custom CSS. You can use an animation generator like Animista.io but make to keep it dry as possible, remove those redundant codes that can hurt your CPU.
Are you having an issue on images file name updating to its current year? In this guide, I will reveal the trick on how to fix the media file when importing items of your custom post fields using WP All Imports and WP All Exports Plugin.
Choosing a modal way of creating a popup on your Divi might be the perfect fit if you don’t want to get in trouble with plugin compatibility. In this Divi 01 tutorial, I’m going to walk you through how to create a perfect modal for your Extra and Divi website.
Modal Popup Demo:
Things We Need in Creating A Modal
Simply add a classed for your row and section to serve as your popup container and popup box.
In my case, I added a class name pricing_table on my code module and pricing_background for section module.
Don’t forget to add a class name on your button to trigger the modal when click.
Let’s get our hands dirty!
Copy the code below and paste it to the respective section.
Click the CSS tab and paste it to Divi > Theme Customizer > Custom CSS
Select the JS tab > copy & paste > go to Divi > Theme Options > Integration > Add it either in <head> or <body> section.
PS: Don’t forget to add the opening and closing script. The reason why I commented it down because Codepen doesn’t allow you to add <script> since we’re already using JS file.