[Free] Website Build-Along: Beaver Jams
A fun way to use WordPress – Free Course
What you’ll learn
- Learn how to use the Beaver Builder Page Builder
- Learn how to use the Beaver Builder Theme
- Learn how to get design inspiration from other people’s websites
- Bonus Video: How to setup hosting and DNS
Requirements
- No experience is needed
Description
Lesson Overview
Explore our WordPress Theme and Page Builder Plugin as we build a website together. The site flaunts a rock n’ roll motif with a homepage design that is inspired by a popular music publishing company. Turn your site building beaver power up to 11 with the Beaver Jams website Build-Along.Adding Placeholder Content
In this lesson we are going to add some content to our site so we can see the stylistic changes we will be making in the customizer.
-
Create 6 new pages: Homepage, Services, About, History, Core Values and Contact (00:19)
-
Create a menu and add pages to the menu (00:40)
-
Add lorem ipsum text to the homepage (01:47)
-
Add headings to the placeholder text (02:30)
-
Add links to the placeholder text (02:42)
-
Add a button to the homepage (03:08)
Customizer Settings
This video shows how to dial in customizer settings in the Beaver Builder Theme interface.
-
Settings > Homepage Settings (00:22)
-
General > Background (01:11)
-
General > Accent Color (link colors) (01:29)
-
General > Headings (01:45)
-
General > Text (02:10)
-
General > Buttons (02:31)
-
General > Social Links (03:05)
-
Header > Header Layout (03:34)
-
Header > Header Style (04:00)
-
Header > Header Logo (04:38)
-
Header > Nav Layout (05:20)
-
Header > Nav Style (05:47)
-
Content > Content Background (06:13)
-
Footer > Footer Style (06:33)
-
Footer > Footer Widgets (and additional unused tabs) (07:00)
Creating a Hero Header
In this video we will begin to build out our page content using the Beaver Builder Page Builder. The first element on our page is a hero header section.
-
Create a new row and dial in the row settings (00:47)
-
Add a background image to the row (01:04)
-
Select a font for the heading from Google Fonts (01:45)
-
Add a colored overlay to the row over the image (02:47)
-
Add a heading module to the row and stylize the heading (03:29)
-
Add a call to action using a heading module and button module (05:00)
-
Dial in the responsive layout settings (08:00)
Creating Testimonial Boxes
In this video we are going to utilize pre-built content to create testimonial boxes.
Embedding A Video
In this video we will embed a video onto our page.
Creating A Social Icon Row
In this video we will add a row of social icons to our page.
Author(s): Beaver Builder