Quick & simple Enfold theme
Once you catch on how to use the WordPress Enfold theme, you will very likely not want to go back to anything else. It makes web design so quick & simple. You just use Layout Elements to create your columns. Then you drag & drop your content & media elements into the columns.
YouTube video
To understand this blog post, you have to follow the corresponding YouTube video. Pause the video frequently and takes notes.
Getting started with a new page
After you have clicked the New link and opened a brand new page or post, add a headline and then click Advanced Layout Editor.
Click Layout Elements tab, decide how many columns you want and drag the appropriate element down to an area that turns green. (See the 25 second point in the video.)
Note from January 2019
If you are having trouble dragging & dropping, it could be because of a WordPress update that included Gutenburg. I would drag an Enfold element down and the screen would suddenly turn white. It was impossible to drop the element where I wanted.
The solution was to install and activate a plugin called Classic Editor. Now I can drag & drop perfectly.
28 seconds
Click clone icon to make another column.
32 seconds
From Content Elements, drag Text Box into a column. You are allowed to drop the element after the area turns green. At that point lift finger of mouse button.
37 seconds
Drag Image element into column 2.
41 seconds
Click on column 1. Highlight text. Change it to your new text. I like to change my Font Size to 20. Then I scroll up and click Colors tab. I define custom colours and then click on the lower right-hand corner of the colour square to change it to a dark black. Click Save to exit column 1.
1:03 Make sure image size is OK
Click in column 2 to add image. Before downloading, make sure you have a size that is appropriate.
1:46 Adding HTML code
The ad in a freewebdesign.club website is represented as a widget. That means that it is a bit of computer code that presents the same ad on every page or post in the website.
-
- Dragged a 2-column layout element to blank space below the last entry.
- Clicked Clone icon create 2nd column.
- Dragged Code Block content element into 1st column.
- Dragged Image media element into 2nd column.
- Clicked Insert & Save
- Went into a freewebdesign.club page in edit view and clicked on Appearance > Widgets
- Clicked Custom HTML
- Select HTML code & Cmd C to copy into clipboard
- Clicked Code Block in website I was working on
- Clicked Save
- In page view same ad shows up only image is beside text
3:14 Inserting a video
- Insert a one-column layout element
- Drag Video media element into column
- Click Video
- Insert Video
- Open Finder
- Drag MP4 file from folder
- Insert
- Save
- Update
- View Page
- Watch video
Related page
How to add CSS to an Enfold page
How to add CSS to an Enfold page (this blog)