WaveFront – a calm space

WaveFront

Click here to download the free WaveFront theme from the WordPress Theme Directory.

The WaveFront theme is a free generic WordPress theme designed to replicate the looks and features of the two custom WordPress sites Stop Living in the Past and AnnyChih.com.

WaveFront provides calm yet stylish layouts customized for basic CMS functionality with several custom page templates including a no-sidebar front page (Front Page template) with three bottom boxes. The theme also has a list of hidden features and extra content that can be turned on and off by editing the template files.

WaveFront was designed, styled and coded using Expression Design and Expression Web and is fully XHTML and CSS standards compliant.

Customization Options

To activate the front page, create two pages, one called Home and one called Blog (or whatever you want your regular blog page to be called). In the admin panel go to Settings -> Reading and change Front Page Displays to A Static Page choosing Home as the front page and Blog as the posts page.

Go to Page -> Edit and fill the Home page with whatever content you want to be displayed on the landing page of your site. The theme features several unusual fields in the front page:

  1. conditional custom field for an image or text that displays at the top of the page
  2. custom field controlling the left-bottom box
  3. Twitter feed from the right-bottom box

1. Front Page Conditional Custm Field

To use the conditional custom field at the top of the page create a new custom field in the page editor and give it the key “image” for image and “text” for text. If you use “image” the custom field will take a standard URL to any image available on the web. If you use “text” the field will take any standard HTML text with our without code.

2. Left-bottom Custom Field Box

To populate the left-bottom box with anything other than the default text create a new custom field with the key “leftBox” and fill it with standard HTML content. Keep in mind you need to set a header text within <h6> and </h6> tags to get the header you want and write the rest of the text inside <p> tags. The field accepts regular links and images.

3. Twitter Box Configuration

To set the Twitter box to display your latest Twitter updates go to your theme folder and find the twitter.php file within the TwitterBox folder. Change the word “TwitterProfile” on lines 5 and 9 to your Twitter profile name to activate it. If you want to reduce or increase the number of updates displayed, change the number at the end of the code string on line 9.

You are free to use, modify and mess around with this theme in any way you want as long as you keep the attribution link back to Pink & Yellow Media.

WaveFront was built from scratch on top of my previous Typograph theme available from the WordPress Theme Directory here.

15 thoughts on “WaveFront – a calm space

  1. Hi, I found a bug. The footer shows up in the middle of the page, when the page’s content is shorter than the right sidebar content. Is something not floating or wrapping correctly?

    1. Michael, it’s not a bug as much as an ommission. I guess I should have set one of the content divs to a min-height to avoid the shifting. The theme is actually working correctly, it just looks weird. I’ll update it in the next version.

  2. hi. forgive my ignorance. i would like to have a header image as shown in the thumbnail, and don’t understand the above explanation. can you give me the code and tell me where to put it 🙂
    thanks

  3. I am not picking up what your are laying down about the frontpage.php. After I make the add-in adjustments in expression, I then go back to wp-admin and try and reupload frontpage.php. I keep receiving an error message stating file does not have correct or enough security clearance/permission. Checked my permissions and I can write, read, and execute for this folder.

    Anyone experience the same issue?

  4. Morton, I really like your theme layout though I am having some difficulty with building an emulating design like that of the image above. Could you email me and/or supply some step-by-step instructions on how to (1) add an image to each post, (2) insert the custom script at bottom left, and (3) insert twitter feed. Thanks a lot for your help! I am not

    1. I wrote an extensive explanation of how to do what you are talking about in the readme.txt file in the theme folder. Look over it and see if it makes sense. If you’re still having trouble, report back and I’ll see if I can write up something a bit clearer for you.

  5. Love the theme, but I am having one issue. I created a Home and Blog tab so I could set the static page as instructed, but now I have two “Home” listings in the navigation bar. Is there anyway to change that so it has all my pages only listed once?

    1. To remove the second Home button (actually the first) from the theme just open header.php and remove the line that calls the home file. I think I even left a comment in the theme file to explain what line to remove. As for the blog posts box read the readme.txt file – it explains everything. There is an update in the works that will widgetize the three bottom boxes but it’s not due for another month or two.

  6. Great Example of Expression and WordPress working together.

    I am new to this, and don’t want to sound too dumb but … does WordPress let you upload this? Is there a way to be live, where you update local and upload/FTP the changes? Or would I need my own hosting company that would be wordpress friendly?

    Thanks

  7. Thanks for posting this info. I just want to let you know that I just check out your site and I find it very interesting and informative. I can’t wait to read lots of your posts. He said that the best advice he could give was for him to try to leave his work at work and not bring it home to his family and burden his wife and kids.

  8. Thank you for your article and this theme. This is new to me, but you’ve provided some really useful information. Look forward to working with this.

Comments are closed.