* Notice: This website is run by SMMILE Web Agency. We are still working on this website. This design you're seeing might change and the website is still under beta. Pardon us because we are creating something awesome. However you can still make a purchase from our site.

Got it

Today, I thought it will be interesting to see how our custom modules can design the Apple layout using Divi with our Fullwidth Header Extended Module and All-In-One Module

Took about 15 mins to make something very similar together with the mobile media styles. You can take a look how it looks like at the link below or download the json below. We make use of the animation delay and the AIO background image zooming effect.

Demo

Download “Apple Layout Demo JSON” Apple-Layout-Demo.json_.zip – Downloaded 159 times – 2 MB

You will need a little css to make it nicely. You can copy and paste the following css to your custom css stylesheet or the page css.

divi-page-css

/*DWD Apple CSS Demo*/
.et_pb_fullwidth_header a.et_pb_button:after { font-size: 25px; top: 7px; } .et_pb_fullwidth_header a.et_pb_button:after { margin-left: 0 !important; } .aio-wrap sup { font-size: .6em; opacity: .8; vertical-align: top; position: relative; bottom: -.9em; } @media (max-width: 980px) { .spilt-full-mobile.et_pb_row { width: 100% !important; } .spilt-full-mobile .et_pb_column_6 { margin-bottom: 0 !important; } }
}

Pin It on Pinterest