How To Route Your Email Address To Office 365 Using MX Record

Pleae take note that you need to have an admin account of Office 365 in order to configure this set up.

To route your email address e.g info@bookwormhead.com to Office 365 without using POP3 or IMAP, you need to use MX Record.

Login to your web Outlook account > click the dotted square > Admin

 

Go to too icon > Domains
domains

 

Now, you need to add a new domain and complete the verification process
verification of MX record

 

 

In my case, my hosting provider is Siteground.

 

So basically, you need to edit the following fields according to their requirements to route all your email address to Office365

how to verify mx recording in office 365

cPanel–Advanced DNS zone editor tool

verified version

cPanel–Advanced DNS zone editor

https://www.dnswatch.info/

 

 

 

Grid CSS – Divi

To have this kind of design, we will need to use custom classes and grid.

Please declare the grid-image custom class in the menu and add a class in the row called grid-container then duplicate the container two times to have 3 column image. Here’s the quick screen recording.

Please go to your WordPress Dashboard > Divi > Theme Options > Custom CSS and add the following:  Feel fre to change the font-size according to your liking.

.grid-container {
display: grid;
grid-template-columns: repeat(3,33%);
}

.grid-image p {
margin-top: -7em;
padding: 2%;
color: white;
font-size: .9em;
line-height: 1em;
}

 

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