DESIGNING SCHOOL WEBSITES WITH WORDPRESS AND BEAVER BUILDER SARAH - PowerPoint PPT Presentation

DESIGNING SCHOOL WEBSITES WITH WORDPRESS AND BEAVER BUILDER SARAH BARNES, WEB DEVELOPER, WVNET TUESDAY, JUL 14 2020 | 11:00 AM - 12:00 PM SBARNES@STAFF.WVNET.EDU

WHAT ARE WORDPRESS & BEAVER BUILDER? • WordPress is a Content Management • Beaver Builder is a plugin AND theme System (CMS) • WVNET maintains a pro license for our K-12 • Content is saved in a database and separate schools to use. • The Beaver Builder plugin will work with any from the “look and feel” of the website • WordPress uses themes to create the look and theme, but their theme is a good base for any website. feel of the website. Themes can be “swapped out” as needed and the content will remain*. • WordPress uses plugins to extend the functionality of the website—to allow the website to do things that are not built-in to WordPress. (eg. Calendars, shopping carts, contact forms, etc.)

WORDPRESS ORIENTATION • Pages • Posts • Media Library • Settings

BLOCK EDITOR VS. PAGE BUILDER • In working with WordPress and Beaver builder, you have two ways to edit content: • WordPress Block Editor • Beaver Builder Page Builder • You need to select which one you want to use when you create new pages or posts.

BLOCK EDITOR VS. PAGE BUILDER • The Block Editor is not considered a page builder (like Beaver Builder), but it is a way to easily add blocks of content to your page or post. • To add content, click the plus sign wherever you want the block to appear. You can select the element you need from the choices in the pop-up window.

BLOCK EDITOR VS. PAGE BUILDER Beaver Builder's interface includes visual drag-and-drop tool. Each module in the Content panel can be clicked and dragged to the part of your page where you want it to appear on the page.

BEAVER BUILDER ORIENTATION • Appearance > Customize • Modules • This is where to go to make updates to • Rows the Header and Footer, Widgets and • Templates easy access to Menu

RESOURCES Beaver Builder WordPress • How to Build a Website With • How to Add a Page in WordPress WordPress and Beaver Builder: A • How to Create A WordPress Page and Complete Guide Add It to the Menu • How to Build a Responsive Website • WordPress Tutorial: WordPress How-To With Beaver Builder (And Why You For Beginners Should) • A Complete Beginner’s Guide to Beaver Builder