How to create custom widgetized homepage in WordPress

WordPress is now known to be a CMS (Content Management System) instead of a simple blogging platform. A lot of developers like to create website using it, to save quality time on building a website and spending time styling each page.

However, a newbie to WordPress, like how it happen to me previously, would spend time styling the PHP files for a custom home page in WordPress. That will takes a long time, especially when copy need to be revise or added.

Widget Homepage

First in functions.php, we register a new widget,

register_sidebar(array(
'name' => 'Home Page',
'description' => '',
'before_widget' => '<div class="home-widget">',
'after_widget' => '</div>',
'before_title' => '<h4>',
'after_title' => '</h4>',
));

Then, in index.php, we point the front page / home page of default WordPress to a place where it is widgetized to allow custom content.

<?php if(is_home() || is_front_page()) { ?>
<?php get_header(); ?>
<div id="content">
<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('Home Page') ) : endif; ?> // Home page widget
</div>
<?php get_footer(); ?>

<?php } else { ?>
// Default WordPress loop
<?php } ?>

WP custom Homepage