On the pretext of sounding like broken record, we say it again – WordPress is huge! Over 74,652,825 and counting user base is a reigning proof of WordPress popularity. So what makes WordPress so popular? Among other reasons, themes are one of the major reasons of its popularity. And if you are looking into ways to get a complete and functioning WordPress theme, this post is right up your alley.
Check out below to understand how you can get started with theme development in WordPress.
Themes in WordPress
You can get all the front end styling for your website from WordPress themes.
These themes provide:
1. Style of the site
3. Font Styling
4. Widget locations
5. Page layouts
6. Styles for blog posts and blog archives
Naming a WordPress theme
You should be aware of WordPress’s directory structure to build a theme in WP. You have to create a sub folder in the wp-content/themes directory in WordPress folder. The name of the sub folder created should match with the name of the theme you need to create and that name should be unique in the theme folder.
Keep a HTML document ready with you to develop a theme in WordPress and place the HTML file with its assets (CSS and JS) in the theme directory.
Breaking up the HTML template into PHP files.
This step involves creating four PHP files. We have to create index.php, header.php, sidebar.php and footer.php by breaking the HTML file into four parts using the HTML file and save them in the same theme folder. Create another file in the same directory style.css for styling purposes.
How these files work is shown below :
header.php : It contains the code for the header section of the theme.
Index.php : It is the main file and it contains the code for the “Main Area” and it will specify where the other files will be included.
Sidebar.php : It contains the information about the sidebar.
Footer.php : It handles your footer.
Style.css : It will handle the styling of new theme.
<?php get_header(); ?><div id =”main”><div id=”content”><h1>Main Area</h1></div><?php get_sidebar(); ?></div><?php get_footer(); ?>
<div id=”sidebar”><h2 >Sidebar Area</h2></div>
Now let us see what each of these files contains.
By calling a few below functions, you can fetch HTML template into index.php
1. To call header.php, use get_header()
2. To call footer.php, use get_footer()
3. To call sidebar.php, use get_sidebar()
4. To provide the full path of the theme directory to access the style sheet and scripts use function : get_template_directory_uri()
5. To show the title of the post use function : the_title()
Below WordPress predefined function is used to fetch the post in HTML theme.
This function is used to fetch all the contents and the titles of the posts, along with the time when these were posted. You then need to place the above code in HTML template accordingly and you are done!
Netrouting is committed to fulfil the mission critical IT demands for Web Hosting platform using the best hardware available, spread over multiple data centers to ensure the quality and availability of your blog and website. Netrouting utilizes a Cloud based infrastructure for offering its Web Hosting service. Redundant storage, daily backups and automated fail over is included with its packages. Get in touch with us now!