Managing page content using site editor is really easy. Let’s go over a few of the main functionalities.
This is the front end of our demo site. The home page features some content that is editable using SiteEditor , such as the Our Services and Our Work sections. Other areas of the page are not editable in SiteEditor, such as the slideshow on the home page or the footer. This content is managed through other admin tools in the system. We're going to concentrate on how you can manage the content in SiteEditor.
Let’s take a look. I’ll log in to the admin site. From your admin dashboard, you’ll see links to all the tools to manage your site. Select Edit Site to access SiteEditor. Here your site displays just as it looks on the front end, with the addition of the lefthand Admin Panel and the top WYSIWYG Toolbar.
On each page, you’ll see that editable areas are surrounded by a gray, dotted line. Content that is not surrounded by this line is not editable through SiteEditor and is populated and controlled through other tools in the system.
So let’s make a few edits. On the homepage, I can edit the Our Services section, maybe change this header from “Mobile Development” to “Mobile Design”. I can edit Our Work and change the title and text, update the image, and add or change a link. I can edit this third row as well, and modify this About Us section, or add another great quote about how awesome we are here.
Let's go to one of the subpages, Our Services. There are different areas here that are editable. So in this content area, we'll put in some test content to show some of the functionality of the WYSIWYG bar. When you're entering content, this WYSIWYG bar is going to be your best buddy. From here you can format content by adding bold, italics, or underline, you can apply styles that have already been determined by your design, you can add links, images, tables, and multimedia to your pages. And as you can see, each icon has a tooltip to let you know what each icon does.
Before formatting your content, it’s a good idea to hit the Remove All Styles icon. This removes any previous formatting that may have come along with your content when you copied from another source. This is particularly important if you copy from MS Word. Word is notorious for bringing along a lot of unnecessary code with what you copy, possibly making your page display incorrectly.
The WYSIWYG bar behaves very much like the tool bar in MS Word. Many of the same keyboard shortcuts you’d use for Word also work here - control-c to copy, control-x to cut, and control-v to paste. You can also undo and redo work, and the keyboard shortcuts for these tasks work as well, control-z to undo, control-y to redo.
So that's a bit on how you can format your content on the page. See other videos in this series for detailed information on topics such as inserting images and video, creating and editing tables, and working with links and anchors.
When you are done editing, it’s time to save. Depending on the workflow you have set up for your site, there will be several ways to save your content. You can save your page by selecting Save Changes here in the top right or by selecting the Save icon on the WYSIWYG toolbar. For our demo site, we have three levels of workflow. Work in Progress will save but not publish to the live site. Ready for Review will save and not publish as well as send a notification to whoever has been established as a reviewer to take a look. And Save as Live will, of course, save as live and publish to the live site. Depending on the workflow you have established and the permissions associated with your account, you may see all or some of these options.
That covers the basic functionality of editing your site content using SiteEditor. See other videos in this series to learn more about how you can use Lighthouse CMS for your site.
