> Tous les forums > Forum Forum des Webmasters
 création site internet
Ajouter un message à la discussion
Page : [1] 
Page 1 sur 1
lafouine01000
  Posté le 19/01/2015 @ 13:44 
Aller en bas de la page 

Bonjour

J'ai créé il y a quelques temps un site avec nvu que je souhaiterai moderniser. J'ai essayé wordpress mais je ne suis pas convaincue.

J'ai également essayé iapoo que je trouve très bien mais un peu cherche, je cherche dans l'idéal un éditeur gratuit, j'ai testé jimbo et e-mon site mais le problème est le nom je voudrais que mon adresse apparaisse ainsi www.mondomaine.fr

Mes connaissances en programmation sont limitées donc si quelqu'un peut me renseigner merci d'avance

Publicité
Dreamer
 Posté le 19/01/2015 à 18:34 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Maître astucien

Salut

Question : tu veux faire un site, d'accord, mais que vas-tu y mettre et en fonction, on pourra te conseiller un CMS ou autre !!

lafouine01000
 Posté le 19/01/2015 à 18:39 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page

Bonjour,

Mon site est déjà existant mais je trouve l'interface un peu vieillote, c'est un site entreprise de maçonnerie donc je vais y insérer des photos, vidéos, un plan de situation et un moyen de nous contacter par mail

Merci

Dreamer
 Posté le 19/01/2015 à 18:47 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Maître astucien

lafouine01000 a écrit :

Bonjour,

Mon site est déjà existant mais je trouve l'interface un peu vieillote, c'est un site entreprise de maçonnerie donc je vais y insérer des photos, vidéos, un plan de situation et un moyen de nous contacter par mail

Merci

La solution la plus simple c'est Wordpress et au lieu de créer des articles, tu crées des pages ....

lafouine01000
 Posté le 19/01/2015 à 18:48 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page

Merci cela confirme ce que je pensais mais j'ai quelques problèmes de mise en page

Dreamer
 Posté le 19/01/2015 à 18:54 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Maître astucien

Peux-tu nous donner le lien du site SVP ??

lafouine01000
 Posté le 19/01/2015 à 18:59 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page

www.zaccagnino.fr je voudrais sensiblement garder la même structure mais là je galère un peu pour faire mes colonnes

lafouine01000
 Posté le 19/01/2015 à 19:02 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page

Sur la page d'accueil je voudrais 2 colonnes et 4 lignes :

Titres : Qui sommes nous / Qualibat

Contenu : ---- / -----

Titres : Notre savoir-faire / Nos assurances et références

Contenu : ---- / -----

Merci

Dreamer
 Posté le 19/01/2015 à 19:07 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Maître astucien

Pas mal du tout!!

Effectivement, tu utilises beaucoup (trop) les tableaux et des balises obsolètes !!

Le texte gagnerait à être plus aéré, sinon, c'est plaisant !!

Publicité
lafouine01000
 Posté le 20/01/2015 à 14:01 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page

Bonjour

Du coup je suis entrain d'essayer wordpress et j'ai un pb avec ma largueur de page que souhaiterai élargir.

Je suis donc allée dans ma feuille de style mais impossible de trouver la ligne width à modifier, j'ai un menu comme ça :

1.0 - Reset
2.0 - Typography
3.0 - Elements
4.0 - Forms
5.0 - Navigation
5.1 - Links
5.2 - Menus
6.0 - Accessibility
7.0 - Alignments
8.0 - Clearings
9.0 - Widgets
10.0 - Content
10.1 - Posts and pages
10.2 - Index and Archives
10.3 - Asides
10.4 - Image Attachments
10.5 - Comments
10.6 - Author Box
11.0 - Infinite scroll
12.0 - Media
13.0 - Footer

Si quelqu'un peut m'aider merci !

lafouine01000
 Posté le 20/01/2015 à 14:27 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page

Voila à quoi ressemble ma page, une marge à gauche et aucune marge à droite, je ne sais pas comment modifier ces paramètres

Dreamer
 Posté le 20/01/2015 à 17:39 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Maître astucien

lafouine01000 a écrit :

Bonjour

Du coup je suis entrain d'essayer wordpress et j'ai un pb avec ma largueur de page que souhaiterai élargir.

Je suis donc allée dans ma feuille de style mais impossible de trouver la ligne width à modifier, j'ai un menu comme ça :

1.0 - Reset
2.0 - Typography
3.0 - Elements
4.0 - Forms
5.0 - Navigation
5.1 - Links
5.2 - Menus
6.0 - Accessibility
7.0 - Alignments
8.0 - Clearings
9.0 - Widgets
10.0 - Content
10.1 - Posts and pages
10.2 - Index and Archives
10.3 - Asides
10.4 - Image Attachments
10.5 - Comments
10.6 - Author Box
11.0 - Infinite scroll
12.0 - Media
13.0 - Footer

Si quelqu'un peut m'aider merci !

Pour les modifs, c'est en général le ou les fichiers css ...

Dans ton admin : Apparence --> Éditeur : colonne de droite : Styles Feuille de styles, tu cliques et la feuille s'affiche au millieu

lafouine01000
 Posté le 20/01/2015 à 17:45 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page

Justement c'est bien là le pb dans ma feuille de style (ci-dessous) je ne trouve pas la ligne à modifier ...

TABLE OF CONTENTS:
----------------------------------------------------------------
1.0 - Reset
2.0 - Typography
3.0 - Elements
4.0 - Forms
5.0 - Navigation
5.1 - Links
5.2 - Menus
6.0 - Accessibility
7.0 - Alignments
8.0 - Clearings
9.0 - Widgets
10.0 - Content
10.1 - Posts and pages
10.2 - Index and Archives
10.3 - Asides
10.4 - Image Attachments
10.5 - Comments
10.6 - Author Box
11.0 - Infinite scroll
12.0 - Media
13.0 - Footer
--------------------------------------------------------------*/

/*--------------------------------------------------------------
1.0 - Reset
--------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
border: 0;
font-family: inherit;
font-size: 100%;
font-style: inherit;
font-weight: inherit;
margin: 0;
outline: 0;
padding: 0;
vertical-align: baseline;
}
html {
font-size: 62.5%; /* Corrects text resizing oddly in IE6/7 when body font-size is set using em units http://clagnut.com/blog/348/#c790 */
overflow-y: scroll; /* Keeps page centered in all browsers regardless of content height */
-webkit-text-size-adjust: 100%; /* Prevents iOS text size adjust after orientation change, without disabling user zoom */
-ms-text-size-adjust: 100%; /* www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/ */
}
*,
*:before,
*:after { /* apply a natural box layout model to all elements; see http://www.paulirish.com/2012/box-sizing-border-box-ftw/ */
-webkit-box-sizing: border-box; /* Not needed for modern webkit but still used by Blackberry Browser 7.0; see http://caniuse.com/#search=box-sizing */
-moz-box-sizing: border-box; /* Still needed for Firefox 28; see http://caniuse.com/#search=box-sizing */
box-sizing: border-box;
}
body {
background: #fff;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
nav,
section {
display: block;
}
ol, ul {
list-style: none;
}
table { /* tables still need 'cellspacing="0"' in the markup */
border-collapse: separate;
border-spacing: 0;
}
caption, th, td {
font-weight: normal;
text-align: left;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: "";
}
blockquote, q {
quotes: "" "";
}
a:focus {
outline: thin dotted;
}
a:hover,
a:active {
outline: 0;
}
a img {
border: 0;
}

a:focus img {
outline: 3px dotted #2c86ba;
}

/*--------------------------------------------------------------
2.0 Typography
--------------------------------------------------------------*/
body,
button,
input,
select,
textarea {
font-size: 18px;
font-size: 1.8rem;
font-family: 'PT Serif', serif;
line-height: 1.5;
color: #404040;
color: hsl(0, 0%, 25%);
}

h1, h2, h3, h4, h5, h6 {
clear: right;
font-weight: 900;
font-family: 'Lato', sans-serif;
color: #000;
color: hsl(0, 0%, 0%);
-ms-word-break: break-word;
word-break: break-word;
}

p { margin-bottom: 1.5em; }

b, strong { font-weight: bold; }

dfn, cite, em, i { font-style: italic; }

address { margin: 0 0 1.5em; }

pre {
max-width: 100%;
padding: 1.6em;
margin-bottom: 2em!important;
overflow: auto;
font-family: "Courier 10 Pitch", Courier, monospace;
font-size: 15px;
font-size: 1.5rem;
line-height: 1.6;
background: #eee;
}

code, kbd, tt, var { font: 15px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; }

abbr, acronym {
border-bottom: 1px dotted #666;
cursor: help;
}

mark, ins {
text-decoration: none;
background: #fff9c0;
}

sup, sub {
position: relative;
height: 0;
vertical-align: baseline;
font-size: 75%;
line-height: 0;
}

sup { bottom: 1ex; }

sub { top: .5ex; }

small { font-size: 75%; }

big { font-size: 125%; }

/*--------------------------------------------------------------
3.0 Elements
--------------------------------------------------------------*/
hr {
height: 1px;
margin-bottom: 1.5em;
background-color: #ccc;
border: 0;
}

ul, ol { margin: 0 0 1.5em 3em; }

ul { list-style: disc; }

ol { list-style: decimal; }

li > ul,
li > ol {
margin-bottom: 0;
margin-left: 1.5em;
}

dt { font-weight: bold; }

dd { margin: 0 1.5em 1.5em; }

img {
height: auto; /* Make sure images are scaled correctly. */
max-width: 100%; /* Adhere to container width. */
}

figure { margin: 0; }

table {
width: 100%;
margin: 0 0 1.5em;
}

th { font-weight: bold; }

/*--------------------------------------------------------------
4.0 Forms
--------------------------------------------------------------*/
button,
input,
select,
textarea {
vertical-align: baseline; /* Improves appearance and consistency in all browsers */
*vertical-align: middle; /* Improves appearance and consistency in IE6/IE7 */
margin: 0; /* Addresses margins set differently in IE6/7, F3/4, S5, Chrome */
font-size: 100%; /* Corrects font size not being inherited in all browsers */
}

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
padding: 1em 2em;
font-size: 16px;
font-size: 1.6rem;
font-family: 'Lato';
text-transform: uppercase;
line-height: 1;
color: hsl(0, 0%, 100%);
background: #3c3c3c;
background: hsl(0, 0%, 24%);
border: none;
border-radius: 3px;
cursor: pointer; /* Improves usability and consistency of cursor style between image-type 'input' and others */
-webkit-appearance: button; /* Corrects inability to style clickable 'input' types in iOS */
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
background: #000;
background: hsl(0, 0%, 0%);
}

button:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus,
button:active,
input[type="button"]:active,
input[type="reset"]:active,
input[type="submit"]:active {
background: #000;
background: hsl(0, 0%, 0%);
}

input[type="checkbox"],
input[type="radio"] {
padding: 0; /* Addresses excess padding in IE8/9 */
}

input[type="search"] {
-webkit-appearance: textfield; /* Addresses appearance set to searchfield in S5, Chrome */
width: 100%;
}

input[type="search"]::-webkit-search-decoration { /* Corrects inner padding displayed oddly in S5, Chrome on OSX */
-webkit-appearance: none;
}

button::-moz-focus-inner,
input::-moz-focus-inner { /* Corrects inner padding and border displayed oddly in FF3/4 www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/ */
padding: 0;
border: 0;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
textarea {
padding: 8px;
font-family: 'Lato', sans-serif;
color: #333;
border: 1px solid #ccc;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
textarea:focus {
color: #111;
}

textarea {
width: 100%;
vertical-align: top; /* Improves readability and alignment in all browsers */
overflow: auto; /* Removes default vertical scrollbar in IE6/7/8/9 */

}

.comment-awaiting-moderation { /* Green background color to make moderation seem less aggressive */
padding: .5rem 1rem;
margin: 1rem 0;
font-family: 'Lato', sans-serif;
font-size: 16px;
font-size: 1.6rem;
color: #fff;
color: hsl(0, 0%, 100%);
background: #84bd68;
background: hsl(100, 39%, 57%);
}

/*--------------------------------------------------------------
5.0 Navigation
--------------------------------------------------------------*/
/*--------------------------------------------------------------
5.1 Links
--------------------------------------------------------------*/
a {
text-decoration: none;
color: #000;
color: hsl(0, 0%, 0%);
}

a:visited {
color: #333;
color: hsl(0, 0%, 20%);
}

a:hover,
a:focus,
a:active {
text-decoration: underline;
}

/*--------------------------------------------------------------
5.2 Menus
--------------------------------------------------------------*/
.main-navigation {
position: relative;
display: block;
width: 100%;
clear: both;
font-family: 'Lato', sans-serif;
text-transform: uppercase;
background: #313131;
background: hsl(0, 0%, 19%);
}

.main-navigation ul {
margin: 0;
padding-left: 0;
list-style: none;
}

.main-navigation li {
position: relative;
float: left;
}

.main-navigation a {
display: block;
padding: 1.3em 1em;
font-size: 14px;
font-size: 1.4rem;
text-decoration: none;
line-height: 1.3em;
color: white;
color: hsl(0, 0%, 100%);
}

.main-navigation ul ul {
position: absolute;
left: 0;
z-index: 99999;
display: none;
float: left;
padding: 0;
background: #4d4d4d;
background: hsl(0, 0%, 30%);
}

.main-navigation ul ul ul {
top: 0;
left: 100%;
}

.main-navigation ul ul a { width: 200px; }

.main-navigation ul ul li { }

.main-navigation li:hover > a,
.main-navigation li > a:focus {
color: #fff;
color: hsl(0, 0%, 100%);
background: #4d4d4d;
background: hsl(0, 0%, 30%);
}

.main-navigation ul ul :hover > a { }

.main-navigation ul ul a:hover,
.main-navigation ul ul a:focus {
background: #313131;
background: hsl(0, 0%, 19%);
}

.main-navigation ul li:hover > ul { display: block; }

.main-navigation .current_page_item > a,
.main-navigation .current-menu-item > a,
.main-navigation .current_page_item > a:hover,
.main-navigation .current-menu-item > a:hover,
.main-navigation .current_page_item > a:focus,
.main-navigation .current-menu-item > a:focus {
color: #313131;
color: hsl(0, 0%, 19%);
background: white;
}

.main-navigation .current_page_ancestor {
background: #4d4d4d;
background: hsl(0, 0%, 30%);
}

.main-navigation ul ul .current_page_parent,
.main-navigation .current_page_parent .current_page_item > a {
color: #fff;
color: hsl(0, 0%, 100%);
background: #313131;
background: hsl(0, 0%, 19%);
}

/* Small menu */
.menu-toggle {
display: none;
cursor: pointer;
}

@media screen and (max-width: 600px) {
.menu-toggle {
display: inline-block;
height: 3.9em;
padding: 0 1em;
font-weight: normal;
font-size: 14px;
font-size: 1.4rem;
text-decoration: none;
line-height: 3.75em;
color: white;
}

.menu-toggle a:hover,
.menu-toggle a:focus {
background: #4d4d4d;
background: hsl(0, 0%, 30%);
}

.main-navigation.toggled .nav-menu {
display: block;
border-top: 1px solid;
border-top-color: #fff;
border-top-color: hsla(0, 0%, 100%, .5);
}

.main-navigation ul {
display: none;
padding-left: 0;
}

.main-navigation li { float: none; }

.main-navigation li a { padding: 1.3em 2em; }

.main-navigation li li a { padding-left: 4em; }

.main-navigation li li li a { padding-left: 6em; }

.main-navigation li:hover > a,
.main-navigation li > a:focus {
background: #313131;
background: hsl(0, 0%, 19%);
}

.main-navigation ul ul,
.main-navigation ul ul ul {
position: relative;
top: inherit;
left: 0;
display: block;
float: none;
background: #313131;
background: hsl(0, 0%, 19%);
}

.main-navigation ul ul a { width: 100%; }

.main-navigation ul a:hover,
.main-navigation ul ul a:hover,
.main-navigation ul a:focus,
.main-navigation ul ul a:focus{
background: #4d4d4d;
background: hsl(0, 0%, 30%);
}

.main-navigation .current_page_ancestor { background: inherit; }

.main-navigation ul ul .current_page_parent {
color: inherit;
background: inherit;
}

.main-navigation .current_page_item > a,
.main-navigation .current_page_item > a:hover,
.main-navigation .current_page_item li:hover,
.main-navigation .current_page_item > a:focus,
.main-navigation .current_page_item li:focus,
.main-navigation .current_page_parent .current_page_item > a {
color: #fff;
color: hsl(0, 0%, 100%);
background: #4d4d4d;
background: hsl(0, 0%, 30%);
}

} /* End responsive menu */

/* Social Menu */

.menu-social ul {
float: right;
text-align: center;
list-style: none;
}

.menu-social ul li {
position: relative;
display: inline-block;
}

.menu-social li a:before {
display: inline-block;
vertical-align: top;
padding: 0 5px;
font-family: 'Fontawesome';
font-size: 20px;
color: #fff;
-webkit-font-smoothing: antialiased;
content: '\f08e';
}

.menu-social li a[href*="dribbble.com"]::before { content: '\f17d'; }

.menu-social li a[href*="facebook.com"]::before { content: '\f09a'; }

.menu-social li a[href*="flickr.com"]::before { content: '\f16e'; }

.menu-social li a[href*="foursquare.com"]::before { content: '\f180'; }

.menu-social li a[href*="github.com"]::before { content: '\f09b'; }

.menu-social li a[href*="plus.google.com"]::before { content: '\f0d5'; }

.menu-social li a[href*="instagram.com"]::before { content: '\f16d'; }

.menu-social li a[href*="jsfiddle.com"]::before { content: '\f1cc'; }

.menu-social li a[href*="linkedin.com"]::before { content: '\f0e1'; }

.menu-social li a[href*="pinterest.com"]::before { content: '\f0d2'; }

.menu-social li a[href*="reddit.com"]::before { content: '\f1a1'; }

.menu-social li a[href*="soundcloud.com"]::before { content: '\f1be'; }

.menu-social li a[href*="stackoverflow.com"]::before { content: '\f16c'; }

.menu-social li a[href*="tumblr.com"]::before { content: '\f173'; }

.menu-social li a[href*="twitter.com"]::before { content: '\f099'; }

.menu-social li a[href*="vimeo.com"]::before { content: '\f194'; }

.menu-social li a[href*="vine.co"]::before { content: '\f1ca'; }

.menu-social li a[href*="yelp.com"]::before { content: '\f1e9'; }

.menu-social li a[href*="youtube.com"]::before { content: '\f167'; }

.menu-social li a[href*="wordpress.com"]::before { content: '\f19a'; }



@media screen and (max-width: 600px) {
#menu-social ul {
position: absolute;
top: 0;
right: 6rem;
display: block;
}

#menu-social li a {
padding-left:.5em;
padding-right: .5em;
}
}

/* Paging navigation */

.site-main .comment-navigation,
.site-main .paging-navigation,
.site-main .post-navigation {
font-size: 18px;
font-size: 1.8rem;
font-family: 'Lato', sans-serif;
color: #000;
color: hsl(0, 0%, 0%);
}

.post-nav-box {
padding: 2em 0;
margin-bottom: 4em;
border-top: hsl(0, 0%, 80%) solid 1px;
border-bottom: hsl(0, 0%, 80%) solid 1px;
}

.comment-navigation .nav-previous,
.paging-navigation .nav-previous,
.post-navigation .nav-previous {
float: left;
width: 50%;
padding-right: 15%;
}

.comment-navigation .nav-next,
.paging-navigation .nav-next,
.post-navigation .nav-next {
float: right;
width: 50%;
padding-left: 15%;
text-align: right;
}

.nav-indicator { margin-bottom: 1em; }

.nav-previous h1,
.nav-next h1 { font-weight: 900; }

.comment-navigation {
padding: 1em 0;
margin: 3em 0;
border-top: hsl(0, 0%, 80%) solid 1px;
border-bottom: hsl(0, 0%, 80%) solid 1px;
}

.comment-navigation i { margin: 0 1em; }

@media screen and (max-width: 600px) {
.comment-navigation .nav-previous,
.post-navigation .nav-previous,
.comment-navigation .nav-next,
.post-navigation .nav-next {
float: none;
width: 100%;
padding: 0;
text-align: left;
}

.comment-navigation .nav-next,
.post-navigation .nav-next { margin-top: 4rem; }
}

.paging-navigation ul { margin: 0; }

.paging-navigation li { display: inline; }

a.page-numbers,
span.page-numbers {
padding: .3em .7em;
color: #333;
color: hsl(0, 0%, 20%);
}

a:hover.page-numbers,
a:focus.page-numbers{
color: #000;
color: hsl(0, 0%, 0%);
}

.paging-navigation .current {
font-weight: bold;
color: #000;
color: hsl(0, 0%, 0%);
}


/*--------------------------------------------------------------
6.0 Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers */
.screen-reader-text {
position: absolute !important;
height: 1px;
width: 1px;
overflow: hidden;
clip: rect(1px, 1px, 1px, 1px);
}

.screen-reader-text:hover,
.screen-reader-text:active,
.screen-reader-text:focus {
top: 5px;
left: 5px;
z-index: 100000; /* Above WP toolbar */
clip: auto !important;
display: block;
width: auto;
height: auto;
padding: 15px 23px 14px;
font-weight: bold;
font-size: 14px;
text-decoration: none;
line-height: normal;
color: #21759b;
background-color: #f1f1f1;
border-radius: 3px;
box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
}

/*--------------------------------------------------------------
7.0 Alignments
--------------------------------------------------------------*/
.alignleft {
display: inline;
float: left;
margin-right: 1.5em;
margin-bottom: 1em;
}

.alignright {
display: inline;
float: right;
margin-bottom: 1em;
margin-left: 1.5em;
}

.aligncenter {
display: block;
margin: 0 auto 1.6em;
clear: both;
}

/* Alignment responsive */
@media screen and (min-width: 1320px) {
.alignleft { margin-left: -160px; }
}

@media screen and (min-width: 1820px) {
.alignright { margin-right: -160px; }
}

/*--------------------------------------------------------------
8.0 Clearings
--------------------------------------------------------------*/
.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
display: table;
content: '';
}

.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after { clear: both; }

/*--------------------------------------------------------------
9.0 Header
--------------------------------------------------------------*/

.site-branding {
padding: 6rem 0;
text-align: center;
background: #0587BF;
background: hsl(198, 95%, 38%);
}

.title-box {
width: 600px;
max-width: 75%;
padding: 4rem;
margin: 0 auto;
border: solid 1px #fff;
border: solid 1px hsla(0, 0%, 100%, .3);
}

.site-title {
font-weight: 700;
font-size: 40px;
font-size: 4.5rem;
text-transform: uppercase;
line-height: normal;
padding-bottom: 1rem;
}

.site-description {
font-weight: 300;
font-size: 20px;
font-size: 2rem;
}

.site-branding a { text-decoration: none; }

.site-title a,
.site-description {
color: #fff;
color: hsl(0, 0%, 100%);
}

.header-image img {
display: block;
margin: 0 auto;
}

.header-background-image {
background: no-repeat center;
background-size: cover!important;
-moz-background-size: cover!important;
-webkit-background-size: cover!important;
}

.header-background-image .title-box {
background: #333;
background: hsla(0, 0%, 0%, .7);
}

/* Header responsive */
@media screen and (max-width: 900px) {
.site-branding { padding: 0; }

.title-box {
max-width: 100%;
margin: 0 auto;
padding: 4rem;
border: none;
}
}

@media screen and (max-width: 399px) {
.title-box { padding: 2rem; }
}

/* Header search */

.search-toggle {
float: right;
width: 54px;
height: 54px;
padding: 12px;
margin-right: 20px;
color: #fff;
text-align: center;
cursor: pointer;
}

.search-toggle:hover,
.search-toggle.active {
background: #4d4d4d;
background: hsl(0, 0%, 30%);
}

.search-toggle .screen-reader-text {
top: 0;
right: 0;
}
.search-box-wrapper {
z-index: 2;
width: 100%;
}
.search-box {
padding: 1em;
background: #4d4d4d;
background: hsl(0, 0%, 30%);
}

.search-box .search-field {
max-width: 362px;
float: right;
padding: 1rem 2rem 1rem 4rem;
font-size: 20px;
font-size: 2rem;
background-color: #fff;
border: 0;
}

.hide { display: none; }

.error404 .search-submit,
.search .search-submit,
.search-box .search-submit { display: none; }

@media screen and (max-width: 600px) {
.search-toggle {
position: absolute;
top: 0;
right: 0;
margin-right: 0;
}
}

/*--------------------------------------------------------------
9.0 Widgets
--------------------------------------------------------------*/
.widget {
margin: 0 0 4em;
font-family: 'Lato', sans-serif;
font-size: 16px;
font-size: 1.6rem;
}

.widget-title {
margin-bottom: 1em;
font-size: 24px;
font-size: 2.4rem;
border-bottom: 2px solid #000;
}

.widget a {
font-weight: 700;
color: #000;
color: hsl(0, 0%, 0%);
}

.widget ul,
.widget ol {
padding: 0;
margin: -1em 0 0;
list-style-type: none;
}

.widget li { padding: 1em 0 0; }

.widget li ul,
.widget li ol { margin-top: 0; }

.widget li li { margin-left: 1.5em; }

.widget_recent_entries li:before,
.widget_recent_comments li:before,
.widget_archive li:before {
display: block;
float: left;
padding-top: 2px;
margin-left: -2.5em;
font-family: 'fontawesome';
font-size: 14px;
font-size: 1.4rem;
}

.widget_recent_entries li,
.widget_recent_comments li { margin: 0 0 .5em 2.5em; }

.widget_recent_entries li:before { content: "\f036"; }

.widget_recent_comments li:before { content: "\f075"; }

.widget_archive li { margin: 0 0 0 2.5em; }

.widget_archive li:before { content: "\f187"; }

.widget_nav_menu a,
.widget_pages a {
display: block;
padding: 1em 0;
border-bottom: solid 1px hsl(0, 0%, 90%);
}

.widget_nav_menu li,
.widget_pages li { padding-top: 0; }

.widget_rss li { margin-bottom: .5em; }

.widget_rss .rss-date,
.widget_rss cite {
display: block;
font-size: 85%;
}

/* Make sure select elements fit in widgets */
.widget select { max-width: 100%; }

/* Search widget */
.widget_search .search-submit { display: none; }

.footer-widgets { margin: 0 auto; }

.footer-widgets .widget-title,
.footer-widgets .widget a:hover,
.footer-widgets .widget a:focus {
color: #fff;
color: hsl(0, 0%, 100%);
border-color: #fff;
border-color: hsl(0, 0%, 100%);
}

.footer-widgets .widget {
float: left;
width: 320px;
margin: 0 4rem 8rem 4rem;
}

/* Footer widgets responsive */
@media screen and (max-width: 879px) {
#footer-widgets { width: 100%!important; }

.footer-widgets .widget {
float: none;
width: 100%;
margin: 0 0 8rem;
}
}
/*--------------------------------------------------------------
10.0 Content
--------------------------------------------------------------*/
/*--------------------------------------------------------------
10.1 Posts and pages
--------------------------------------------------------------*/
.sticky { }

.hentry { margin: 0 0 1.5em; }

.updated { display: none; }

.single .byline,
.group-blog .byline { display: inline; }

.page-content,
.entry-content,
.entry-summary { margin: 1.5em 0 0; }

.page-links {
margin: 0 0 1.5em;
clear: both;
}

.entry-title {
margin: 0 0 2rem;
font-weight: 900;
font-size: 40px;
font-size: 4rem;
line-height: 1.3em;
color: #000;
color: hsl(0, 0%, 0%);
}

.page .entry-title { margin-top: .7em; }

.entry-content a { text-decoration: underline; }

/* Typography */
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 { margin-bottom: .4em; }

.entry-content h1 {
font-size: 32px;
font-size: 3.2rem;
}

.entry-content h2 {
font-size: 30px;
font-size: 3.0rem;
}

.entry-content h3 {
font-size: 28px;
font-size: 2.8rem;
}

.entry-content h4 {
font-size: 26px;
font-size: 2.6rem;
}

.entry-content h5 {
font-size: 24px;
font-size: 2.4rem;
}

.entry-content h6 {
font-size: 22px;
font-size: 2.2rem;
}

.entry-content p,
.entry-content ul,
.entry-content ol {
font-size: 20px;
font-size: 2rem;
line-height: 1.6em;
}

.entry-content blockquote p {
font-size: 28px;
font-size: 2.8rem;
line-height: 1.5em;
}

blockquote cite {
font-size: 18px;
font-size: 1.8rem;
}

/* Smaller fonts for smaller screens */
@media screen and (max-width: 680px) {
.entry-title {
font-size: 32px;
font-size: 3.2rem;
line-height: 1.3em;
}
.entry-content h1 {
font-size: 28px;
font-size: 2.8rem;
}

.entry-content h2 {
font-size: 26px;
font-size: 2.6rem;
}

.entry-content h3 {
font-size: 24px;
font-size: 2.4rem;
}

.entry-content h4 {
font-size: 22px;
font-size: 2.2rem;
}

.entry-content h5 {
font-size: 20px;
font-size: 2rem;
}

.entry-content h6 {
font-size: 18px;
font-size: 1.8rem;
}

.entry-content p,
.entry-content ul,
.entry-content ol {
font-size: 18px;
font-size: 1.8rem;
}

.entry-content blockquote p {
font-size: 22px;
font-size: 2.2rem;
line-height: 1.5em;
}

blockquote cite {
font-size: 14px;
font-size: 1.4rem;
}
}

/* Blockquotes */
blockquote {
padding: 1em 1.5em 0;
margin-bottom: 1em;
font-style: italic;
border-top: solid 1px hsl(0, 0%, 80%);
border-bottom: solid 1px hsl(0, 0%, 80%);
}

blockquote.alignleft {
float: left;
width: 50%;
padding: 1em 0 0;
margin-right: 2em;
}

blockquote.alignright {
float: right;
width: 50%;
padding: 1em 0 0;
margin-left: 2em;
}

.index-box blockquote.alignleft,
.index-box blockquote.alignright {
background: #fff;
background: hsl(0, 0%, 100%);
border: none;
}

blockquote em {
font-style: normal;
}

blockquote cite {
display: block;
margin-top: 1em;
margin-left: 40%;
font-family: 'Lato', sans-serif;
font-style: normal;
line-height: 1.5em;
text-align: right;
}

/* Blockquotes responsive */
@media screen and (min-width: 1820px) {
.index-box blockquote.alignright { padding-right: 2em; }
}

@media screen and (min-width: 1320px) {
.index-box blockquote.alignleft { padding-left: 2em; }
}

@media screen and (max-width: 780px) {
blockquote.alignleft,
blockquote.alignright { width: 40%; }
}

@media screen and (max-width:600px) {
blockquote.alignleft,
blockquote.alignright {
width: 100%;
padding: 1em 1.5em 0;
}
}

/* Image borders for white-on-white images */

.border-gray {
border: #b9b9b9 solid 1px;
border: hsl(0, 0%, 75%) solid 1px;
}

.border-black {
border: #000 solid 1px;
border: hsl(0, 0%, 0%) solid 1px;
}

.border-custom {
border: #6DBCDB solid 1px;
border: hsl(19, 95%, 38%) solid 1px;
}

/* Meta */
.category-list {
margin: 1.3em 0 1em;
font-family: 'Lato', sans-serif;
font-size: 16px;
font-size: 1.6rem;
}

.category-list a {
color: #333;
color: hsl(0, 0%, 20%);
}

.category-list a:hover,
.category-list a:focus {
color: #000;
color: hsl(0, 0%, 0%);
}

.entry-meta {
margin-bottom: 2rem;
padding: 0;
font-family: 'Lato', sans-serif;
font-size: 14px;
font-size: 1.4rem;
}

.entry-meta a { font-weight: 600; }

/* Hides 'on' and '.' in post meta on wide screens. */
.mobile-hide {
display: inline;
}

/* Meta responsive */
@media screen and (min-width: 1320px) {
.single .entry-meta {
position: absolute;
width: 120px;
margin-left: -160px;
text-align: right;
}

.single .byline,
.single .posted-on,
.single .comments-link {
display: block;
margin-bottom: 1em;
}

.single .author { display: block; }

.single .mobile-hide {
display: none;
}
}

.entry-footer {
margin-top: 3rem;
margin-bottom: 5rem;
font-family: 'Lato', sans-serif;
}

.entry-footer ul {
padding: 0;
margin: 0;
font-size: 16px;
font-size: 1.6rem;
line-height: 2em;
list-style-type: none;
}

.entry-footer li {
display: inline-block;
margin-right: 4rem;
}

.entry-footer i { margin-right: .5rem; }

/*--------------------------------------------------------------
10.2 Index and Archive
--------------------------------------------------------------*/
.taxonomy-description {
padding-top: 2rem;
margin: 2rem 0;
font-family: 'Lato', sans-serif;
font-style: italic;
border-top: 1px solid hsl(0, 0%, 75%);
border-bottom: 1px solid hsl(0, 0%, 75%);
}

.sticky-post {
position: absolute;
top: 1rem;
right: 3rem;
}

.continue-reading {
margin: 0 4rem;
font-weight: 900;
font-size: 18px;
font-size: 1.8rem;
}

.continue-reading i { margin-left: .5em; }

.search-no-results .content-area,
.error404 .content-area { margin-top: 4rem; }

/*--------------------------------------------------------------
10.3 Asides
--------------------------------------------------------------*/
.format-aside .entry-content { margin-top: 1em; }

/*--------------------------------------------------------------
10.4 Image Attachments
--------------------------------------------------------------*/

.attachment .entry-title { margin-top: .7em; }

.entry-attachment { margin-bottom: 3rem; }

.attachment-caption {
font-size: 14px;
font-size: 1.4rem;
font-family: 'Lato', sans-serif;
}



/*--------------------------------------------------------------
10.5 Comments
--------------------------------------------------------------*/
.comments-title {
font-weight: 900;
font-size: 36px;
font-size: 3.6rem;
}

.comments-area > ol {
padding: 0;
margin: 2em 0;
list-style-type: none;
}

ol.children { list-style-type: none; }

.comment-author .avatar {
display: block;
float: left;
width: 50px;
margin-right: 20px;
}

.comment-author .fn {
font-weight: 900;
font-family: 'Lato', sans-serif;
font-size: 20px;
font-size: 2rem;
}

.comment-metadata {
font-size: 14px;
font-size:1.4rem;
}

.comment-meta { margin-bottom: 1em; }

.comment-content { font-size: 90%; }

.comment-content,
.reply { margin-left: 70px; }

.comment-body {
padding-bottom: 2em;
margin-bottom: 2em;
border-bottom: solid hsl(0, 0%, 80%) 1px;
}

.comment-list ol { margin-left: 50px; }

.comment-content a { word-wrap: break-word; }

.reply {
font-weight: 600;
font-size: 14px;
font-size: 1.4rem;
font-family: 'Lato', sans-serif;
}

.comment-content ol { margin-left: 1.5em; }

.bypostauthor > .comment-body {
position: relative;
padding: 1em;
margin-bottom: 2em;
background: hsl(0, 0%, 93%);
border: none;
}

/* Comments responsive */
@media screen and (max-width:600px) {
.comment-list ol { margin-left: 0; }

.comment-content ol { margin-left: 1.5em; }

.comment-content,
.reply { margin-left: 0; }
}

.comment-reply-title {
margin-bottom: .5em;
font-weight: 900;
font-size: 30px;
font-size: 3rem;
}

.comment-form {
padding-bottom: 4rem;
font-family: 'Lato', sans-serif;
font-size: 16px;
font-size: 1.6rem;
}

.comment-form textarea {
font-family: 'PT Serif', serif;
font-size: 18px;
font-size: 1.8rem;
}

.comment-form label { display: block; }

.required { color: red; }

/*--------------------------------------------------------------
10.6 Author Box
--------------------------------------------------------------*/
.reveal-bio {
max-width: 780px;
max-width: 78rem;
margin: 0 auto;
background: #fff;
}

.reveal-bio a {
display: block;
padding: 2rem 0;
margin: 0 auto;
font-weight: 700;
font-size: 26px;
font-size: 2.6rem;
color: #bfbfbf;
color: hsl(0, 0%, 75%);
text-align: center;
}

.reveal-bio a:hover,
.reveal-bio a:focus {
text-decoration: none;
color: #000;
color: hsl(0, 0%, 0%);
}

.shorter { padding: 0 0 4rem!important; }

.hide-fix {
padding: 0!important;
margin-bottom: 2rem!important;
}


.author-info {
padding-top: 1rem;
margin: 0 4rem;
}

.author-avatar {
float: left;
margin: 0 2rem 0 0;
}

.author-avatar img { display: block; }

.author-title {
margin-bottom: .8rem;
font-size: 36px;
font-size: 3.6rem;
line-height: 1;
}

.author-meta {
border-bottom: 16px solid hsl(0, 0%, 95%);
margin-bottom: 2rem;
font-family: 'Lato', sans-serif;
}

.share-and-more {
padding: .1rem 0 1.1rem;
font-weight: 700;
font-size: 16px;
font-size: 1.6rem;
}

.author-social-media { display: inline-block; }

.author-social-media a {
margin-left: 1.5rem;
color: #000;
color: hsl(0, 0%, 0%);
}

.author-social-media a:hover,
.author-social-media a:focus { text-decoration: none; }

a.author-link {
font-weight: 900;
font-family: 'Lato', sans-serif;
color: #000;
color: hsl(0, 0%, 0%);
}

.author-link i { margin-left: 1rem; }

.author-meta,
.author-description { margin-left: 12rem; }

/* Author Box responsive */
@media screen and (max-width: 600px) {
.author-meta,
.author-description { margin-left: 0; }
}

/*--------------------------------------------------------------
11.0 Infinite scroll
--------------------------------------------------------------*/
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .paging-navigation, /* Older / Newer Posts Navigation (always hidden) */
.infinite-scroll.neverending .site-footer { /* Theme Footer (when set to scrolling) */
display: none;
}
/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before */
.infinity-end.neverending .site-footer {
display: block;
}

/*--------------------------------------------------------------
12.0 Media
--------------------------------------------------------------*/
.page-content img.wp-smiley,
.entry-content img.wp-smiley,
.comment-content img.wp-smiley {
margin-bottom: 0;
margin-top: 0;
padding: 0;
border: none;
}

.wp-caption {
max-width: 100%;
margin-bottom: 1.5em;
}

.wp-caption img[class*="wp-image-"] {
display: block;
margin: 0 auto;
}

.wp-caption-text { text-align: center; }

.wp-caption .wp-caption-text,
.gallery-caption {
padding: 0.8075em 1em;
font-size: 14px;
font-size: 1.4rem;
font-family: 'Lato', sans-serif;
background: #e5e5e5;
background: hsl(0, 0%, 90%);
}

.site-main .gallery { margin-bottom: 1.5em; }

.gallery-caption {
position: absolute;
bottom: 0;
left: 0;
max-height: 50%;
width: 100%;
padding: 6px 8px;
margin: 0;
font-size: 12px;
line-height: 1.5;
color: #fff;
text-align: left;
background-color: hsla(0, 0%, 0%, .8);
opacity: 0;
}

.gallery-item:hover .gallery-caption,
.gallery-item:focus .gallery-caption{ opacity: 1; }

.site-main .gallery a img {
display: block;
max-width: 100%;
height: auto;
margin: 0 auto;
border: none;
}

.site-main .gallery-item {
position: relative;
float: left;
max-width:100%;
margin-right: 3.333333333%;
margin-bottom: 3rem;
overflow: hidden;
background: #333;
}

.site-main .gallery dd,
.site-main .gallery figcaption { margin: 0; }

.site-main .gallery-columns-4 .gallery-item { }

.site-main .gallery-columns-4 .gallery-item img { }

/* Make sure embeds and iframes fit their containers */
embed,
iframe,
object { max-width: 100%; }

/* Featured Images */

.single-post-thumbnail { background: #b2b2b2 url(images/pattern.svg) repeat; }

.front-index-thumbnail { margin-bottom: -3.2em; }

@media screen and (max-width: 779px){
.front-index-thumbnail { margin-bottom: 0; }
}

.single-post-thumbnail img,
.front-index-thumbnail img {
display: block;
margin: 0 auto;
}

.has-thumbnail {
position: relative;
margin-top: -8em;
}

.small-index-thumbnail { margin-top: -1em; }

/*--------------------------------------------------------------
13 Footer
--------------------------------------------------------------*/

.site-footer {
padding: 2em;
font-size: 16px;
font-size: 1.6rem;
font-family: 'Lato';
color: #fff;
color: hsl(0, 0%, 100%);
background: #313131;
background: hsl(0, 0%, 19%);
}

.site-footer a {
color: #fff;
color: hsl(0, 0%, 100%);
}

.site-info { text-align: center; }
p {

text-align:justify;

}

Dreamer
 Posté le 20/01/2015 à 19:04 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Maître astucien

Re

A première vue, c'est un thème fluide, c'est à dire qu'il prend toute la largeur de l'écran quel qu'il soit.

Exemple ton menu (.main-navigation) a une largeur de 100%...

Question : pourquoi ne gardes-tu pas l'ancienne présentation ??

lafouine01000
 Posté le 21/01/2015 à 08:49 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page

Bonjour,

Penses-tu que je puisse garder l'ancienne présentation de mon site ? Je vois que wordpress fonctionne en php et avec des feuilles css, moi j'ai juste appris à faire des pages html et lorsque je vais dans l'éditeur de wordpress, dans ma feuille de style je ne retrouve pas tous mes repères, j'ai vraiment appris le minimum en programmation...

J'ai bien remarqué que toutes mes valeurs étaient à 100 % mais bon j'ai quand même un pb d'affichage comme on le voit sur ma capture d'écran.

En tout cas si tu peux m'aider à incorporer mon modèle (header, menu...) que j'ai créé avec photoshop pour l'intégrer dans wordpress ce serait top ! merci

Dreamer
 Posté le 21/01/2015 à 19:23 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Maître astucien

Bon, comme j'ai un peu de temps, je vais te refaire la page accueil et je t'enverrai le code source afin que tu l'étudies.

Rien de bien compliqué, simple à modifier et pratique pour l'apprentissage ...

lafouine01000
 Posté le 22/01/2015 à 08:37 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page

Super, merci d'avance !

Page : [1] 
Page 1 sur 1

Vous devez être connecté pour poster des messages. Cliquez ici pour vous identifier.

Vous n'avez pas de compte ? Créez-en un gratuitement !


Sujets relatifs
Création site internet | Quel logiciel choisir ?
création d'un site internet
Création site internet
Création site Internet
création d'un site internet
Création de site internet
Création site internet
Création site internet
creation site internet
creation site internet
Plus de sujets relatifs à création site internet
 > Tous les forums > Forum Forum des Webmasters