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 Mansory Design In Divi Using Custom CSS Grid | WP

If you think the Divi columns features doesn’t support what you want in creating a mansonry grid layout either for your gallery, portfolio, images. This CSS grid will do the trick for you.

 

 

Basically, we will need to use 1 column and push all the elements vertically or horizontally depending of the design you wanted to create. In this example, we will create this kind of layout.

 

1.Open your page or post and create a one column row

divi column

 

2.Open the Row Settings by clicking the gear icon > Advanced tab > add a class name. As an example I use mygrid_column

divi row settings

 

3.Add a class on your inner module, As an example, I use lender_img

module settings advanced tab

 

Go to WordPress dashboard > Divi > Theme Customizer > Custom CSS and add the following code

div.et_pb_row.mygrid_column>.et_pb_column {
display: grid;
grid-template-columns: repeat(4,1fr);
align-self: center;
}

If you want to change the number of grids in mobile version, simply add this media query. Let’s say if viewed in mobile, images will turn into columns so that will be

@media (max-width: 414px) {div.et_pb_row.mygrid_column>.et_pb_column {
display: grid;
grid-template-columns: repeat(3,1fr);
align-self: center;
}}

Preview:mansory grid css sample divi

Cheap Hotels In Osaka For As Low As P2100 | All DownTown Area

Booking the right hotel before traveling in Osaka Japan is very important because the transportation there is quite expensive over other countries.

In this travel guide, I point out the two cheap hotels we stayed in. Super near from train station and located in the downtown area  where most tourists hang out.

 

Wings Hotel in Shin Osaka | P3,100/day

The place itself is actually better than the picture. Another thing what I really like is the train station is just beside the hotel.

cheap hotel in shin osaka

SunRoute Hotel in Namba Osaka | P2100/day

No one doesn’t love Namba. This is the center of Osaka where most tourists hangouts and there’s also a lot of stores and restaurants.

cheap hotel in osaka

 

This hotel is AMAZING! The price is a deal breaker, they also have free mobile that you can use as your map guide. Basically, you don’t need to buy a sim card if you stayed here. 🙂

 

By the way, don’t forget to buy Ikoka card to save time buying tickets. You can also use this in bus or even in luggage locker.

 

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.