Lubith Homepage

WordPress is already a household name for internet savvy users. Many websites and blogs now run on WordPress. Not surprisingly, different people like WordPress for different reasons – starting from the large number of themes to choose from plus the inexhaustible number of plug-ins available to the many several other possibilities with the platform.  Interestingly, Lubith currently provides a web-based editor for creating WordPress themes and tweaking various features.

Lubith Editor has a really intuitive interface that lets you create your own theme with no coding skills and thus save time and money. It lets you move and resize the elements on the theme with two small knobs. You can also delete some of the elements in the theme layout and add others. When you are done, you can test your new theme before downloading the new theme design and finally uploading to a self-hosted WordPress install.

Getting Started With Lubith

Lubith’s click, drag and drop features makes the app extremely easy and quick to use. You’ll get comfortable using the app in no time. To get started, visit  their website.

Creating Your Lubith Account

Lubith offers both free and premium accounts. You can create and edit your theme within 7 days with the free membership account. To start a free account, click on the red button labeled “Start Here” on Lubith homepage.

Start Here Button

On the next page, select “Sign Up”.

Sign Up

Next, enter your details and click the blue button below the form labeled “Register”.

Lubith Registration Form

On the following page, you will be notified that you have completed the process of registration. Log in with the details you registered with to get access to Lubith Editor.

Log In to Lubith

Starting and Using the Lubith Editor

Click on “Start Here” button on the homepage of Lubith to start the editor.

Start Here Button

Here’s what Lubith Editor looks like:

Lubith Editor

The left hand side pane is your tools section. With the tools you can change background colors and text font, remove and edit page elements and also upload your logo. The central large area works both for previewing your site and also clicking, dragging and resizing elements during the design process.

Dragging and Dropping Items on Your WordPress Page

To drag an item, click directly on the item. Two knobs will appear – an orange and a green knob. The orange knob is used for dragging the item, and the green knob is used for reducing or increasing the size of an item.

Orange and Green Knobs

Entering Your Theme Details

You can name your new theme and add other details. Click “File” in the menu on the left hand pane to reveal the possibilities under the “File” tab.

File Theme Details

Note that you can save, reset or add new themes to your site depending on the package you are using. Start by entering the details about your theme. Enter your details and click “Save”.

Changing Background Color or Image of selected Items

For any item you select, click on ‘Background” on the left hand pane of the editor, and click “Background Color” to change the background color of that item.

For example, to change the background color of the widgets at the right hand side, click directly on a widget to select it.

Widget

Then click on “Background Color” at the left hand side of the editor.

Background Properties

The color of the selected item will change when you select a color from the color pane.

How to Change Background Color

Changing Font Properties

To change the font type and opacity or size, select “Type” from the menu in the left hand side.

How to Change Font Properties

Note the changes on the selected item in the preview when you click to change a property of the item. For example, by clicking “Center” under “Type” menu, the texts in the selected item becomes centralized.

View Changes on Preview

Changing the size of Borders

You can also change the border size of any selected item. Select “Border” from the menu on the left hand side, and click and drag the control buttons to increase or decrease the border size.

Change Border Size

Note that you can change the border color, transparency and also the corner radius.

Changing Other Properties

You can add or remove the layout elements on your site. However, users of the free version cannot remove the footer description. To add or remove elements, click on Tools at the left hand pane, and click “Add/Remove”. Uncheck the items you want to remove and check the items you’d like to add to your site.

How to Add or Remove Elements

Note that you can also change the dimensions and padding of items here.

Testing Your Site and Downloading the Theme

When you are done designing your site, you should first test the new theme before downloading the theme for your site. Make sure you save your design first.

Save Your New Design

Click on “File” in the menu, and select save.

How to Save A Design

Test Your New Theme

Then, click “Test Theme” at the top left hand side of the editor.

Test Theme

A preview of the newly designed site will open in a new page.

New Design Preview

Click “Back to Editor” at the top left hand side of the preview page to return to Lubith Editor and download your new design or continue editing.

Back to Editor

When you are thoroughly satisfied, you can download your theme. Click Download at the top left hand side of the Lubith Editor. The theme will immediately download as a zip file.

Download Zip File

Creating and downloading your own theme with Lubith is as easy as that. If your web hosting account and domain name are ready, you are ready to install your new WordPress theme. Just ensure you take your time to come up with a theme you’d really love.

Conclusion

The entire process of creating your own WordPress theme with Lubith requires no coding skills at all. So, carefully create a theme that perfectly matches your need.

Let us know any other tool that make WordPress rock for you in the comments section.

Get Started Creating Your WordPress Theme With Lubith