How to Style Contact Form 7 Forms in WordPress

Watch out! This tutorial is over 7 years old. Please keep this in mind as some code snippets provided may no longer work or need modification to work on current systems.

Contact Form 7 can manage multiple contact forms in WordPress, plus you can customize the form and the mail contents flexibly with simple markup. The form supports Ajax-powered submitting, CAPTCHA, Akismet spam filtering and so on.

The biggest downside is that the out of the box forms you add are very plain looking. Thankfully, Contact Form 7 can be easily styled using CSS in your WordPress theme. In this turorial, we will show you how to style contact form 7 forms in WordPress.

Continue reading

Manually Create a Sticky Floating Footer Bar in WordPress

Watch out! This tutorial is over 8 years old. Please keep this in mind as some code snippets provided may no longer work or need modification to work on current systems.

A sticky floating footer bar allows you to prominently display your important content to users. This bar remains visible to users at all time, so they are more likely to click on it and discover more useful content.

This method requires you to add code in your WordPress files, so we will be using the File Manager plugin, already installed on the DkIT WordPress servers.

Continue reading

A “Hello, World” HTML document

Watch out! This tutorial is over 8 years old. Please keep this in mind as some code snippets provided may no longer work or need modification to work on current systems.

You create a file and put special character sequences called HTML elements into your file. These elements identify the structural parts of your document. When a Web browser displays the file, it will display your file’s content, but not the characters that make up the structure.

Here is an example:

<!DOCTYPE html PUBLIC "-//IETF//DTD HTML 2.0//EN">
<HTML>
   <HEAD>
      <TITLE>
         A Small Hello 
      </TITLE>
   </HEAD>
<BODY>
   <H1>Hi</H1>
   <P>This is very minimal "hello world" HTML document.</P> 
</BODY>
</HTML>

Only the elements that you place in the BODY element (that is, between <BODY> and </BODY> ) ever get displayed in a Web browser’s window.

In this example, only the contents of the H1 element (between <H1> and </H1> ) and the P element (between <P> and </P> ) are displayed.