Create Cms-look Blog Pages With Dynamic Content WordPress hacks

[imjjss 0]

We love blogs because the build in advanced content management makes our life easier. We don't need to create a website from scratch.

But many of us are blogging not just for journaling personal stuffs. We want to go CMS. So, we hate some of the blog features--pages come with a sidebar, contents is one colum that we can't easily manage the layout to our heart desire.

After some study and test, I've found an easy way to create WordPress pages in any layout I prefer.

If you want the freedom of your WordPress page layout, read on.

Step one: Create a funtion for easier access to custom fields

In your theme's functions.php, add this code:

function get_custom_field_data($key, $echo = false) {	global $post;	$value = get_post_meta($post->ID, $key, true);	if($echo == false) {		return $value;	} else { 		echo $value;	}}

Step two: Create a CMS-look page template

For making your CMS site looks attractive and not like a blog, you'll need to decide what kind of layout represent your business the best. On my blog, I made a 6 blocks layout, with 3 blocks on top, one wide block in middle, and 2 blocks at bottom. The layout is up to your heart desire, here I will mainly show you how to make this layout a template that you can use when post a page.

 

1. Make a copy of page.php, give the copy another name;

 

2. Open the new-page.php, on the top of the file, change the Template Name to something else, such as "My CMS Page" (without quotes);

 

3. Here's where your CMS layout can start: <div id="content"> . You can replace stuffs inside this div with your html layout.

 

But there are some php codes inside the content div to keep this page fully functions. If you don't care those blog functions, just go ahead. But, if you prefer keep it, they will do nothing to damage your CMS layout. I prefer to keep them-- for example, you never know which day you need a page ID in some other process. So, scroll down to start our html below these block:

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>				<h2 class="pagetitle"><?php the_title(); ?></h2>				<div class="post" id="post-<?php the_ID(); ?>">					<div class="entry">

So, now your CMS layout is within blog page's entry div.

 

4. Do you prefer keep sidebar? if not, remove this line at the end of this file:

</div> linenums:0'><div id="top-left-block" class="CMS-blocks"><?php if(function_exists('get_custom_field_data')) {get_custom_field_data('top-left-block', true);} ?></div>

In this code, I'm telling the blog to find a custom field with the name of "top-left-block", get its value and print it here.

Use this code to put in content with different custom field name for different blocks.

By the way, Use this idea, you can also call a widget instead of calling custom field value

Step Five: Post page

In the previous steps, we are calling custom field value, but what is the value? -- It's the value you input each time when you create a new page. Here's how:

Go to Dashboard, create a new page, in the custom field panel, Add a new field "top-left-block", type in something as its vlue. Save it. Now you go to view the page, you'll see that the value you typed in the "top-left-block" field showing up on page.

Now, do more-- type in a whole lot of contents with html tags in this "top-left-block" field. Go to view your page-- wow, it's really a block of contents nicely arranged inside the block you created.

You get the idea? ok, go to add custom fields that you called in the CMS temppate and input their values.

Now, go to view your page again-- a page with your desired layout!

Of course, you need to style it. Notice in my html code, I give the div an ID and a class? That's for CSS styling usage.

 

That's all you need to do to make your blog page powerful and not look like a blog. Hope you enjoy!