Step 1: Create a New Theme Folder and Necessary
Files
On your desktop, create a new folder to hold your theme files.
Name it whatever you’d like your theme to be named.
Next, create a few files (which all go in your new theme folder)
in your code editor. Don’t do anything to them just yet. Just leave them open
for further editing.
·
Style.css
·
Index.php
·
header.php
·
sidebar.php
·
footer.php
Step 2: Copy Existing CSS
Into New Stylesheet
1..Add following code in Style.css file.
/*
|
Theme Name: Replace with your Theme's name.
|
Theme URI: Your Theme's URI
|
Description: A brief description.
|
Version: 1.0
|
Author: You
|
Author URI: Your website address.
|
*/
|
2..copy
and peast your css(Stylsheet) code now.
|
Step 3: header.php
copy content in this file.
1..Add following code in
Head tag.
<title><?php
wp_title(); ?></title>
<link
rel="stylesheet" type="text/css" href="<?php
bloginfo('stylesheet_url'); ?>" />
<script type="text/javascript"
src="<?php bloginfo('template_url');
?>/js/jquery-1.11.0.min.js"></script>
<script type="text/javascript"
src="<?php bloginfo('template_url');
?>/js/responsiveCarousel.min.js"></script>
2.. Add following code in menu DIV.
<?php
$defaults
= array(
'theme_location' => '',
'menu' => '',
'container' => 'div',
'container_class' => '',
'container_id' => '',
'menu_class' => 'menu',
'menu_id' => '',
'echo' => true,
'fallback_cb' => 'wp_page_menu',
'before' => '',
'after' => '',
'link_before' => '',
'link_after' => '',
'items_wrap' => '<ul id="menu"
class="%2$s">%3$s</ul>',
'depth' => 0,
'walker' => ''
);
wp_nav_menu(
$defaults );
?>
Step 4: footer.php copy footer content content in this
file.
Step 5: sidebar.php copy sidebar content content in this
file.
Step 6: Index.php in this file following steps.
1..At top put following code:
<?php get_header(); ?>
2..Put following content now.
<div id="primary" class="content-area">
<main
id="main" class="site-main" role="main">
<?php if ( have_posts() ) : ?>
<?php while ( have_posts() ) : the_post(); ?>
<div id="post-<?php the_ID(); ?>"
<?php post_class(); ?>>
<div class="post-header">
<div class="date"><?php the_time( 'M j
y' ); ?></div>
<h2><a
href="<?php the_permalink(); ?>" rel="bookmark"
title="Permanent Link to <?php the_title_attribute();
?>"><?php the_title(); ?></a></h2>
<div
class="author"><?php the_author(); ?></div>
</div><!--end post header-->
<div
class="entry clear">
<?php if (
function_exists( 'add_theme_support' ) ) the_post_thumbnail(); ?>
<?php
the_content(); ?>
<?php
edit_post_link(); ?>
<?php
wp_link_pages(); ?> </div>
<!--end
entry-->
<div
class="post-footer">
<div
class="comments"><?php comments_popup_link( 'Leave a Comment',
'1 Comment', '% Comments' ); ?></div>
</div><!--end post footer-->
</div><!--end post-->
<?php endwhile; /* rewind or continue if all posts have
been fetched */ ?>
<div
class="navigation index">
<div
class="alignleft"><?php next_posts_link( 'Older Entries' );
?></div>
<div
class="alignright"><?php previous_posts_link( 'Newer Entries'
); ?></div>
</div><!--end navigation-->
<?php else : ?>
<?php endif; ?>
</main><!-- .site-main -->
</div>
3..At bottom put following code:
<?php get_sidebar(); ?>
<?php get_footer(); ?>
Step 6:Upload theme
Place your new theme folder inside /wp-content/themes/.
Then navigate back to WP Admin > Appearance > Themes and your newly created
theme should appear there. Go ahead and activate it!
-:EXTRA:-
1>To add plugin in page add following code:
<?php wp_head(); ?>
Add
this code Before </head> in header.php
<?php wp_footer(); ?>
Add this code Before
</body> in footer.php
0 comments:
Post a Comment