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!

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.

See the Pen
Pop-UP
by Angelic Sanoy (@angelicsanoy)
on CodePen.

 

Still confused? Let me know your thoughts. 

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

How To Setup WordPress Offline Site Less Than A Minute | WP 101

Installing a WordPress on your desktop and computer is simple like using one-click installation feature offered by most of the hosting company.

However, if you want to master WordPress, you might need to consider familiarizing the offline setup.

At first, I thought it’s really hard and it required programming knowledge but these 3 tricks can save three forth of your time. 🙂

Step 1 – Install and Configure The Xampp Console

  1. Install a xampp on  your desktop or laptop.
  2. After installation, you will see a console that’s composed of 5 modules.
  3. Run the Apache and MySQL module by clicking the start button.

Setup WordPress Offline Site

Beside Mysql row, click the admin button to create a database or you can simply go to localhost/phpmyadmin/ to access the phpmyadmin console.

  1. To add a database, click the New
  2. Name your database (As an example, I used wp, you can rename it whatever you want).
  3. Click the check all
  4. Hit the create button

create a database in php admin

Step 2: Placing The WordPress Files On The Right Directory

Step 2:1: Download the latest version of WordPress on there official website.

download wordpress 5.2.1

If you’re using iOS, please the .tar.gz

Step 2: 2: Unzip it into the htdocs folder. Usually, it is located at C:/Program Files/XAMPP/htdocs.

So basically, it looks like  C:/Program Files/XAMPP/htdocs/wordpress/

Note: you can rename the WordPress folder, just keep in mind that this will serve as the extension of your local link. Since we use WordPress, our front-end link will be localhost/wordpress

You can see the WordPress is already live but in order to make it work, you need to connect the database that we have created in step 1.

Step 3: Connecting the Database

In the process of installation, simply select a language and follow the instruction until you reach the database Q&A field. For other option, just edit the wp-config but for those new for backend, let’s just stick to front-end configuration. 🙂

how to setup wordpress offline

Here’s the format

  • Database Name: WP (this is the name we have used in the database
  • Username: Root (we’re using root since we’re installing the WordPress locally)
  • Password: leave it black
  • Database host: localhost
  • Table Prefix: wp_

Lastly, name the general settings.

And now, you have a demo site.

Local WordPress Installation Highlight Of The Day | Tweetable

WordPress installation is not tricky, you just need to do it slowly or else your site won’t be live quickly – Angelic Sanoy

Related topic:  How to permanently remove malware on your WordPress site