wordpress練習(第4章まで)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type');?>;charset=<?php bloginfo('charset');?>" />
<title><?php bloginfo('name'); ?><?php wp_title(); ?></title>
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css"/>
<link rel="alternate" type="application/rss+xml" title="RSS フィード" href="<?php bloginfo('rss2_url'); ?>" />
</head>

<body>
<!-- コンテナ-->
<div id="container">
<!-- ヘッダー-->

<div id="header">
<h1><a href="<?php  echo home_url(); ?>"><?php bloginfo('name'); ?></a></h1>
<p id="desc"><?php bloginfo('description'); ?></p>
<p id="image"><img src="<?php bloginfo('template_url');?>/header.jpg "alt="*"  width="760" height="200" /></p>
</div>

<!-- コンテンツ -->

<div id="content">

<?php if( is_category()): ?>
<p id="pagetitle"><?php single_cat_title(); ?></p>
<?php endif; ?>

<?php if(is_month()): ?>
<p id="pagetitle"><?php single_month_title(); ?></p>
<?php endif; ?>

<?php if(have_posts()): while(have_posts()): the_post(); ?>

<div class="post">
<h2><a href="<?php the_permalink(); ?>">
<?php the_title(); ?></a></h2>

<?php the_content();?>
<p class="postinfo">
<?php echo get_the_date();  ?>
<?php the_time();?>
|
カテゴリー:<?php the_category(','); ?>
</p>
</div>

<?php if(is_single()) :?>
<p class="pagelink">
<span class="oldpage"><?php previous_post_link(); ?></span>
<span class="newpage"><?php next_post_link();  ?></span>
</p>
<?php endif; ?>
<?php endwhile; endif; ?>

<?php if(is_home()): ?>
<p class="pagelink">
<span class="oldpage"><?php next_posts_link('&laquo; 古い記事'); ?></span>
<span class="newpage"><?php previous_posts_link('新しい記事 &raquo;'); ?></span>
</p>
<?php endif; ?>

<?php if(is_archive()): ?>
<p class="pagelink">
<span class="oldpage"><?php next_posts_link('&laquo; 古い記事'); ?></span>

<span class="newpage"><?php previous_posts_link(' 新しい記事 &raquo;'); ?></span>
</p>
<?php endif; ?>

</div>

<!--サイドバー-->

<div id="sidebar">
<ul>
<?php dynamic_sidebar(); ?>
</ul>

<p class="feed">
<img src="<?php bloginfo('template_url'); ?>/feed-icon-28x28.png" alt="*" width="28" height="28" />
<a href="<?php bloginfo('rss2_url') ;?>">
</a>
RSS FEED
</p>
</div>

<!--フッター-->

<div id="footer">
<address>Copyright &copy; <a href="mailto:<?php bloginfo('admin_email'); ?>">practice</a>,All rights reserved.</address>
</div>

</div>

</body>
</html>
/*
Theme Name: Sample Theme
Theme URI: http://www.www.www/
Description: This is my sample theme.
*/

/*コンテナ*/

div#container{
	width: 760px;
	margin: auto
}

/*ヘッダー*/

div#header h1 {
font-size: 1.875em;
margin: 0;
float: left;
margin-bottom: 4px
}

div#header h1 a {
	text-decoration: none;
	color: #000;
	}
	
div#header p#desc{
font-size: 0.75em;
color: #444;
margin: 0;
float: right;
margin-top: 18px;
}

div#header {
border-bottom: none;
padding-bottom: 0;
margin-bottom: 20px;	
}

div#header p#image{
	margin: 8px 0 0;
	}
	
/*コンテンツ*/
div#content {
	width: 515px;
	float: left;
}

p#pagetitle {
	font-size: 0.875em;
	font-weight: bold;
	color: #0c8bcd;
	border: dotted 1px #0c8bcd;
	text-align: center;
	padding: 10px 0;
	margin-top: 0
}

/*記事*/
div.post {
	border: solid 1px #0c8bcd;
	padding: 15px;
	margin-bottom: 20px;
	}
	
div.post h2{
	background-color:#a3d2f2;
	background-image: url(titlebar.png);
	font-size: 0.875em;
	padding: 10px;
	margin: 0;
}

div.post h2 a{
	text-decoration: none;
	color: #000
}

div.post p{
	font-size: 0.875em;
	line-height: 1.6;
	margin-top: 10px
	}
	
p.postinfo {
	color: #0c8bcd;
	text-align: right;
	margin: 20px 0 0;
	clear: both
}

p. postinfo a{
	color: #0c8bcd
	}
	
	/*記事内の画像*/
.aligncenter{
	display: block;
	margin-left: auto;
	margin-right: auto;
}
	
div.post img{
	border: none
}

.alignleft{
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
}

.alignright{
	float: right;
	margin-left: 10px;
	margin-bottom: 10px;
}

.wp-caption {
border: solid 1px #aaa;
text-align: center;
padding-top: 5px;
}
	
/*ページリンク*/

span.oldpage{
	float: left
}

span.newpage{
	float: right;
}

p.pagelink a{
fontsize: 0.75em;
color: 0c8bcd;
}

p.pagelink{
overflow: hidden;
width: 100%;
}

/*サイドバー*/
div#sidebar{
	width: 220px;
	float: right;
}

div#sidebar ul{
	margin: 0;
	padding: 0;
}

div#sidebar li {
list-style-type: none
}

div#sidebar .widget{
	background-color: #0c8bcd;
	padding: 16px;
	margin-bottom: 10px;
}

div#sidebar h2{
font-size: 0.75em;
color: #fff;
border-bottom: solid 1px #fff;
padding-bottom: 8px;
margin: 0 0 10px
}

div#sidebar li li{
font-size: 0.75em;
margin-bottom: 4px;
background-image: url(listmark.gif);
background-repeat: no-repeat;
padding-left: 16px	
}

div#sidebar li li a{
text-decoration: none;
color: #fff	
}

/*カレンダー*/
.widget_calendar h2 {
	display: none
	}

#wp-calendar {
	font-size: 0.75em;
	color: #FFF;
	width: 100%
	}
	
#wp-calendar a{
	color: #FFF;
}

#wp-calendar td, #wp-calendar th{
	text-align: center;
}

#wp-calendar caption{
	font-weight: bold;
	text-align: left;
	border-bottom: solid 1px #FFFFFF;
	padding-bottom: 8px;
	margin-bottom: 8px;	
}

#wp-calendar #prev{
	text-align: left;
	padding-top: 3px;	
}

#wp-calendar #next{
	text-align: right;
	padding-top: 3px	
}

/* フィード */

p.feed {
	font-size: 0.75em;
	font-family: Verdana, Helvetica, sans-serif;
	border: solid 1px #0c8bcd;
	padding: 5px;
	margin: 25px 0
}

p.feed a{
	color:#444;
	text-decoration: none
}

p.feed img{
	vertical-align: middle;
	margin-right: 8px;
}

/*フッター*/
div#footer {
	clear: both;
	border-top: solid 3px #000;
	padding: 6px 0
}

address{
font-size: 0.75em;
font-style: normal;
font-family: Verdana, sans-serif;
margin: 0
}

address a{
color: #000	
	}