If you are a user of the WordPress Divi theme by “Elegant Themes” and are frustrated that the number “3” lights up instead of the dropdown submenu arrow, how can you fix the problem?
The problem
The problem can occur when you create a new website with Divi and have menu items that you want to include in a dropdown submenu. If your hosting server isn’t lightning fast, you may be scratching your head when your site first loads on the screen. The reason for this is that this number “3” appears briefly before the small drop-down arrow symbol appears in its place. This can be particularly frustrating if you’ve just created a site for a client and they’ve asked you to fix the problem. The main image (above) shows the page after loading and the image below shows what you see while the page is being rendered. In short, the number three that appears first is a font-related issue, as your font will not load before other elements on the page.
How to repair
Fortunately, there is a simple solution that doesn’t require a plugin, just a simple code added to the section of your Divi Divi is a WordPress theme and has great features. With this theme you hardly need any additional plugins in WordPress! Official website of Divi website that provides a simple guide on how to prioritize the preloading of your font.
1. log in to the admin area of your Divi Divi is a WordPress theme and has great features. With this theme you hardly need any additional plugins in WordPress! Official website of Divi/WordPress and select the “Options” of the theme
2. go to the Integration tab and select it
3. make sure the header code option of Divi Divi is a WordPress theme and has great features. With this theme you hardly need any additional plugins in WordPress! Official website of Divi is enabled and paste the following code in the area labeled “Add code to the< header> of your blog”
<!-- Preloading font to fix menu icon flashing 3 -->
<link rel="preload" href="/wp-content/themes/Divi/core/admin/fonts/modules.ttf" as="font" type="font/ttf" crossorigin="anonymous">
<!-- Preloading font to fix menu icon flashing - end -->
Once you have added it, save and close it and your problem should be solved
Dieser Beitrag ist auch verfügbar auf: Deutsch (German)