Annonce

Mettez-vous à jour ! WordPress 3.0 est disponible en français.
Annonce 1 : Le Codex en français a besoin de vous pour avancer !
Annonce 2 : Avant de poster, n'oubliez pas de faire une petite Recherche et de lire les règles de ce forum.
Annonce 3 : Lisez notre blog, il regorge de bonnes informations.
Annonce 4 : Rejoignez-nous sur Facebook et sur Twitter
  • Index
  •  » Thèmes
  •  » Remanier le theme Ani-world fond et titre

#1 06-03-2010 16:52:11

N.@.M.E
Habitué WP
Date d'inscription: 20-03-2009
Messages: 68
Site web

Remanier le theme Ani-world fond et titre

Bonjour,

Ma configuration WP actuelle
- Version de WordPress : 2.9.2
- Version de PHP/MySQL : 5
- Thème utilisé : Ani-World
- Extensions en place :  nextgen gallery, nextgen falshviewer, lightview,gravatars, WP-Cumulus
- Nom de l'hebergeur : 1&1
- Adresse du site :

Problème(s) rencontré(s) : remanier le thème Ani World

Je souhaiterai remanier plusieurs choses sur le thème:

1. Le titre: est-il possible de changer la couleur et la taille voir d'y mettre carrément une image à la place avec une belle police d'écriture, cela permettra à tous d'en profiter,car si la police n'est pas installé sur le PC la personne verra avec la police par défaut non?

2. Changer le fond: le passer en noir pour la partie haute et sur les cotés, juste laisser en blanc la partie corps de texte des articles

3. est-il possible d'ajouter une ou plusieurs photos sur la bannière flash, et ralentir le temps de défilement?

Ci joint le fichier style.css
est -il possible de mettre à coté les différents emplacement par rapport à la page entre les sidebar head over etc. je m'embrouille un peu ange

Je sais cela fait beaucoup pour un post icon_redface
en tout cas par avance merci pour vos retours même si cela ne concerne qu'une partie, elle permettra dejà d'avancer un peu .

la feuille style css de base:

Code:

  1. / *
  2. Nom du thème: Ani mondial
  3. Theme URI: http://www.ani-world.net/ani-world-theme/
  4. Description: Ani mondial blog WordPress Theme designed by <a href="http://www.ani-world.net/"> ani monde </ a>! Traduction française par <a href="http://wordpress-tuto.fr"> WordPress tuto </ a>.
  5. Version: 1.0.1
  6. Auteur: Ani & Bush
  7. Author URI: http://www.ani-world.net/
  8. Tags: Blanc, Vert, les deux colonnes, à droite le panneau latéral, à largeur fixe
  9. * /
  10.  
  11.  
  12. / * BASE * /
  13.  
  14.  
  15. corps, th, td, input, select, textarea, button (font: normal 12px/1.8em Tahoma, Verdana, Arial, sans-serif;)
  16. corps, H1, H2, H3, H4, H5, H6, p, ul, formulaire, fieldset (margin: 0; padding: 0;)
  17. ul li (list-style: none;)
  18.  
  19. a (
  20. text-decoration: none;
  21. color: # 000;
  22. )
  23. a: hover (color: # FF9900)
  24. . clear (clear: both)
  25. / * Structure * /
  26. # (tête background: url (images / headbg.gif) repeat-x; height: 85px; width: 100%;)
  27. ul # head (float: right; margin-right: 20px; margin-top: 10px;)
  28. # head (li
  29. text-align: center;
  30. float: left;
  31. display: inline;
  32. width: auto;
  33. margin-left: 5px;
  34. line-height: 40px;
  35. )
  36. # head li a (color: # FFFFFF; padding: 5px; overflow: hidden; background: # 8EC304;)
  37. # head li a: hover (background: # F00; color: # FFF;)
  38. # # head logo (float: left; margin-left: 20px; margin-top: 15px;)
  39. # # head logo h1 (padding: 0;)
  40. # # head logo h1 a (color: # 000000; font-size: 20px; line-height: 20px; font-weight: normal;)
  41.  
  42. # container (
  43. width: 900px;
  44. margin: 10px auto;
  45. )
  46. # recommander, commend_h #, # commend_f (background: # 343434;)
  47. commend_h #, # commend_f (height: 9px; overflow: hidden)
  48. . recommend_l_h (float: left; background: url (images / lh.gif) no-repeat; width: 9px; height: 9px;)
  49. . recommend_r_h (float: right; background: url (images / rh.gif) no-repeat; width: 9px; height: 9px;)
  50. . recommend_l_f (float: left; background: url (images / lf.gif) no-repeat; width: 9px; height: 9px;)
  51. . recommend_r_f (float: right; background: url (images / rf.gif) no-repeat; width: 9px; height: 9px;)
  52. # recommandons (padding: 5px;)
  53.  
  54. . recommend_title (height: 38px; background: url (images / cd.gif) no-repeat;)
  55. # # recommandons combox ul li (float: left;)
  56. . a_combox (width: 630px; float: left; margin-left: 5px;)
  57.  
  58. # # recommandons tagbox (float: right;)
  59. . montre (height: 203px; margin: 0;)
  60. . photo-show li (display: none;)
  61. author_info # (margin-top: 10px; background: url (images / mbg.gif) bottom left no-repeat; padding: 0 0 15px 0; float: right; width: 100%;)
  62. # span author_info (float: left; color: # AAA;)
  63. # author_info span (margin forte: 0 5px;)
  64. # author_info une hauteur (: 23px; width: 69px; display: block; float: right;)
  65.  
  66. # # author_info rss (background: url (images/author_info/rss1.gif) no-repeat;)
  67. # author_info RSS #: hover (background: url (images/author_info/rss2.gif) no-repeat;)
  68. # email author_info # (background: url (images/author_info/email1.gif) no-repeat;)
  69. # # author_info email: hover (background: url (images/author_info/email2.gif) no-repeat;)
  70. Twitter author_info # # (background: url (images/author_info/twitter1.gif) no-repeat;)
  71. # # author_info twitter: hover (background: url (images/author_info/twitter2.gif) no-repeat;)
  72.  
  73. # searchform_top_text (color: # 999; width: 250px;
  74. border: 1px solid # CCC! important;
  75. padding-left: 5px;
  76. background: url (images/search_btn2.gif) 240px no-repeat;
  77. line-height: 20px;
  78. height: 25px;)
  79.  
  80. . ligne (border-bottom: 1px solid # eee;
  81. height: 3px; margin: 10px 0;
  82. clear: both;)
  83.  
  84. # content (
  85. width: 620px;
  86. float: left;
  87. border-right: 1px solid # eee;
  88. padding: 0 0 10px 0;
  89. overflow: hidden;
  90. )
  91.  
  92.  
  93. / * Post * /
  94. # content. post (margin-right: 20px;)
  95. . Post (
  96.  clear: both;
  97. )
  98. . post em (
  99. font-style: italic;
  100. )
  101. . post h2 a (
  102. margin: 10px 0 5px 0;
  103. color: # 618C04;
  104. line-height: 28px;
  105. font-weight: bold;
  106. )
  107.  
  108.  
  109.  . title (color: # 666; margin-bottom: 10px; background: # f7f7f7; padding-left: 3px;)
  110. . titre a (color: # 618C04;)
  111.  
  112. . postmetadata (color: # 666; font-size: 12px; margin-bottom: 10px; padding-left: 3px;)
  113. . postmetadata a (color: # 7AB203;)
  114.  
  115. . poste. entry (padding-bottom: 12px;
  116. color: # 000000; clear: both;)
  117.  
  118. big (font-size: 120%;
  119. )
  120.  
  121. code (
  122. de la police: 0.9em 'Courier New', Courier, Fixed;
  123. padding: 10000px;
  124. display: block;
  125. border: 1px solid # eee;
  126. background: # fff;
  127. )
  128.  
  129. . poste. entrée a (
  130.   color: # 7AB203;
  131. border-bottom: 1px solid # DBEBB1;
  132. )
  133.  
  134.  
  135.  
  136. . poste. entrée a: hover (
  137. color: # 333;
  138. background: # DBEBB1;
  139. border-bottom: 1px solid # 7AB203;
  140. )
  141.  
  142.  
  143.  
  144. . poste. alignright (
  145. float: right;
  146. margin-left: 10px;
  147. )
  148. . poste. alignleft (
  149. float: left;
  150. margin-right: 10px;
  151. )
  152. . poste. aligncenter (
  153. margin: 0 auto;
  154. display: block;
  155. )
  156. . post abbr (
  157. font-weight: normal;
  158. )
  159.  
  160.  
  161. blockquote (
  162. margin: 1.5em 2em 1em;
  163. padding: .5 em 0;
  164. color: # 999;
  165. font-style: italic;
  166. border-top: 1px solid # f5f5f5;
  167. border-bottom: 1px solid # f5f5f5;
  168. )
  169.  
  170. blockquote cite (
  171. margin: 5px 0 0;
  172. display: block;
  173. )
  174.  
  175. . post pre (
  176. font-family: Courier;
  177. font-size: 12px;
  178. letter-spacing:-1px;
  179. margin: 14px 0 14px 0;
  180. )
  181. . poste. ul message (
  182. margin: 12px 0 0;
  183. )
  184. . poste. message (
  185. display: none;
  186. background: # 0F67A1;
  187. margin-top: 10px;
  188. padding: 20px;
  189. color: # FFF;
  190. )
  191. . seul h2 (line-height: 28px;)
  192. . seul h2 a (font-size: 20px;)
  193. . unique. postmetadata (padding-top: 10px; margin-bottom: 20px; background: none)
  194. . unique (padding-bottom: 0px! important; margin-bottom: 10px;)
  195. . p unique a (color: # F30;)
  196. . seul p a: hover (text-decoration: underline;)
  197.  
  198. . rss_c (border-top: 1px solid # EEE; line-height: 25px; padding: 10px 0; color: # 999)
  199. . rss_c a (color: # 3399FF;)
  200. . rss_c a: hover (color: # FF6600)
  201. . rss_c img (float: left)
  202. . archive_c (text-align: center)
  203.  
  204. / * Sidebar * /
  205. # sidebar (
  206. width: 265px;
  207. float: right;
  208. margin: 0 0 25px 0;
  209. overflow: hidden;
  210. )
  211. # sidebar h2 (
  212. font-size: 12px;
  213. font-weight: bold;
  214. color: # 618C04;
  215. margin: 10px 0 5px 0;
  216. )
  217. # sidebar. bloquer ul (
  218. )
  219. # sidebar. li bloc (
  220. line-height: 35px;
  221. height: 35px;
  222. overflow: hidden;
  223. border-bottom: 1px solid # eee;
  224. )
  225.  
  226. # sidebar. Les enfants (list-style: none; margin: 0; text-indent: 0; padding: 0; margin-left: 15px;)
  227. # sidebar. li enfants (font-size: 12px;)
  228.  
  229. # sidebar a (
  230. border: none;
  231. display: block;
  232. padding: 3px 5px;
  233. background: url (images / meta.gif) no-repeat 5px 10px;
  234. padding-left: 20px;
  235. border-bottom: 1px solid # DBEBB1;
  236. )
  237. # sidebar a: hover (
  238. background: url (images / meta.gif) no-repeat 5px 10px;
  239. border-bottom: 1px solid # DBEBB1;
  240. )
  241.  
  242. # # sidebar filsrss li a, # sidebar. textwidget a, # sidebar (pa
  243. background: none;
  244. margin: 10;
  245. padding: 10;
  246. )
  247.  
  248.  
  249.   # sidebar. widget_tag_cloud a (
  250. display: inline;
  251. background: none;
  252. padding: 5px;
  253. border-bottom: none;
  254.  
  255. )
  256.  
  257.  
  258.  # sidebar. cat-item a, # sidebar. cat-item a: hover
  259. (
  260. background: url (images / cat.gif) no-repeat 5px 10px;
  261. padding-left: 20px;
  262. )
  263.  
  264. # sidebar. archives a, # Archives # sidebar ul li a, # sidebar. archives a: hover,
  265. # # sidebar ul li archives a: hover (
  266. background: url (images / meta.gif) no-repeat 5px 10px;
  267. padding-left: 20px;
  268. )
  269.  
  270. # sidebar. linkcat a, # sidebar. linkcat a: hover,
  271. # sidebar. blogroll a (
  272. background: url (images / fav.gif) no-repeat 5px 10px;
  273. padding-left: 20px;
  274. )
  275.  
  276. # sidebar. linkcat a: hover,
  277. # sidebar. blogroll a: hover (
  278. background: url (images / fav.gif) no-repeat 5px 10px;
  279. )
  280. # sidebar. block li a (
  281. font-size: 12px;
  282. font-weight: normal;
  283. line-height: 35px;
  284. height: 35px;
  285. padding-left: 20px;
  286. display: block;
  287. border-bottom: none;
  288. overflow: hidden;
  289. )
  290. # sidebar. widget_search label (
  291. display: block;
  292. padding: 25px 0 3px 0;
  293. font-size: 14px;
  294. margin: 0 0 5px;
  295. )
  296. # sidebar. widget_recent_comments li (
  297. background: transparent url (images / bullet_black.gif) no-repeat scroll 6px 52%;
  298. padding: 2px 0 2px 15px;
  299. )
  300. # sidebar. widget_recent_comments li a, # sidebar. widget_recent_comments li a: hover (
  301. background: none;
  302. text-decoration: none;
  303. )
  304.  
  305. # sidebar. widget_tag_cloud h2 (
  306. margin: 0 0 8px;
  307. order-bottom: 1px solid # eee;
  308. )
  309. # sidebar. widget_text h2, # sidebar. civile h2 (
  310.  order-bottom: 1px solid # eee;
  311. )
  312. # sidebar. civile h2 (
  313. display: none;
  314. )
  315. # wp-calendar # sidebar (
  316. width: 95%;
  317. text-align: center;
  318. )
  319. # # sidebar wp-caption calendrier, WP # # sidebar-td calendrier, WP # # sidebar-th calendrier (
  320. text-align: center;
  321. )
  322. # # sidebar wp-caption (Calendrier
  323. font-size: 14px;
  324. padding: 25px 0 10px 0;
  325. text-align: left;
  326. )
  327. # wp-calendar # sidebar a (background: # EEE; padding: 2px;)
  328. # # sidebar wp-th calendrier (
  329. font-weight: bold;
  330. border-top: 1px solid # eee;
  331. order-bottom: 1px solid # eee;
  332. )
  333. # blogroll ul li (float: left; width: 30%; margin-right: 5px;)
  334. # blogroll ul li a (
  335. background: centre gauche transparent no-repeat; padding-left: 20px;
  336. white-space: nowrap;
  337. )
  338. # blogroll ul li a: hover (
  339. background: centre gauche transparent no-repeat;
  340. color: # 7AB203;
  341. )
  342.  
  343. / * Footer * /
  344. # footerline (background: url (images / footerline.gif) repeat-x; height: 38px; line-height: 58px;)
  345. # footerline p (line-height: 28px; margin-left: 50px;)
  346. # span blogroll (padding: 5px; border: 1px solid # EEE; display: block; background: # F7F7F7;)
  347. foot_cright # (padding: 5px 0 20px 15px; width: 910px; margin: 0 auto;)
  348. # span foot_cright a (color: # 7AB203; font-weight: bold)
  349.  
  350. . s_header (background: url (images / sidebar_line.gif) bottom left no-repeat;)
  351. . s_line (background: url (images / sidebar_line.gif) bottom left no-repeat; height: 10px;)
  352.  
  353. / * nav page * /
  354. . Nav a,. Nav a: link (
  355. padding: 2px 4px 2px 4px;
  356. margin: 2px;
  357. text-decoration: none;
  358. border: 1px solid # E8E8E8;
  359. color: # 343434;
  360. background-color: # FFFFFF;
  361. )
  362. . Nav a: active (
  363. padding: 2px 4px 2px 4px;
  364. margin: 2px;
  365. text-decoration: none;
  366. border: 1px solid # E8E8E8;
  367. color: # 343434;
  368. background-color: # FFFFFF;
  369. )
  370.  
  371. / * message * /
  372. . Acronyme de l'entrée, abbr (
  373. border-bottom: 1px dashed # ccc;
  374. )
  375. code (
  376. de la police: 0.9em 'Courier New', Courier, Fixed;
  377. padding: 10px;
  378. display: block;
  379. )
  380. . entrée ul li (list-style-type: square; margin-left: 30px;)
  381.  
  382. . entrée h1,. entrée h2,. entrée h3,. entrée h4,. entrée h5,. entrée h6 (padding-top: 0.5em; padding-bottom: 0.5em;)
  383.  
  384. . p entry (clear: both;)
  385.  
  386. . entrée img (
  387. max-width: 600px;
  388. width: expression (this.width> 600? 600: true);
  389. )
  390.  
  391. / * Commentaire * /
  392.  
  393. # comments (
  394. font-size: 12px;
  395. line-height: 20px;
  396. margin: 0 10px 20px 0px;
  397. padding: 20px 0 0 0;
  398. border-top: 1px solid # CDD;
  399. )
  400. # comments. parcourir (
  401. clear: both;
  402. width: 588px;
  403. height: 19px;
  404. margin: 0;
  405. padding-bottom: 9px;
  406. )
  407.  
  408. . commentlist (
  409. margin: 10px 0;
  410. )
  411. . commentlist li (
  412. list-style: none;
  413. padding: 10px;
  414. )
  415.  
  416. li.comment (
  417. border: 1px solid # CDD;
  418. -moz-border-radius: 5px;
  419. -webkit-border-radius: 5px;
  420. margin-bottom: 20px;
  421. padding-top: 1em;
  422. font-size: 12px;
  423. )
  424. li.comment div, div li.pingback (
  425. )
  426. . img.avatar vcard (
  427. float: left;
  428. border: 1px solid # eee;
  429. padding: 2px;
  430. margin: 0 20px 1em 0;
  431. background: # fff;
  432. )
  433. . citer vcard (
  434. font-weight: bold;
  435. font-size: 12px;
  436. )
  437. . span vcard (
  438. font-size: 10px;
  439. )
  440. . commentmetadata (
  441. font-size: 10px;
  442. )
  443.  
  444. li.comment p (
  445. clear: both;
  446. )
  447.  
  448. li.comment blockquote (
  449. clear: both;
  450. font-size: 12px;
  451. min-height: 2em;
  452. )
  453. . réponse (
  454. font-size: 12px;
  455. )
  456.  
  457. . li.even commentlist (
  458. background: # f0f0f0;
  459. )
  460.  
  461. . li.odd commentlist (
  462. background: # fff;
  463. )
  464.  
  465. # respond (
  466. font-size: 12px;
  467. margin: 20px 0;
  468. )
  469. # respond p.small (
  470. font-size: 12px;
  471. )
  472. # respond textarea (
  473. width: 96%;
  474. )
  475. # respond comment-div.cancel-reply (
  476. padding: 12px 0 0;
  477. )
  478.  
  479. # commentform (
  480. padding-bottom: 30px;

Dernière modification par Lupi (07-03-2010 11:53:24)


http://img13.imageshack.us/img13/2408/rameur.gif
    Je rame avec Wpress smile

Hors ligne

 

#2 09-03-2010 00:22:20

N.@.M.E
Habitué WP
Date d'inscription: 20-03-2009
Messages: 68
Site web

Re: Remanier le theme Ani-world fond et titre

un petit UP!

J'ai bien réussi à changer la vitesse de defilement des images, à en rajouter,à changer certaine parties (comme le tritre les barres, les polices, mais le fond je ne trouve pas où intégrer la partie background color:000000 pour que l'ensemble de mon fond soit noir angryfire_gif
ci dessous le lien pour visu
lien mon site

pour rappel le thème est:Ani-World


quelqu'un à une ptite idée :?:

Merci pour vos retours

@+

Dernière modification par N.@.M.E (09-03-2010 00:25:08)


http://img13.imageshack.us/img13/2408/rameur.gif
    Je rame avec Wpress smile

Hors ligne

 
  • Index
  •  » Thèmes
  •  » Remanier le theme Ani-world fond et titre

Pied de page des forums

Propulsé par PunBB 1.2.22
© Copyright 2005-2006 WordPress France

[ Generated in 0.042 seconds, 9 queries executed ]