LOGO

Facebook Page Builder - HTML WYSIWYG Editor

May 11, 2011
Facebook Page Builder - HTML WYSIWYG Editor

Leveraging Facebook Pages for Promotion

It's common to find that most individuals possess a personal Facebook account. However, a surprisingly small number have created a dedicated Facebook Page.

A frequent reason cited for this is the perceived complexity of page creation. This is unfortunate, as Facebook Pages represent a powerful promotional resource.

These pages can be effectively utilized to market a variety of entities, including blogs, products, or even personal brands.

Simplifying Facebook Page Development

For those with limited coding experience, constructing and modifying Facebook Pages without direct code manipulation is entirely achievable.

Previously, tools like Static HTML offered a solution. It was a WYSIWYG (What You See Is What You Get) web editor specifically designed for Facebook Pages, enabling easy customization.

This allowed users to visually design and edit their pages, eliminating the need for technical expertise.

Integrating the App

The Static HTML application for Facebook can be installed by following the provided link. Upon completing the standard verification and confirmation steps, you will be prepared to begin constructing and modifying your Facebook pages.

Initially, it’s necessary to register your Facebook page(s) within the Static HTML app. Select the desired page from the dropdown menu and click "Register". If you haven't yet created a Facebook page, you will need to do so first. Refer to a dedicated guide for instructions on page creation.

easily-build-edit-facebook-pages-static-html-wysiwyg-editor-1.jpg

Following registration, select the "Add" button. This action will display your page under the "Facebook page name" listing. Click "edit" to initiate the page editing process.

easily-build-edit-facebook-pages-static-html-wysiwyg-editor-2.jpg

Two distinct editing modes are available: a What You See Is What You Get (WYSIWYG) editor and an HTML mode. Given our focus on no-code editing, we will proceed with the WYSIWYG option.

easily-build-edit-facebook-pages-static-html-wysiwyg-editor-3.jpg

Static HTML incorporates dual editing panes. One pane is dedicated to the primary content, while the second allows for optional fan-gated content. A "fan gate" restricts content visibility to users who have clicked the "Like" button. To enable a fan gate, select the "If user have not liked, below content will be shown" setting.

easily-build-edit-facebook-pages-static-html-wysiwyg-editor-4.jpg

An alternative method for activating the fan gate is detailed in a separate article.

Utilizing the Static HTML Editor

Creating a page with Static HTML’s WYSIWYG editor functions much like working within a standard word processing application. Content is written and formatting options, such as font size, family, style, and color—including background color—are readily available for modification.

Common editing tools, including alignment controls, bulleted and numbered lists, as well as bold, italic, and underline functionalities, are also incorporated.

Adding Visual Elements

The platform also supports the inclusion of images to enhance page content. Images can be integrated in two ways: by directly linking to existing images hosted online, or by uploading new images.

Image hosting through services like ImageShack is supported for uploaded content.

HTML Mode for Advanced Users

For individuals with familiarity in HTML, a dedicated HTML mode is available. This mode can be activated by selecting the HTML icon, allowing for direct code input to refine specific page sections.

Implementing Hyperlinks

Static HTML enables the creation of links to any element within a page. Simply select the desired element and then click the "Add Link" button to begin the process.

A pop-up window will appear, prompting you to input all necessary link details.

Completing the Linking Process

After filling in the required information within the pop-up window, click "Submit" to finalize the link creation.

Saving and Publishing Changes

Remember to click "Update" after completing all editing tasks. This action saves your modifications.

Static HTML will then confirm the successful completion of the editing process and provide an option to "return to homepage".

Experiment Results and Incentives

The preceding steps represent the outcome of a brief test utilizing Static HTML. This is the page displayed to visitors who have not yet clicked the "Like" button.

Other incentives can be employed to encourage visitors to engage with the "Like" button.

  • Image 1: easily-build-edit-facebook-pages-static-html-wysiwyg-editor-5.jpg
  • Image 2: easily-build-edit-facebook-pages-static-html-wysiwyg-editor-6.jpg
  • Image 3: easily-build-edit-facebook-pages-static-html-wysiwyg-editor-7.jpg
  • Image 4: easily-build-edit-facebook-pages-static-html-wysiwyg-editor-8.jpg
  • Image 5: easily-build-edit-facebook-pages-static-html-wysiwyg-editor-9.jpg
  • Image 6: easily-build-edit-facebook-pages-static-html-wysiwyg-editor-10.jpg
  • Image 7: easily-build-edit-facebook-pages-static-html-wysiwyg-editor-11.jpg
  • Image 8: easily-build-edit-facebook-pages-static-html-wysiwyg-editor-12.jpg

Finalizing Your Page Setup

As illustrated in the image above, the page I’ve created is titled "Static HTML". The page’s name can be modified by selecting the "Edit Info" link, which is located directly beneath the current page name.

easily-build-edit-facebook-pages-static-html-wysiwyg-editor-13.jpg

Following this, navigate to the "Apps" section from the menu on the sidebar.

easily-build-edit-facebook-pages-static-html-wysiwyg-editor-14.jpg

Within the list of available apps, find Static HTML and then click on the "Edit Settings" link.

easily-build-edit-facebook-pages-static-html-wysiwyg-editor-15.jpg

Enter the desired name for your page in the provided field. Subsequently, click "Save" and then "Okay" to complete the naming process.

easily-build-edit-facebook-pages-static-html-wysiwyg-editor-16.jpg

Having used Static HTML, it’s clear that this application represents a remarkably straightforward method for constructing and modifying Facebook Pages. While the tool’s simplicity may not cater to the needs of experienced web developers, it proves to be sufficiently capable for those new to the process.

What are your impressions of this tool? Have you utilized it in the setup of your Facebook Page? Are you familiar with any alternative solutions? Please share your insights and opinions in the comments section below. For further information regarding Facebook Pages promotion, be sure to explore our other articles – Promote Your Blog Using Facebook Pages and Promote Your Blog Or Business on Facebook With The Help Of The Wildfire iFrame App.

Image credits: bram_souffreau, .reid

#facebook page builder#html editor#wysiwyg editor#facebook page customization#static html#page design