PluXml.org

Blog ou CMS à l'Xml

Vous n'êtes pas identifié(e).

#1 12/02/2017 19:16:16

bg62
Membre
Inscription : 18/05/2007
Messages : 1 779
Site Web

nouveau thème : help !

Bonjour wink
Je me suis lancé dans de petites modifications de thème ' navan ' de Stéphane ( au moins ça me fait apprendre et découvrir certaines choses ), mais là où j'en suis arrivé je rencontre encore une foule d'erreurs ^^
donc = SOS !
la demo est ici :
http://refok.fr/navanbg/index.php
( je supprimerai ce lien après, quand le thème sera OK, pour le mettre à disposition de tous )
Alors, maintenant, je vous laisse regarder, triturer le code, le visuel, les pages ... et trouver les défauts et ... me donner des solution ( il y a du boulot !!! )
grands mercis à l'avance
bg

des exemples:
déjà lorsque l'on clique sur 'rubrique 1 " apparait en haut de la sidebar un trait noir que je ne parviens pas à supprimer ..., comment rendre cliquable ( vers la racine ) l'image en haut de la sidebar ?, etc etc ...


le 'www' est fait pour communiquer et échanger, non ?
fonds d'écran   | référencement efficace | Portfolio | Fonds d'écran automobile | outils SEO | échange de liens en dur

Hors ligne

#2 12/02/2017 21:16:12

kowalsky
Membre
Inscription : 20/08/2015
Messages : 273
Site Web

Re : nouveau thème : help !

Un premier petit retour smile

bg62 a écrit :

déjà lorsque l'on clique sur 'rubrique 1 " apparait en haut de la sidebar un trait noir que je ne parviens pas à supprimer ...

Ça vient de ton...  footer wink

il y a un problème de positionnement de celui-ci puisqu'il se retrouve en haut et bas de ta page. Supprime celui que tu as mis entre les balises </section> et </main> et cela devrait s'améliorer un peu smile

Concernant le choix des couleurs du fond et celui des polices utilisées, je t'invite à utiliser le site http://contrast-finder.tanaguru.com/form.html pour t'assurer du bon contraste et de l'accessibilité de tes choix.
theme.css lignes 28 et 31
a {
    color: #444;
}
a:hover {
    color: #747474;
}

Quand au logo cliquable, il manque juste le lien vers la page d'accueil smile

Et si tu te poses la question de savoir pourquoi la bordure de ta barre de navigation est noire et blanche, c'est parce que tu as encadré dans ton footer.php le code <div class="responsive-menu">...</div> de 2 <hr>, supprime les

Dernière modification par kowalsky (12/02/2017 21:31:52)

Hors ligne

#3 12/02/2017 22:01:47

bg62
Membre
Inscription : 18/05/2007
Messages : 1 779
Site Web

Re : nouveau thème : help !

merci wink
pour le logo, pour l'instant j'ai ceci :

[== Indéfini ==]
<div id="logo1"> 
	<img src="<?php $plxShow->template(); ?>/img/photos.png"  title="<?php $plxShow->lang('PLUXML_DESCRIPTION') ?>"alt="notre site" /> </div>

où et comment placer le lien vers ' index.php' ?
voici ce que j'ai mis finalement:

[== Indéfini ==]
	<div id="logo1"> 
	<a  href="index.php" rel="external"><img src="<?php $plxShow->template(); ?>/img/photos.png"  title="<?php $plxShow->lang('PLUXML_DESCRIPTION') ?>"alt="notre site" /></a>
	</div>

MAIS  j'aimerais maintenant réussir à générer la balise 'alt' pour quelle affiche le ' titre du site '
je vais aller fouiner donc en plus du côté du footer comme tu me le dis smile

Supprime celui que tu as mis entre les balises </section> et </main> et cela devrait s'améliorer un peu smile

??? dans quel fichier ? = OK j'ai trouvé smile
au moins pour cette erreur là !
@+

Dernière modification par bg62 (13/02/2017 00:18:36)


le 'www' est fait pour communiquer et échanger, non ?
fonds d'écran   | référencement efficace | Portfolio | Fonds d'écran automobile | outils SEO | échange de liens en dur

Hors ligne

#4 13/02/2017 00:29:30

kowalsky
Membre
Inscription : 20/08/2015
Messages : 273
Site Web

Re : nouveau thème : help !

Il y a plusieurs fichiers à modifier :
archives.php
article.php
categorie.php
erreur.php
static.php
tags.php

Actuellement tu as un <footer class="footer" role="contentinfo">¶</footer> en trop juste avant </section></main></div>


Pour le lien sur le logo, la version simple étant :

<div id="logo1">
    <a title="Accueil" href="index.php"><img src="<?php $plxShow->template(); ?>/img/photos.png"  title="<?php $plxShow->lang('PLUXML_DESCRIPTION') ?>"alt="notre site" /></a>
</div>

La version moins simple étant de supprimer la div "logo1" et de l'incorporer via CSS dans le <h1> de la partie <header role="banner"> smile

Je te laisse tester les deux et faire les corrections nécessaires dans le CSS quel que soit ton choix.

Dernière modification par kowalsky (13/02/2017 00:31:35)

Hors ligne

#5 13/02/2017 00:36:39

kowalsky
Membre
Inscription : 20/08/2015
Messages : 273
Site Web

Re : nouveau thème : help !

rel="external" n'a rien à faire dans ton lien qui pointe vers la racine de ton site, et non vers un autre site smile

bg62 a écrit :

MAIS  j'aimerais maintenant réussir à générer la balise 'alt' pour quelle affiche le ' titre du site '

alors c'est la version moins simple que je te proposais qu'il te faut smile

Hors ligne

#6 13/02/2017 01:13:43

bg62
Membre
Inscription : 18/05/2007
Messages : 1 779
Site Web

Re : nouveau thème : help !

kowalsky a écrit :

rel="external" n'a rien à faire dans ton lien qui pointe vers la racine de ton site, et non vers un autre site smile

bg62 a écrit :

MAIS  j'aimerais maintenant réussir à générer la balise 'alt' pour quelle affiche le ' titre du site '

alors c'est la version moins simple que je te proposais qu'il te faut smile

1 - ok 'external' était une erreur de copier/coller = bien vu ! smile
2 - pour les fichiers à modifier je pense que ce doit être bon ...
3 - et ensuitel'histoire de la div à paser en css alors = je rame
Si tu as le temps de voir quel codage il faudrait mettre ce serait top !!!
@+


le 'www' est fait pour communiquer et échanger, non ?
fonds d'écran   | référencement efficace | Portfolio | Fonds d'écran automobile | outils SEO | échange de liens en dur

Hors ligne

#7 13/02/2017 09:56:09

kowalsky
Membre
Inscription : 20/08/2015
Messages : 273
Site Web

Re : nouveau thème : help !

Pour cela merci de recopier l'intégralité de ton fichier sidebar.php (par contre la semaine de travail recommençant, tu n'auras pas de retour avant quelques temps)

Hors ligne

#8 13/02/2017 12:38:31

bg62
Membre
Inscription : 18/05/2007
Messages : 1 779
Site Web

Re : nouveau thème : help !

kowalsky a écrit :

Pour cela merci de recopier l'intégralité de ton fichier sidebar.php (par contre la semaine de travail recommençant, tu n'auras pas de retour avant quelques temps)

ok voici le sidebar.php:

[== Indéfini ==]
<?php if(!defined('PLX_ROOT')) exit; ?>
	<aside class="aside col sml-0 med-3" role="complementary">
	<div id="logo1"> 
	<a  href="index.php"><img src="<?php $plxShow->template(); ?>/img/photos.png"  title="<?php $plxShow->lang('PLUXML_DESCRIPTION') ?>"alt="notre site" /></a>
	</div>
		<div id="logo1"> 
		<header role="banner">
			<h1 class="no-margin"><?php $plxShow->mainTitle('link'); ?></h1>
			<h2 class="h5 no-margin"><?php $plxShow->subTitle(); ?></h2>
		</header>
		<h3>
			<?php $plxShow->lang('CATEGORIES'); ?>
		</h3>
		<ul class="cat-list unstyled-list">
			<?php $plxShow->catList('','<li id="#cat_id"><a class="menu3" "#cat_status" href="#cat_url" title="#cat_name">#cat_name</a> (#art_nb)</li>'); ?>
		</ul>
		<h3>
			<?php $plxShow->lang('LATEST_ARTICLES'); ?>
		</h3>
		<ul class="lastart-list unstyled-list">
			<?php $plxShow->lastArtList('<li><a class="menu3" "#art_status" href="#art_url" title="#art_title">#art_title</a></li>'); ?>
		</ul>
		<h3>
			<?php $plxShow->lang('TAGS'); ?>
 </h3>
		<ul class="tag-list">
			<?php $plxShow->tagList('<li class="tag #tag_size"><a class="menu3" "#tag_status" href="#tag_url" title="#tag_name">#tag_name</a></li>', 20); ?>
		</ul>
		<h3>
			<?php $plxShow->lang('LATEST_COMMENTS'); ?>
		</h3>
		<ul class="lastcom-list unstyled-list">
			<?php $plxShow->lastComList('<li><a class="menu3" href="#com_url">#com_author '.$plxShow->getLang('SAID').' : #com_content(34)</a></li>'); ?>
		</ul>
		<h3>
			<?php $plxShow->lang('ARCHIVES'); ?>
		</h3>
		<ul class="arch-list unstyled-list">
			<?php $plxShow->archList('<li id="#archives_id"><a class="menu3"" #archives_status" href="#archives_url" title="#archives_name">#archives_name</a> (#archives_nbart)</li>'); ?>
		</ul>
	</aside>

@+  et encore merciS à l'avance smile


le 'www' est fait pour communiquer et échanger, non ?
fonds d'écran   | référencement efficace | Portfolio | Fonds d'écran automobile | outils SEO | échange de liens en dur

Hors ligne

#9 17/02/2017 22:38:44

kowalsky
Membre
Inscription : 20/08/2015
Messages : 273
Site Web

Re : nouveau thème : help !

le temps passe vite... voici la version moins simple smile

1) modifie le début du code de sidebar.php jusqu'à ton premier <h3> comme suit :

[== PHP ==]
<?php if(!defined('PLX_ROOT')) exit; ?>

	<aside class="aside col sml-0 med-3" role="complementary">
		<header class="header sml-text-center med-text-left" role="banner">
			<h1 class="no-margin logo"><?php $plxShow->mainTitle('link'); ?></h1>
			<h2 class="h5 no-margin"><?php $plxShow->subTitle(); ?></h2>
		</header>

2) ajoute ce code CSS dans theme.css

[== CSS ==]
@media (min-width: 1024px) {
	h1.logo{
		padding-top: 128px;
	}
	.header .maintitle {
		background-image: url('../img/logo.png');
		background-repeat: no-repeat;
		height: 128px;
		width: auto;
		padding-top: 128px;
	}
	.header .maintitle:hover {
		background-image: url('../img/logo180.png');
	}
}

(j'ai ajouté un mediaquery car le logo a un comportement bizarre en mode adaptatif, et comme je n'ai pas trouvé pourquoi, le plus simple est de le faire disparaitre)

3) renomme ton fichier "photos.png" en "logo.png"
4) duplique le et renomme la copie en "logo180.png" (désolé l'usage de la propriété CSS "transform" ne fonctionne pas dans ce cas)
5) avec un logiciel de dessin, applique un retournement vertical à "logo180.png"

et normalement cela répond à ton besoin.

Dernière modification par kowalsky (17/02/2017 22:43:25)

Hors ligne

#10 18/02/2017 12:03:34

bg62
Membre
Inscription : 18/05/2007
Messages : 1 779
Site Web

Re : nouveau thème : help !

merci, je viens de tester, l'affichage se fait MAIS la 'rotation' de l'image n'est plus du tout la même, apparemment 180° en une seule fois alors que en ligne ...ça tourne fou, ce que je voudrais conserver      smile
@+

Dernière modification par bg62 (18/02/2017 16:11:37)


le 'www' est fait pour communiquer et échanger, non ?
fonds d'écran   | référencement efficace | Portfolio | Fonds d'écran automobile | outils SEO | échange de liens en dur

Hors ligne

#11 18/02/2017 12:26:46

kowalsky
Membre
Inscription : 20/08/2015
Messages : 273
Site Web

Re : nouveau thème : help !

Oui, c'est normal car ce que je te propose utilise juste 2 images de fond inversées pour le logo, alors que via la propriété CSS "transform" tu appliquais une rotation à l'image directement au niveau de la page.

Je ne sais pas faire mieux, mais c'était juste pour t'apporter un début de solution à ta demande. Peut-être que d'autres auront une autre proposition smile

Hors ligne

#12 18/02/2017 16:16:53

bg62
Membre
Inscription : 18/05/2007
Messages : 1 779
Site Web

Re : nouveau thème : help !

ok, alors merci quand même wink
pourrais-tu revoir, pour la question 'initiale' :

MAIS  j'aimerais maintenant réussir à générer la balise 'alt' pour quelle affiche le ' titre du site '

même avec le script d'origine, cela serait bien suffisant ...

[== Indéfini ==]
<div id="logo1"> 
	<a  href="index.php" rel="external"><img src="<?php $plxShow->template(); ?>/img/photos.png"  title="<?php $plxShow->lang('PLUXML_DESCRIPTION') ?>"alt="notre site" /></a>
	</div>

title = ok ça va
alt = là je netrouve pas la ligne de commande pour afficher le ' titre du site '
@+


le 'www' est fait pour communiquer et échanger, non ?
fonds d'écran   | référencement efficace | Portfolio | Fonds d'écran automobile | outils SEO | échange de liens en dur

Hors ligne

#13 18/02/2017 17:38:39

niqnutn
Membre
Inscription : 21/09/2015
Messages : 285
Site Web

Hors ligne

#14 18/02/2017 18:43:04

bg62
Membre
Inscription : 18/05/2007
Messages : 1 779
Site Web

Re : nouveau thème : help !

voici où j'en suis :

[== Indéfini ==]
	<a class="logo1" href="index.php"><img src="<?php $plxShow->template(); ?>/img/photos.png" 
	title="<?php $plxShow->lang('PLUXML_DESCRIPTION') ?>"alt="<?php $plxShow->mainTitle() ?>" /></a>

et pour la CSS:

[== CSS ==]
 .logo1  img:hover{
	  transform: rotate(720deg);
    transition: all 1s ease 0s;
}

mais si l'affichage est bien ce que je recherchais, pour la css je ne sais pas si la seconde ligne est valable car je ne connais pas ces paramètres ?
smile

ensuite au niveau des fameux ' traits noirs ' :
mauve
là je coince, les 'hr' ( eux ils encadre la barre de navigation ... je pense ! ) n'en sont pas responsables et je ne vois pas comment les supprimer ...

Dernière modification par bg62 (18/02/2017 19:02:53)


le 'www' est fait pour communiquer et échanger, non ?
fonds d'écran   | référencement efficace | Portfolio | Fonds d'écran automobile | outils SEO | échange de liens en dur

Hors ligne

#15 18/02/2017 21:01:27

kowalsky
Membre
Inscription : 20/08/2015
Messages : 273
Site Web

Re : nouveau thème : help !

Pour le "alt", tu l'avais dans ma solution, puisque l'image et le titre étaient liés via  <?php $plxShow->mainTitle('link'); ?> smile D'ailleurs, je me demande si pour le logo, une image gif animée en :hover ne pourrai pas faire la rotation que tu veux au final.

A noter que dans ta dernière version c'est la description du site que tu affiches au survol de l'image et non le titre de celui-ci :

<a class="logo1" href="index.php"><img src="<?php $plxShow->template(); ?>/img/photos.png"
    title="<?php $plxShow->mainTitle() ?>" alt="<?php $plxShow->mainTitle() ?>" /></a>



Pour les barres noires, c'est dans theme.css ligne 188 que ça se passe :
.footer {
    border-top: 1px solid #444;

Le trait du bas venant de footer.php, et celui du haut parce que tu as du code en trop ailleurs, cf la première partie de mon commentaire  #4

Dernière modification par kowalsky (18/02/2017 21:11:53)

Hors ligne

#16 18/02/2017 22:09:03

bg62
Membre
Inscription : 18/05/2007
Messages : 1 779
Site Web

Re : nouveau thème : help !

super !!!
vous êtes TOP  tous les deux smile
Il ne me reste plus qu'une seule chose, je pense, c'est au niveau des " tags " dans la sidebar:
selon les cas ils essaient de d'afficher à quatre par exemple, mais sur une seule ligne, du coup = pas joli
il faudrait que j'arrive à pouvoir en afficher ( au hasard 5 ou6 ou ... ) et que cela tienne par paquets de trois maximum ( par exemple ) et passe ensuite automatiquement à la ligne  ...
@mitiés
bg

en tous cas au moins ... j'apprends l à !
prof


le 'www' est fait pour communiquer et échanger, non ?
fonds d'écran   | référencement efficace | Portfolio | Fonds d'écran automobile | outils SEO | échange de liens en dur

Hors ligne

#17 07/03/2017 18:12:10

bg62
Membre
Inscription : 18/05/2007
Messages : 1 779
Site Web

Re : nouveau thème : help !

Bon, ok, le thème est terminé ET dispo !
MerciS à TouS ...
je viens de le mettre ici :Thème pour PluXml
... je n'arrive pas à le placer dans les " ressources " = SI quelqu'un pouvait s'en occuper ce serait plus que sympa !
@+
bg

Dernière modification par bg62 (07/03/2017 18:41:23)


le 'www' est fait pour communiquer et échanger, non ?
fonds d'écran   | référencement efficace | Portfolio | Fonds d'écran automobile | outils SEO | échange de liens en dur

Hors ligne

Pied de page des forums

A propos Nous soutenir Contact Twitter Google+
Copyright © 2006-2017 PluXml.org, tous droits réservés