Styling A Website Without The Expense

Styling A Website Without The Expense

The style of a website means the way it looks, the design, the colors, the typography, the logo, isn’t this what the designer does for a website? Not if you have the software to style the website you don’t need a designer.

Not everyone likes to style, that’s when you find a designer but you must be prepared to pay them for their services. As you should. No one should work for free. This is if you want someone to do your website for you. 

If you want to learn how to style a website contact me and I’ll show you how it’s possible to style a website without the expense. What you need is basic knowlege because there is an initial learning curve.

Design Tools

Design tools contained within the website software are made for this purpose. Notice the heading Design Tools with the small highlight added in, this is a Design Tool. It is a plugin that is specifically made to enhance the style of the text.

I can also change the text style and make it a different color:

Change The Text Style

This is done inside the Text Module in the Design section where I can change the color, and the style of the heading. All this is done by selecting the style and the style appears. There’s no magic to it. It’s just one of the many features built into the software used to style a website.

The point of style is to showcase the content in a form that is attractive and pleasing to the visitor. If there is too much print it is tiresome to read. I’m sure you’ve noticed how different life is for us. We now consume larger quantities of information and we are often operating on information overload.

\

The Images

Images are vital to the style of a website. They convey meaning without words. All the images should be compressed and resized before uploading it into the website. 

If an image file is too large it will slow the page load time. 

Styling is possible with any module. There is no limit to the design you can use. The only thing to avoid is overdoing the style.

You don’t have to follow the trend of styles. They will always change and you’ll find yourself wondering which style is the best style. There isn’t one. 

Styles

The style can always be altered and the text can change color. Even the background can be changed. 

Uniquely Different

You will stand out from the competition when you start to style a website. It will be your style and not a uniform style that looks like every other website.

Styling is effective and the choice of color for the style of the website is a matter of personal choice. You can look up the meanings of colors but it comes down to what color resonates with your idea for the website you want to create. All the styling done on this website cost $0.00 because the style elements are built into the software using the Divi Theme.

There are some developers that will tell you this kind of styling is not good for SEO because the content is placed into modules within sections and rows.

The truth is; the content on a web page is contained in dividers which are positioned inside tables of sections and rows. Inside the rows are the modules which contain the content. All web pages have the same structure regardless of the kind of content placed into them.

An ‘expert’ will tell you that you need them to do it for you, and you’re not able to do it. Why? Because they want to charge you for their service to ‘optimze for SEO.’ The way you optimize for SEO is to offer regular topical content directly on point to the subject.

A search engine crawls the website, and if your content is topical and relevant to the search query; your website will be found.

When you style a website Using Divi, which is the same Theme the designers and developers use, you can style your website without the expense.

How to Use Divi for Blog Posts

How to Use Divi for Blog Posts

As you can see this blog post has a different style from the regular blog layout with text and a right sidebar. There is no way I could achieve this without having to know code. This particular layout is achieved by using a plugin. The plugin I’m using is Divi Blog Extras developed by Divi Extended. This is my affiliate link. I have used this plugin for two years on my website and on client sites. It is an excellent plugin.

A blog post has to be informative and the content needs to be layed out attractively so it gets read. Too much content is clutter and doesn’t get read. When you set up the blog page you have to decide if you want a side bar or a fullwidth. This post is set to fullwidth.

The title of the post and the meta data is positioned in the center and the blog post content is positioned in the center of the page. This style is particularly attractive for when you want to emphasize information.

Some say you shouldn’t use the Divi Builder because it interferes with the SEO. This hasn’t been proved. The reality is the search engine reads the content on the page not the design. The module is a placeholder for the content. The search engine doesn’t know the difference, it just reads the content.

Too many people have too much to say about what you must and musn’t do when you create content. The volume of content produced is overwhelming and the truth is no one reads it all. It just makes you feel good because you’re creating the content. Is it relevant content? Or the word is it has to be “great content.”

Made for Divi

The point of all this is simple. I can do what I need to do with my blog post because I can use the plugin specifically made for Divi. The back end of WordPress is changing and developers must keep pace. The front end users are delighted because they get to use the Plugin made for Divi without having to know how to code.

The shift is happening in technology. Everyone can do it for themselves without having to pay costly fees. All you need is a basic understanding of how the software works so you can manage your website. Whether you’re a small business or a single person, the problem is the same. Without the basic knowledge you can and will be vulnerable.

When someone gives you advice, you want to know what they are talking about. You don’t want them to tell you something is necessary when you don’t need this expensive feature. But how do you know? The problem is we are being sold on the idea of success.

The Selling of Success

It is empty. No one can guarantee you anything, not even with a trial and your money back guarantee. In fact, the money back guarantee is the warning sign. You don’t need someone to guarantee your success. Only you can based on your efforts. Unfortunately, we have been led to believe it’s quick and easy. It isn’t. Managing a WordPress website has a definite learning curve.

Success isn’t for sale, it is achieved. 

The Divi User

The developer created the Divi Framework using the HTML code written to integrate with the WordPress code. The designer conceptualizes the Modules that are able to be used with the Divi Framework. The Divi Library Layout Packs contain readymade layouts. The user can create the content without the complexity of code.  The entire team work of the developer, the designer, and the user, creates the Divi Theme. Each person uses it in their own unique way.

A user’s delight, the introduction of the Visual Builder the best way to write a blog post is to see the content as you write.

The Visual Builder

This is an image of the Visual Builder used to write the content of this Blog Post. As you write the content you can see your edits on the page next to you. This is called the front end of the post. The editing section is the back end of the post. This is where you initate the post settings.

The layout structure shows you the column widths and you can conceptualize how you want the content to look on the page. Each of the sections are clearly visible as you hover over the setting. Now you can focus on the content and not the frustration with not knowing how something works.

Of course there are other details to take care of when you write a blog post. Some settings must be implement in the post editing section. This is the way all Themes work with WordPress.The point of this is to demonstrate how possible using the Divi Theme is, and why it gives you the control you’ve always wanted to have.

No code was used to write the content. All the code works in the background. The Visual Builder gives you the ability to create an interesting Blog Page.

Update and Improvements

Coming soon is a new way to improve on the already excellent existing backend builder combined with the visual builder.

You can read more about it here.

Suggested Further Reading

Divi Builder

Divi Builder

Blog With Divi Using the Divi Builder

Ever since the Divi Theme came out in 2013, I have been using it and this is why you see all these articles about Divi. It is the one theme that answered something for me personally. I can arrange the content of a website with any number of layouts and styles. Apart from having a love of art, design, and form, I with the help of the Divi Builder content is not a problem to put onto a web page.

The Divi Builder is a Page Builder that comes with the Divi Theme. The Page Builder helps you build the content using the drag and drop modules. The modules have specific functions and you can adjust the settings to style the text.

The Divi Builder works with most WordPress themes. One thing you’ll find with plugins, they can be incompatible. Anytime you have different teams of people contributing to a main source, there are bound to be collisions of incompatible computer code.

The Divi Builder has the modules built in. You select the specific module you want for the content for the page or blog post. When you open the Divi Builder you’ll see the Divi Builder with a standard section.

There are two ways you can put content onto a web page:

  • Use the Divi Library Layout
  • Use a standard, fullwidth, or specialty section layout

You are not using the default WordPress post editor. All the icons on the tool bar in the default editor will be inside the modules. In our example we’re going to use an image and a text module for a blog post.

Refine the text

You don’t want long text, should align with the image.  

The block, or modular system lets you place content without using HTML code. You enter the content into the placeholder, the text module.

Let’s look at the layout with the modules and the settings used. The image module is on the left and the text module on the right. The row has a background color with a reduced margin (or gutter) width.
This is what the back end layout looks like. An image and a text module in a two column row layout.

To set the background color we have to open the Row Module Settings and locate the Background in the Content area of the Module. There are three areas, the Content, Design, and Advanced tabs which contain all the different settings to style the module.

In the Row Module Setting start with the background color. You want to choose a softer color rather than brighter.

Did you know there are many people who can see color but are “color blind,” they don’t see the true color but an altered color.

We are selecting a background color to compliment the content and someone with a disability. The content in this row is an image on the left and the text on the right.

After setting the background color go to the design tab and set the row to fullwidth. Scroll down and you will see the option to use the Custom Gutter Width. Set the Gutter width to 1. This reduces the margin of the 1/2 and 1/2 column width.

Equalize the Column Heights to make sure the content and the image are aligned. The image is in Column 1 and the text in Column 2.

This blog post was writen using the Divi Builder.

The ability to style the content onto the blog page enhances the reading experience for the person reading the blog post. This might take some extra time but it is worth the extra time to make the content interesting and emphasize a specific point.

Your work isn’t in vain, you can save the layout to the library and reuse it.

Update

Since this article was written in January 2018 the Divi Theme has added another stunning feature the Divi Visual Builder. This is an onpage editing tool where you see your edits in real time.

You aren’t looking at the wireframe view, you’re looking at the web page view. Here’s a link to the article about the Visual Builder on my other website. Check it out.

The Divi Visual Builder

Read more about using the Divi Theme

How to Use Divi for Blog Posts

How to Use Divi for Blog Posts

As you can see this blog post has a different style from the regular blog layout with text and a right sidebar. There is no way I could achieve this...

read more
Divi Builder

Divi Builder

Blog With Divi Using the Divi Builder Ever since the Divi Theme came out in 2013, I have been using it and this is why you see all these articles...

read more

The Divi Framework

The Divi Framework

What is a Framework?
A framework is the foundation, the building blocks, for something to exist inside the frame.
Divi Theme
A theme is a design element that uses the framework. This website was built with the Divi Framework using the modules.

A theme has a specific style used throughout the website. A Framework is something used to mold the style. The style is built onto the framework. 

Where do you start?

With the Divi Framework. It is the ideal place to begin to take in the whole concept of building a website. With no knowledge of code, or how a website works, you can build one with the Divi Framework. It is specifically designed for the do-it-yourself take charge person or organization.

We’re faced with a changing world. In the last two or three years we have seen nothing but change. Different ways of doing things. Whoever thought you would order groceries online, or read an electronic book instead of a paper one. We use systems and software constantly. It takes time to get to know the software and how it works.

There is a learning curve with the Divi Theme. But this is the fun part because you have a community of users of the Divi Theme. The Divi Theme is the most used theme in the world, and has been translated into thirty two different languages. 

Translated into thirty-two different languages is a fact, not a sales pitch. Divi is so successful it is the go-to Framework for developers and designers to create their Templates.

The whole structure of the framework is a different way to work on a website. This blog post is written using the Divi Visual Builder, as I’m entering text into the text module, I can see how the text looks on the page directly. Of course there is more to building a website than entering text onto a page.

This is a partial list of the Modules available. Each one has a particular function. You select the module and it will open for you to use. The Image module was used for the image above. This text is placed inside the Text Module. The module contains settings to style the text with the icons.

An Open Text Module

The image on the left is an example of what the text looks like when you enter it directly into the Text Module using the Visual Builder.

In the Divi Framework you have:

The Divi Library, predefined page layouts

The Divi Builder, layout modules then preview

The Visual Builder, use modules on the page directly

Modules

Every module has built in settings. If you don’t know what an icon does, click on it to find out.

The framework pulls the components of the website into place. Initially, you can use the premade layouts in the Divi Library. Once you get used to how the modules work you’ll find you start creating your own specific style and layout with the Divi Framework.

More About Divi

Styling A Website Without The Expense

The style of a website means the way it looks, the design, the colors, the typography, the logo, isn't this what the designer does for a website? Not if you have the software to style the website you don't need a designer. Not everyone likes to style, that's when you...

How to Use Divi for Blog Posts

As you can see this blog post has a different style from the regular blog layout with text and a right sidebar. There is no way I could achieve this without having to know code. This particular layout is achieved by using a plugin. The plugin I'm using is Divi Blog...

Divi Builder

Blog With Divi Using the Divi Builder Ever since the Divi Theme came out in 2013, I have been using it and this is why you see all these articles about Divi. It is the one theme that answered something for me personally. I can arrange the content of a website with any...

The Divi Framework

A framework is the foundation, the building blocks, for something to exist inside the frame. The Divi Framework is the foundation upon which you build the website.

Download Upload Activate Divi

The do-it-yourself with Divi isn't complicated when you know how. Here are the steps for implementing the Divi Theme. You must be a member of Elegant Themes to use the Divi Theme.  Download Divi From your Elegant Themes member area download the Divi Theme File...

Do It Yourself With Divi

Do it yourself with Divi is a series of blog posts and tutorials to show you how you can have a website and do it yourself. This isn't for every website. The kind of website depends on the specific purpose of the site. The way we can build a site has changed. If...

One Click Update

The one click update is possible. To get to the point of being able to click the update button and wait for the updates to implement successfully means following some good practices for the wellbeing of the website. The one click update is user savvy. No one wants to...

And then there is Divi

In the beginning... there was a stillness on the horizon, the modules were an idea in the designer's mind, the ideal placeholder for the information. A text, an image, a blurb, a full width slider, and the family of modules was born into the house of Divi. The...

About the About Page

So, what's this all about? People want to know. It's the page on your website that gives people information about you or the business. We know this. We also know first impressions count as the visitor lands on the Homepage. Which is more important the Homepage or the...

A Website for the User

These slides take you through the thought process about your Website using WordPress and a WordPress Premium Theme. WordPress has become the choice software for half the Websites on the web. This is a whole lot of Websites. There are definite roles in the creation of...