elizabeth verar how to copy a landing page using divi
TRANSCRIPT
How to Copy a Landing
Page Using Divi
Why is there a need to
copy a Landing Page?
Some people would like to
duplicate the Landing Page
of another website and
recreate their own. This is
one way of re-defining and
re-designing your own
website.
On your WP Dashboard,
Add New Pages
Type the name/title of your
New Page, then click
Publish
Click the link to view the
New Page
This is how it will look
like on a New Page
When creating a landing
page, you have to plan
and determine how many
sections you need for the
layout
Click Edit Page to go
back to Dashboard
Select Blank
Page for the
Template,
click Update
to save
changes
Here are the steps to
remove sidebars from your
page
These elements on the right
side are called sidebar
On the dashboard, go to
Widgets on Appearance
Use the dropdown key and
click delete
Elements of the sidebar has
been deleted from the
dashboard
Sidebar elements are now
gone from the site page
Steps to edit Header
elements
Go to Menus on Appearance
Click on Create a new Menu
Assign a name e.g. Main
Menu, then click Create
Menu
Put a check mark on the
items you want to include and
click Add to Menu
Items on the Menu Structure
shows the elements you
added on the Main Menu
Put a check mark on the
Primary Menu then Click on
Save Menu
Click on Manage with Live
Preview
These are the elements
added to the Main Menu
Go back to Dashboard and
click All Pages. Click Edit
on Sample Conversion Lab
This is where you edit
individual pages
In the meantime, go to the
site which you want to copy
This is the image of the
page to be copied
Copy
image
and
save in
another
folder
This is the copied image
saved in a different folder
Go back to Edit Page and
click on Use the Divi
Builder
This is the image of the Divi
Builder
Click where the arrow is
pointed to include background
image
Select a Background Color,
then Save
Click Insert Column
Select ½ and ½
Click the Insert Module(s) on
the left side
Select Image
Select a Background Image
Supply a Title
and an Alt
Text name.
Click Set as
Background
This is the uploaded image
Click Insert Module on the
Right
Choose Text
Select Light for Text Color
Highlight the text and click
on Link above text to
remove the Link below
Click Save and Exit
Click on Dropdown to select
Font Size
Click Update then view the
page
On the Advanced Design
Setting, adjust font size and
header font style
Adjust Top Margin using
Custom Padding, click key to
preview, then exit
Preview
This is the edited Header text
with the image
Click Insert Module to create a
Button
Click Button
Select General Settings to
makes changes on url settings,
Text for Button, Text color
Use Advanced Design Settings to
navigates changes for the button
Click where the arrow is
pointed to make changes on
the middle module
Use General Settings to make
changes on the Middle Module
Click on Standard Section to
create another section of
modules
Select your choice of section
or module
For this section, select the
single horizontal section
Click on the (+) sign or
anywhere on the line
Select Text
Use General Settings to edit Text
Color, Orientation and Content
Click Save
Use Advanced Design Settings
to fix Header Font Size, Text
Color, Text Background, etc
Remember to
always click
Update in
order to keep
changes in
your work
This is the final result of my
first section
This is the next section to be
copied
Click to create another
Section
Select the 3-column
This is the 3-column
section
Click one module at a time
Click on Image
Make sure that the
images you are going to
copy are already copied
into a folder
Click Upload an image and
select from your folder
Images have been uploaded
These are the images
uploaded
Click Insert Module to add
text on each of them
Click on Text
This is how it looks like
Click where the arrow is
pointed to add Text
Use General Settings to fix Text
Color, Orientation, and Content
Click in the middle to preview and hit
Save and Exit
Go back to the Edit Page
and click Update to save
your work. Then open page
on a separate Tab to
preview
From this point, Click on
Enable Visual Builder to make
adjustments on the settings
Divi Visual Builder allows
easy editing of your work
Click on where the arrows are
pointed to make changes on
margins, text fonts, text colors, etc.
then click Save
Click on the image to adjust
position to the center
The Image Settings Pop-up
will help you edit your image
This is the final copied section
Next section to be copied
Once you are done editing,
click on the Exit Visual Builder
Again, click on Standard Section
to create another module
Select the two columns
Click on the left column to
insert image
Select Image
In the General Settings,
upload an image
Make sure that your
image for the section has
already been uploaded
Click on the next module to
insert text
Click Text
Click Update to save
your work, then open
page to a new tab
Enable the Visual Builder
to edit minor things on
the page
Another way to add section
or module is to click (+) sign
This is the final section
copied
This is another section to be
copied
Click Regular
Use (+) sign below to add
another section. Select 3
column section
Select Image
Click Upload Image
and Save
Click on the (+) signs one at
a time to upload your images
These are the uploaded
images
Click Regular
Select Horizontal Line
Select Text
Type your text below the
Content, Save
Click General to fix Text Settings
such as color, orientation, etc.
save
These were done on the
Visual Builder
This is the final section
Click on the blue mark below
to add another section
Click on Regular to
Insert Section
Click on the single
horizontal line
Click on the gear of the
Blue Section
Work on the Background Color,
image, etc. on the General Section
Click on the Gray (+)
below then select Text
Type your content as
shown below and Save
Use General to manipulate text
font, orientation and content
Click on the green (+) below
and select the horizontal
section
Select the Button
Use the General Section to
manipulate your Button Text,
alignment, color, etc.
On Design Section, fix the button
background color, text, size, etc
Click Save
This is what I re-created from
a different website
References: http://conversionlab.no/ http://workfromhomebeawesome.com/lesson9/