Wp All Imports Guide: How To Fix The Wrong Media File Name During the Migration

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.

Step 1:  Install A WP All Export On Your Official Site To Export  The Custom Post Fields

You need to install the WP All Export plugin on your official site to export the custom fields on by one.

  1. Go to All Export > New Export > Select a specific post type
  2. Follow the wizard until you finish the process
  3. Make sure you choose the bundle option when exporting to use general settings.

exporting custom fields using wp all exports plugin

Step 1:  Install A WP All Import On The Staging Site To Import The .zip file.

  1. Go to All Import > New Import > Click the upload file
  2. Follow the wizard until you finish the process
  3. On Step 4, add the PHP code (download the source file) under the Custom Functions Editor.

How To Download Divi And Other Themes On Elegant Themes Member Area

In this blog, I will walk you through how you can download any elegant themes products including themes, plugins and templates.

 

 

Downloading Elegant Themes & Plugins

Before, we get started. Below are the list of WordPress themes and plugins you can use.

WordPress Plugins

  • Divi Builder – can be used if you don’t want to use Extra or Divi. This plugin is no longer needed if you’re already using Divi/Extra themes as they have built-in Divi builder.
  • Bloom – Perfect for email opt-in pop-up, exit pops and such.
  • Monarch – Integrate a social sharing to your WordPress website
    See more >

WordPress Themes

To see the other themes, kindly go here. Just click the preview to see the demo.

 

WordPress Plugins

Now, let’s proceed! To download ET themes, kindly go sign in to  the member’s area. If you’re not sure what’s your username, you can find it here

elegant themes member area

2. Go to downloads tab > scroll down the page > click the view all downloads pink button

how to download divi themes

3. Press ctrl + f for Windows or cmd+f for Mac > find the theme e.g Nexus and click the Download icon

list of elegant themes

 

To load premade template from Divi, create or open an existing post/page > enable the Divi Builder > click the + icon

premade layout

Click the Premade Layouts tab > Choose any of your layout. You can also use the “Search” box. 

how to load premade layout

How To Receive Submissing From Divi Form Using Message Pattern

1. Go to your page editor or enable the Divi Builder > contact form module by clicking the grey gear icon. 

 

 

 2.Open the individual fields and check your field ID.  Basically, you will need to define those IDs on message pattern

field ID in Divi

 

3. Let say, you have 3 fields called Name, Email and Message.

4. You will need to set that on Message Pattern fields, simply click the Content tab > Email Toggle > Message Pattern 

 

5. Add a %% before and after the field ID.

 

Lastly, don’t forget to put your email address

 

See the screenshot below for reference

message pattern

How To Create Onclick Popup Modal In Divi Without Using A 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

 

Code Module:

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.

button module

Let’s get our hands dirty!

Divi Integration Options

Make sure to add opening and closing script when you add it on Divi > Theme Options > Integration > you can add the code below either in body or head section. By the way, please remove the extra space in the beginner opening and closing <script> below.

< script>
(function($) {$(document).ready(function() {
$(‘.see_pricing’).click(function(){
$(‘.pricing_background, .pricing_table’).css(‘display’,’block’);
});$(‘.close_pop’).click(function(){
$(‘.pricing_background, .pricing_table’).css(‘display’,’none’);
});
});
})(jQuery)
< /script>

Divi Theme Options

Add the following code on Divi > Theme Customizer > Custom CSS

.pricing_background{
display:none;
background:rgba(0,0,0,.65);
z-index: 100000;
position: fixed;
top: 0;
left: 0;
min-width: 100%;
height: 100%;
}

.pricing_table {

display:none;
width:50%;
background-color:white;
padding:3%;
z-index: 150000;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

@media (max-width:768px){
.pricing_table {
width:90%;
}
}

.close_pop{
cursor: pointer;
padding-bottom: 5%;
font-size: 19px;
text-align: right;
}

Still confused? Let me know your thoughts.

Complete Updated Guide To Fix Loading Issue With Visual Or Divi Builder

In this guide, Bookworm Head will walk you through the most common troubleshoot you can do to fix the loading issue with Divi.

 


1.Plugin Conflicts with Divi

Some of the plugins can trigger the loading issue. Mostly, these are poor plugins that haven’t updated for years or it’s just not compatible with Divi. In this case, try to disable the plugins temporary to isolate what’s causing the issue.

 

how to deactivate plugins

If the problem solved after that, then you will need to find which plugin is conflicting, simply enable it one by one. If the problem occurs again when activating a specific plugin, then you need to keep that disable.

If you have WordFence and you confirmed that this causing the issue then simply set the Firewall to Learning Mode instead of Enabled and Protected

how to change the wordfence firewall to learning mode

 

2. Divi Cache Stucked In CSS File Generation

Also, don’t forget to clear your CSS file generation. Simply go to WordPress dashboard > Divi> Theme Options > Builder > Advanced > Clear or disable the css file generation.

4. PHP Directive Limit and Outdated PHP version

Old version of PHP is unsecured and since Elegant Themes keeps their theme up to date to WordPress best practices, you need to keep your site as well.

How to update my PHP

As an example, I will use Siteground since this is my hosting site.

 

How to change the php directive values. The effective ways I recommend so far is putting the recommended values below to your .httaccess.  This is a hidden file so make sure that you’ve enabled your FTP client to view hidden files, then open up the file labeled “.htaccess” to edit. At the bottom of the file, paste in this code:

how to edit the .httaccess divi

php_value upload_max_filesize 264M
php_value post_max_size 264M
php_value max_execution_time 600
php_value max_input_time 600

For the complete reference, Elegant themes wrote this guide you can check

 

5. Harmful custom jQuery on the <head> section or CSS on the Divi Theme Customizer

To access the <head> section, go to Divi > Theme Options > Integration 

 

To access the <head> section, go to Divi > Theme Customizer > Custom CSS

 

Outdated WordPress/Theme version or Poor child theme

switching the child theme to divi

If you still haven’t fixed the error after the above recommended, open your WordPress dashboard in Incognito > right click and inspect the elements, if you found any error in the console then there might be something wrong in the WordPress or Theme installation. If that happens, you will need to reinstall your WordPress or Theme.

 

How to reinstall your Divi website?

Option 1: Manually update the Divi theme to latest version 

You can manually update the Divi by going to File manager, kindly check the tutorial below for more info.

Option 2: Temporary Switch Divi to Twenty Seventeen

Activate any default theme like Twenty Seventeen then delete the current installed Divi theme. Lastly, go to members area > download the Divi.zip and re-upload it to your WordPress dashboard > Themes > Add New

Make sure you backup your custom CSS and jQuery if you have some. Simply put it on the notepad++ so you can re-add it after reinstallation is finished. 

How to reinstall the core WordPress files? 

1. Go to WordPress.org and download the latest version of Divi. Unzip the file. 

2. Open your root directory using FTP and replace all the files except your wp-content folder and wp-config.php

Warning: Always backup your website when doing the reinstallation.

There’s also an article I have wrote that can also trigger loading issue. The blog is all about “saving issue on Divi”. Actually, they do have same causes so you’ll need to check this out as well because there are some issue that is not listed in loading issue like aJax, mixed content and among others. 

Does the above recommendation fix your current issue? I’ll be happy to know your feedback!

How To Build A WordPress Child Theme Less Than A Minute

Doing extra customization on your website is pretty common especially if the chosen theme doesn’t support the style and functionality that you want. But most amateur website designers missed this portion which may result in losing all the extra codes every time there’s a new update on your theme. Of course, that’s not everyone’s cup of tea. It’s a waste of time, effort, and money. To avoid this, you need to make sure the parent theme is carrying a WordPress child theme version.

 

What is WordPress Child Theme?

child theme is a theme that inherits the functionality and styling of another theme, called the parentthemeChild themes are the recommended way of modifying an existing theme – WordPress Codex

WordPress codex did a very great job in explaining what child theme is.

Now, you know what’s WordPress child theme is.. Let’s build now!

A child theme needs three things:

  • Its own folder,
  • A style sheet name styles.css
  • functions.php file
  • screenshot.png (optional)

child theme directory

 

1. Create a folder under wp-content/themes
Like any theme, child themes are located in wp-content/themes in your WordPress installation. So, navigate there and create a new folder for your child theme.

A best practice is to give your theme’s folder the same name as the parent theme followed with -child phrase. Now, because we’re using the Divi theme, we will call our folder divi-child.

2. Screenshot
Upload your screenshot.png in the child theme folder, this will serve as preview under appearance > Themes

3. Functions.php
Create a blank functions.php using atom then upload in the folder you have created

4. Styles.css
Create a styles.css then write the following code below. You can modify the text field according to your preferred information.
Child Theme Syntax:
/*
Theme Name: Level Up Child
Theme URI: http://bookwormhead.com
Description: This is a child theme of Angelic site
Author: Angelic Sanoy
Author URI: http://bookwormhead.com
Template: Divi
Version: 0.1
*/
@import url("../Divi/style.css");

Lastly, go back to Appearance – Themes and press the activate button.

Download the child theme source file here