How to Design WordPress Layout
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>OpenSource Online Magazine with Typeography</title>
<script type="text/javascript" src=""></script>
<style type="text/css" media="screen">
@import url("style01-basic.css");
</style>
</head>
<body>
<body>
<a name="top"></a><!--anchor for top-->
<div id="container"><!--container goes here-->
<div id="header">
<h1>Header: OpenSource Online Magazine</h1>
<p><em>Using Open Source for work and play</em></p>
</div><!--//header-->
<!-- Begin #container2 this holds the content and sidebars-->
<div id="container2">
<!-- Begin #container3 keeps the left col and body positioned-->
<div id="container3">
<!-- Begin #content -->
<div id="content">
<h2>Content: This Month</h2>
<div>
<h2><a href="#">Really Long Article Title Name The More Text The Better Cause You Never Know</a></h2>
<p>by Author Name for <a href="#"/>Column Type</a></p>
<div><!--//post-->
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed a eros nec orci volutpat vestibulum. Ut pellentesque sagittis metus. In euismod tellus id ante. Ut lectus. Nunc adipiscing. Praesent luctus, massa quis vulputate rhoncus, justo turpis mollis dolor, nec blandit nisl mauris et pede.</p>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed a eros nec orci volutpat vestibulum. Ut pellentesque sagittis metus.</p>
<p><a href="#"/>Read the rest of this entry »</a></p>
</div><!--//post-->
<p>No Comments <a href="#">Add Your Thoughts</a></p>
</div><!-- //content -->
<!-- #left sidebar -->
<div id="sidebarLT">
<h2>Left Sidebar: Features</h2>
<ul>
<li><a href="#">Article Name 01 Lorem ipsum dolor sit amet consectetuer adipiscing elit</a></li>
<li><a href="#">Article Name 02 Lorem ipsum dolor sit amet</a></li>
<li><a href="#">Article Name 03 Lorem ipsum</a></li>
</ul>
<h2>Columns</h2>
<ul>
<li><a href="#">Name of Category 01 Lorem ipsum dolor sit amet consectetuer</a></li>
<li><a href="#">Name of Category 02 Lorem ipsum dolor sit amet</a></li>
<li><a href="#">Name of Category 03 Lorem ipsum dolor sit amet consectetuer adipiscing elit.</a></li>
</ul>
<h2>Past Issues</h2>
<ul>
<li><a href="#">Archive Link year/month 01</a></li>
<li><a href="#">Archive Link year/month 02</a></li>
<li><a href="#">Archive Link year/month 03</a></li>
</ul>
</div><!--//sidebarLT -->
</div><!--//container3-->
<!-- #right sidebar -->
<div id="sidebarRT">
<div>Right Sidebar: Key BlockQuotes, links, adds other items.</div>
</div><!--//sidebarRT -->
</div><!--//container2-->
<div id="top_navlist">
<h2>main navigation</h2>
<ul>
<li><a href="#">link 01</a></li>
<li><a href="#">link 02</a></li>
<li><a href="#">link 03</a></li>
</ul>
</div><!--//top_navlist-->
<div id="footer">
<div id="footer">
<div id="footerRight">
<h3>Footer Information</h3>
<p>
<a href="#">link 01</a> |
<a href="#">link 02</a> |
<a href="#">link 03</a> |
<a href="#">link 04</a> |
<a href="#">link 05</a><br>
</p>
</div><!--//footerRight-->
<div id="footerLeft">
<p>
OpenSource Online Magazine is proudly powered by
<a href="http://wordpress.org/">WordPress</a>
</p>
</div><!--//footerLeft-->
</div><!--//footer-->
</div><!--//footer-->
</div><!--//container-->
</body>
</body>
</html> |
This entry was posted on Saturday, December 19th, 2009 at 11:26 pm and is filed under Uncategorized. You can follow any responses to this entry through the RSS 2.0 feed.
You can leave a response, or trackback from your own site.