3- (Wordpress)

, 2008.

...........................................................................................................3 ....................................................................................................................4 ..............................................................................................................6 .......................................................................................................14 (header.php) ..................................................................................................18 ( home.php) ........................................................................................29 ( l_sidebar.php r_sidebar.php) ..................................................36 ( footer.php).........................................................................................45 ( comments.php) .......................................................................48 ( index.php, 404.php, page.php, search.php) ............57 FAQ ...........................................................................................................................61

2

, , . (http://www.nicedom.com/), . , 3D- . , ! :-* , (http://www.vseuch.ru) Viggo (http://viggo.ru/) . (http://www.websovet.com/) . , - . , FAQ . kventori@yandex.ru Enjoy!

3

2- () CMS Wordpress (http://wordpress.org/), (http://www.websovet.com/). 3- , , , FAQ-. , : , HTML, CSS, CSS, id, class .. , -, . , CMS Wordpress ( ) . CMS (Content-Management-System) . PHP-, , HTML, , . -, , , , . CMS : , , , (, , ..). , . , . , () , . , , . CMS . . , , , , . ? , . . , , , , CMS, , - . , . , (), , , . . : Wordpress.com (http://www.wordpress.com/). ( , ) :

4

marusyashkvarkina.wordpress.com. Wordpress.org (http://wordpress.org/), : marusyashkvarkina.com. , , . , , , . . , , , . . - - -. , . . , , , , , -, . , ? . ? ? ? ? , ? ? ? ? ? , - ? ? ? ? ? , , . . ? ? ? ? ? ? ? ? ? , ? ? .. , . , -, : , , , . , , (http://www.websovet.com/). (http://www.websovet.com/category/delaem-dengi), . , , ( , ) FAQ, , , . ! , . (http://www.websovet.com/), , .

5

? . , , . . , , , ( - -), . . - , , : , . : , , , , . : ice pepper. , , - . icepepper.net , . , , . , , . , , 4 , . . . , . " ". :

6

, . -, 960 . . , 960 Grid System (http://960.gs/) PDF ( 180 ). : 960, 880, 800, 720 ( ). 3- , 2-. -, , , . , , . , , , . , : , , . , #header, h1 : .logo .description #menu -, . , ! , () , , , . - , , . . . , 125125 100100. 210 , 2 100100. 10 . , . , . , (), - -. ? , . , . 160 . 590 , . -, (footer). . , , . , , , , , . .

7

. . , , . , ice pepper blog , . , , , -, "---". , . , , ! ! ( 600 px ):

960800 . , : View Rulers ( ). : Edit Preferences Units & Rulers Rulers pixels. . , :

8

, , . , 590 . ! . ( ).

? , : 590px, 210px, 160px. , . 100 , 300. . : , - , . . ! , , . . , , . ? - . Pixie (http://www.nattyware.com),

9

. : #2D3F49 #15191C. , Gradient Tool, Radial Gradient . , . (Custom Shape Tool) - , : ice pepper, . Arial, -50. , . . , , , . , : Layers , . , . . Crop Tool , Enter . bg-header images. . ! ! : bg-header, bg_header, bgheader. : bg header, -. History , " ". : . header, bg-header. , ( " " Save for Web) . , , , 2- GIF. PNG, . PNG, "" GIF . JPG. " " Quality. GIF Colors , -, 256. , 128, 64. . JPG High. PNG-24 . , 400 800%

10

. , , . . Crop Tool Enter. , .

. : . , , , . , , . , . : , , , Slice Tool , Crop Tool () . , : 960 5. #28363E, - : #020202 #2E3F47.

: , Crop Tool Enter. ! bg-container. , : 5 . 1 100. . , . container (repeat-y). : #28363E, , . , , . , , . .

11

, ( , , ), RSS- . Crop Tool , images.

: RSS- . , - , . , 1 , . "" . : 160 , , RSS- . , (footer). , , . : , , . , :

#footer . : , , , . - . , . , clear: both; CSS, , . , . :

, . , . , , . , . ICQ . , . , . .

12

- , , . , "" . . - : 1. . . 2. (!) . . , . - , . 3. . Layer 1,2,3 .. . 4. , . , , . , , .

13

Wordpress, . WP, , , php-, CSS ( ), - . themes , , , wp-content. , . . . , php- . : 404.php archives.php header.php home.php index.php sidebar.php comments.php footer.php page.php : 404.php archives.php header.php index.php single.php sidebar.php comments.php footer.php page.php ? , home.php, single.php. ? , , ( , , php- . , header.php . !). Sonika.ru (http://www.sonika.ru/blog/wordpress/template-hierarchy.htm). , home.php, . , index.php .

14

, , , index.html ( index.php, ). - home.php. ? -, . ( ) index.php, home.php. : index.php 2 . ( home.php) , . . -, (, , ). , , () , . , , . , . (home index) , . . . , home.php, index.php. ? single.php. , index.php. , . , , 404.php, home.php, single.php, archives.php page.php, : header.php index.php sidebar.php comments.php footer.php . , , . 404.php 404 ! . , - , , . . , , , .

15

, , . , . ( , ). archives.php . . , index.php, . , : , , , , , . , index.php. header.php . html- (DOCTYPE), , , , , css, rss-, . (), (description), , . , . PHP , , , . . , - , header.php. . . , index.php, , , : header.php. : : (): index.php : . , , .

16

index.php . , , , . . index.php, : , , , , , .. , . . . single.php . , - - . comments.php. sidebar.php , , (), ( ), ( , ) Meta () /, , , .. , . . , , . , l-sidebar.php r-sidebar.php. comments.php , . , : , . . . . , . page.php , . , , , . , , . : , , , .. , , . footer.php , . . , , , , ., 20 25 (, .), , , -. , . , , , . , , 2- , , .

17

. , , . . , , . . functions.php, . , PHP .

(header.php) , (header), header.php. , , : 1. (DOCTYPE). -, . DTD (Document Type Definition). , , , , . , . , . , . (http://www.artlebedev.ru/) . header.php ( . ): . Strict, , Transitional. , . , , . . =10 . , W3C (http://validator.w3.org/). 2. xml-. , . , , . 3. ( (), !), ( ) , . -

18

(Content-Type), (language), (description) (keywords). , (title) , , . CSS, favicon , RSS- . -. , , , . . - . :

, . , All-in-One SEO pack, , , . . Simple Tags. . , . , , . , . , . (title). , . , : , , , , ( ). . - (index, about ..) . , . . , , , ( ) . , : 1. . | . | . 2. . | . | . 3. . | . | . .. , . , , . . . , , : 1. . | . | . : |

20

, (favicon.ico): ! Atom 0.3 RSS .92 , . :

: screen all, . php-: ? "" (hook) . - , ( All-in-One SEO pack ), : "! !" , , , . . , . CSS, . - , , . , , . - . -, : , , , . -, ( , ). , #container. : . ! : : , (h1), ( -) . , :

, . , . "logo", CSS float: left; "" . "description", h1 . : , , . : ice pepper blog. . , . , . . , #menu. : "", id . , "". . :

Home About Author Contact Map RSS , , CSS : Home About Author Contact Map RSS , . . , . . , , . , . "": , . , icepepper. header php. , CSS. , : /* Theme Name: Icepepper Theme URL: http://www.icepepper.net/ Description: 3 column theme for WordPress. Author: Igor Kventor Author URI: http://www.dizweb.ru/ Version: 1.0 */ , . themes, . : , , , . , /* */. ,

24

CSS. . , : * { border: 0; margin: 0; padding: 0; } body { background: #15191c; color: #AAC6D2; font-size: .75em; font-family: Arial, Helvetica, Verdana, Sans-Serif; } #container { background: #27363E url(images/bg-container.gif) repeat-y; width: 960px; margin: 0 auto; } a, a:visited { text-decoration: none; } a:active { outline: none; } #header { background: #15191c url(images/bg-header.jpg) no-repeat; width: 960px; height: 124px; margin: 0 auto; } #header .logo { width: 144px; height: 124px; float: left; } #header h1 { color: #4AA0CF; font-size: 3.1em; font-weight: normal; letter-spacing: -2pt; } #header .description { width: 380px; color: #4F6B78;

25

margin: 0 0 0 150px; padding: 5px 0 0 0; font-size: 1.5em; letter-spacing: -1pt; float: left; } , , . " ". , - . " ". , , . , , , . , ( ) . , , , . body (). , -, #15191c. , . , . -, #AAC6D2. , . Arial. . . , bg-container.gif (Y). 960 . margin: 0 auto; - ( auto 0 ). . , - . , , ( ) . Firefox, , . , -, . . - 960124 . : bg-header.jpg - , 960 124 , auto 0. , . - . , . #header .logo , .logo #header. . . "".

26

- "" . , h1. : letter-spacing: -2pt; , , Character 50 ( , ). CSS, . , "" (pt), . : . ( ) - , . , , , 4, 5, 6 - . . . . ? ! . (h2). (h3). , (h4) , . (p), (, , ..) .description. : h1 description. , description h1. , 380 . , , . "" . margin: 0 0 0 150px; 150 , float: left; . ( #menu), , , , , . , - - . , , - . . -. , list-style-type: none; 100 . ,

27

. padding:15px 25px 0 0; 15 25 . : margin:15px 25px 0 0; , . , - . , . . , , . , hover, , . , , . . home.php, . , . , header.php: |

Map RSS : div . footer.php.

( home.php) . , , . , , , . . . : . , php-. , header.php. . : (loop): - , , loop. . , , . : () , . , , -. : , , . , . (h2):

29

. 2 ( ), , --. , , , . : , , , . : " " . . , . .: -. , . , , : . : . , : -, -, - .. wp-pagenavi, home.php . . , , . , () , , , -. . - pagenavi-css.css. , #content. :

31

. , : author.php, . , , . . home.php : CSS . : #content { width: 580px; float: left; padding: 0 0 20px 10px; } #content p { padding: 0px 0px 10px; } #content a { color: #4AA0CF; } #content a:hover { color: #4B5A69; } #content h2 { background: url(images/h.gif) no-repeat 0 50%; color: #4AA0CF; font-size: 2em; font-weight: normal; line-height: 1em; letter-spacing: -1pt; padding: 10px 0 10px 30px; } #content ol{ margin: 0 0 15px 20px; } #content ul{ list-style-type: square; margin: 0 0 15px 20px; } blockquote{

32

background: url(images/bquote.gif) no-repeat 95% 0; color: #8AA1AB; font-style: italic; padding: 10px 50px 10px 15px; } .post-date { color: #728790; font-size: .8em; margin: 10px 0 15px; } #content , . 20 , 10. 580, 590? , . , 580 . () : border: #fff dotted 1px; , . , , , . , 590 . , 10 :

, . http://www.icepepper.net/ . ( ) . 590 . , . , . . , 10 , . . . . , . (h2), . ( , ):

33

background: url(images/h.gif) no-repeat 0 50%; , , , . X, Y. , . , . X Y. : font-size: 2em; font-weight: normal; line-height: 1em; . 2em, 1em. , , . normal, , . - . , : #content ol{ margin: 0 0 15px 20px; } #content ul{ list-style-type: square; margin: 0 0 15px 20px; } , . (square). gif- : list-style-image: url(images/bullet.gif); , (no-repeat). (blockquote). - , . . : : blockquote{ background: url(images/bquote.gif) no-repeat 95% 0; color: #8AA1AB; font-style: italic; padding: 10px 50px 10px 15px; }

34

(95% 0). . , , , 500500 , Georgia 400 , , . , . , . (.post-date) . . home.php:

( l_sidebar.php r_sidebar.php) , . : , ( ), (). . , , . (), , .. . , . . , , , . . . , , . . . -, . , . -, , , . , . , l_sidebar.php. , #l_sidebar. .

recent entries " ". " ". . 10 . . : latest comments latest comments . . : tag cloud . smallest () largest (). 8 18. . - , , , . (), "tags". . : HTML, , , . . l_sidebar.php , r_sidebar.php. #r_sidebar. , (), , () . - . . :

, "" ( ). , , , . , , , . , "" . , , . RSS-:

blogroll . , home.php index.php. , , . . pr , , . ? , , : , home.php if ( is_home(). , , , , is : , , . . : , . , . , . ! , . , . CSS : #l_sidebar { color: #8AA1AB; float: left; width: 207px; font-size: 95%; padding: 0 0 20px;

39

} #l_sidebar h3, #r_sidebar h3 { background: url(images/bull.gif) no-repeat 0 80%; color: #819CA8; font-size: 1.5em; letter-spacing: -1pt; margin: 0 0 10px 15px; padding: 10px 0 0 15px; } #l_sidebar ul, #r_sidebar ul { list-style: none; padding: 0 5px 10px 15px; } #l_sidebar ul li, #r_sidebar ul li { padding: 5px 0 0; } #l_sidebar ul li a, #r_sidebar ul li a { color: #BCB8D7; } #l_sidebar ul li a:hover, #r_sidebar ul li a:hover { color: #4B5A69; } #r_sidebar { color: #8AA1AB; float: right; width: 160px; font-size: 95%; padding: 0 0 20px; } .ads { margin: 10px 0 0 3px; } .tags { line-height: 16px; font-weight: bold; padding: 0 5px; } .tags a { color: #8DB38D; } .tags a:hover { color: #4B5A69; } .counters { margin: 10px 5px 10px 15px; }

40

. , , . : #l_sidebar h3, #r_sidebar h3 . : #l_sidebar ul, #r_sidebar ul : #l_sidebar ul li, #r_sidebar ul li : #l_sidebar ul li a, #r_sidebar ul li a #l_sidebar ul li a:hover, #r_sidebar ul li a:hover , : #l_sidebar { color: #8AA1AB; float: left; width: 207px; font-size: 95%; padding: 0 0 20px; } #r_sidebar { color: #8AA1AB; float: right; width: 160px; font-size: 95%; padding: 0 0 20px; } . 207 ( 210 ), 160, , . ( ) . . - : #l_sidebar h3, #r_sidebar h3 { background: url(images/bull.gif) no-repeat 0 80%; color: #819CA8; font-size: 1.5em; letter-spacing: -1pt; margin: 0 0 10px 15px; padding: 10px 0 0 15px; }

41

. , . , , , . . ul (list-style: none;). - , ? , , ( , ) , , , "". . : , , , , . , : , , , . , , . , 210 207 . , . , . 160 . RSS- , , . , , - 3 . "" , . CSS: : #searchform { overflow: hidden; } #s { background: url(images/search.gif) no-repeat; width: 131px; height: 21px font-size: 1em; padding: 2px 5px; margin: 10px 0 0 15px; } overflow: hidden; , , , , . , "" .

42

#s , input. . . .ads 100100, . .ads { margin: 10px 0 0 3px; } . : .tags { line-height: 16px; font-weight: bold; padding: 0 5px; } .tags a { color: #8DB38D; } .tags a:hover { color: #4B5A69; } : .counters { margin: 10px 5px 10px 15px; } . l_sidebar.php:

tag cloud r_sidebar.php:

( footer.php) . , . - . . . , footer.php , . : , , . ( 960 ), . , , , , , . , . . #footer. , : / ), . . . . , #container, . . : #footer { background: #15191c url(images/bg-footer.gif) no-repeat; width: 960px; height: 44px; color: #43728B; font-size: .9em; margin: 0 auto; } #footer p { padding: 15px 0 0 140px; } #footer a, #footer a:visited { color: #4AA0CF;

45

text-decoration: none; } #footer a:hover { color: #43728B; text-decoration: underline; } bg-footer.gif 96044 , . (), padding: 15px 0 0 140px; : (padding) (margin), . , . ! 22. ? , , , () - . - (http://webmolot.com/prizhimaem-futer-k-nizu/), ! : , , - , , , . , . , "" . , , , . , , . , . . footer.php , #footer. , - .empty. :

html, body { width: 100%; height: 100%; } * html #container { height: 100%; } .empty { height: 44px; } , . "", , . -, 44 . , . , #container : #container { position: relative; background: #27363E url(images/bg-container.gif) repeat-y; width: 960px; margin: 0 auto; min-height: 100%; } (position: relative;) 100% (min-height: 100%;). : #footer { position: relative; background: #15191c url(images/bg-footer.gif) no-repeat; width: 960px; height: 44px; color: #43728B; font-size: .9em; margin: -44px auto 0; } , margin: -44px auto 0; ( 44, , 0). ! .

47

( comments.php) comments.php php- . , . , , , . , . , , . , , . , . . (index.php) : . , : : (http://www.smileycat.com/design_elements/blog_comments/) : (http://www.smileycat.com/design_elements/blog_comment_forms/). . .

48

-. comments.php , . , . , , - . id="commentblock". : , , . , , . php- , " ". , .

49

, . - home.php. . , , . , . , , , . . . , (). ? , - . , . , .. , -, , , -, : , , . , . . , . , . , . . . : , , . , , "math-comment-spam-protection": /****** Math Comment Spam Protection Plugin ******/ if ( function_exists('math_comment_spam_protection') ) { $mcsp_info = math_comment_spam_protection(); ?> . :

, Math Comment Spam Update Options. . , , . : - . , html-, . : XHTML: : , -, , comments.php. CSS, . #commentblock { width: 520px; background: #15191c url(images/bg-comment.jpg) no-repeat; color: #74848D; float: left; padding: 20px 20px 10px 20px; margin: 10px 0 0; border-top: 5px solid #000; border-bottom: 2px solid #7B848A; } #commentblock ol{ list-style-position: inside; margin: 0; padding: 0 0 10px; } .comments { font-size: 1.5em; font-weight: bold; } .approve { font-style: italic; } .commenttext { background: #000; width: 500px; margin: 3px 0 10px 0; padding: 20px 10px 5px 10px; clear: both; }

51

#commentform input, #commentform textarea { background: #27363E; border: 1px solid #7B848A; color: #819CA8; font-size: 1.2em; padding: 1px 5px; } #commentform textarea { scrollbar-base-color: #15191c; } . 520 (, ). . 520 , :

, 5 . 2 . (#commentblock ol) "" (inside): list-style-position: inside; , . , .comments . .approve , . : .commenttext { background: #000; width: 500px; margin: 3px 0 10px 0; padding: 20px 10px 5px 10px; clear: both; }

52

- , . . . (clear: both;) , , , , . . , , . : , () . / , input, "" , , "". , , "" ( "") #commentform input. . "" , - : - . textarea. "" : #commentform input, #commentform textarea { .. } , - textarea . - - . . : #commentform textarea { scrollbar-base-color: #15191c; } . , , comments.php. , . , . , .

53

comments.php: . .

.

/****** Math Comment Spam Protection Plugin ******/ if ( function_exists('math_comment_spam_protection') ) { $mcsp_info = math_comment_spam_protection(); ?> . :

( index.php, 404.php, page.php, search.php) 4 , 4 : , ( 404), . : , . -. index.php. , home.php. . "" Comments. home.php . - , , . , . 404.php. . , home.php, . , , . ? . , , - . : ? ! () , . 10, 50. ? . . , , - - . , , , . , . page.php. , , . , : : , , , .. , "" , , . home.php index.php : , , . , . , , ? . , . , .

57

search.php. . home.php index.php, . , , :

404.php: , Error 404 , , , . : page.php:

search.php:

FAQ 1. ? (!) , . , . PSPad, : http://www.pspad.com/ru/. , UTF-8, . 2. () , . ? , -, . , - , PHP. , . , , . ( php) , . 1. 3. , . ? ! 4. , ? . . , GIMP (http://www.gimp.org/). 2.6, 15,5 . 5. - () . - , Slice Tool . " , !" ( ). . , , , , . . , , . 153 , 200, . Crop Tool. , . .

61

6. CSS () , (Internet Explorer) - . ? . , (background). , , "" . , , : background: #fff url(images/header.jpg)no-repeat; background: #fff url(images/header.jpg) no-repeat; ? ! no-repeat . , , . , : ! 7. () ( ), , , img. ? , images. . , , - . ! , : .jpg , " " . , , . () . "" , : cartinka_shapki_s_sinim_fonom_i_defkoy-posre-dine.jpg 8. "Parse error!" (, ..). ? : ) - , . , , : (!) , . ) , php . "" . , . .

62

9. . ? , . . , - . ( readme ) . 10. , . , ? ( ):

. , , , - . , ( ) , () "- ". 13. . , 1-2 . ? Internet Explorer CSS. - - 1 . "" , : " IE, , CSS". , ( header.php ), CSS, : , , CSS, ie.css. . : . , . "" . 14. - , : " , ". ? , 777. , , , . , , , . 15. () , ( ), . . , , " " - , , , ( DirectAdmin, , CPanel, ) Set Permission Change Permissions . , ,

64

. , wp-themes, public_html . 16. ? , , . , CSS. : http://validator.w3.org/ , : http://jigsaw.w3.org/css-validator/ , , . , home.php index.php, "" . , , , , , - html, . , . , . . , , CSS, , . 17. , ? , , . , -. , ? http://browsershots.org/. , , . 18. . ? . : 1. http://habrahabr.ru/blogs/wordpress/41296/ ( .). : ( ) ( ) 2. http://solutoire.com/tagstention/ , Dreamweaver Macromedia, .

65

3. http://fleek.org/instrumenty-dlya-sozdaniya-temy-wordpress/ . : 1) Dreamveawer 8. . 2) ( ). 3) . , , .

66

Untitled