5546 sujets

Sémantique web et HTML

Bonjour,

Je cherche comment intégrer un lien sur la bannière qui redirige sur la page index du forum, pour vous ça pas l'air compliqué j'ai tout de même sillonné des site web pour avoir l'info avant de poster malgré plusieurs tentatives Smiley decu
j'ai bien essayer dans la balise td mais ça ne fonctionne pas voila comment j'y m'y suis pris
<a href="http://detection-lyon.leforum.eu/index.php"></a><td background="http://img110.xooimage.com/files/8/2/0/headc-centre-4-561aa39.gif" width="100%" height="244" align="center" valign="bottom">


Voici le code original du fichier overall_header.tplmais il n'y a pas de lien sur la bannière du fofo qui redirige sur la page index.
<td background="http://img110.xooimage.com/files/8/2/0/headc-centre-4-561aa39.gif" width="100%" height="244" align="center" valign="bottom">

Et voici le lien que je veux intégrer sur le code ci-dessus
http://detection-lyon.leforum.eu/index.php

Si une âme charitable pouvais me donner un coup de pouce a serait sympa surtout pour un noob ????
Bonjour limwim,

<td background="http://img110.xooimage.com/files/8/2/0/headc-centre-4-561aa39.gif" width="100%" height="244" align="center" valign="bottom"><a href="http://detection-lyon.leforum.eu/index.php" class="monlien"></a>


.monlien{
width:100%;
height:100%;
display:block
}
Bonjour,
Merci pour la piste, cela dit le lien n'est toujours pas cliquable
Modifié par limwim (04 May 2019 - 17:31)
Voila mon fichier css je place le code à partir du début à "The content of the posts (body of text"
/* Based on the original Style Sheet for the fisubsilver v2 Theme for phpBB version 2+
Editer par nerevare -  http://www.dgf.tonsite.biz  - 06-1-2005 dgf_wow
Edited by Daz  -  http://www.forumimages.com  - last updated 26-06-03 */

/* The content of the posts (body of text) */
body{background:#000000;color:#FFFFCC;font:12px Verdana,Arial,Helvetica,sans-serif;margin:0px;padding:0;
scrollbar-3dlight-color:#161616;
scrollbar-arrow-color:#161616;
scrollbar-darkshadow-color:#161616;
scrollbar-face-color:#211303; 
scrollbar-highlight-color:#402708;
scrollbar-shadow-color:#000000;
scrollbar-track-color:#000000}

/* General font families for common tags */
font,th,td,p{font:12px Verdana,Arial,Helvetica,sans-serif}
p{margin-top:2px;margin-bottom:3px}

/* General text */
.gensmall{font-size:10px}
td.genmed,.genmed{font-size:11px}
.explaintitle{font-size:11px;font-weight:bold;color:#CCCCCC}

/* General page style */
a:link,a:active,a:visited,a.postlink{color:#CC9900;text-decoration:none}
a:hover{color:#CC6600}

/* titles for the topics:could specify viewed link colour too */
.topictitle{font-size:11px;font-weight:bold}
a.topictitle:visited{color:#CC9900}
a.topictitle:hover{color:#CC6600}

/* Name of poster in viewmsg.php and viewtopic.php and other places */
.name{font-size:11px;font-weight: bold}

hr{border: 0px solid #CCCCCC;border-top-width:1px;height:0px}

/* Category gradients*/
td.cat{color:#FFFFCC;font-weight:bold;letter-spacing:1px;background:#CCCCCC url('http://img6.xooimage.com/files/c/e/cellpic1-32560.gif');
height:31px;text-indent:4px}

a.cattitle,a.cattitle:visited{color:#CC9900}
a.cattitle:hover{color:#CC6600}

/* Main table cell colours and backgrounds */
.row1{background:#161616}
.row2{background:#161616}
.row3{background:#161616}
td.spacerow{background:#000000}

.row1,.row2,.row3,td.spacerow,td.cat,td.rowpic,th,.topnav{
border:1px solid;border-color:#000000 #000000 #000000 #000000}

/* This is for the table cell above the Topics,Post & Last posts on the index.php */
td.rowpic{background: #161616 url('http://img.xooimage.com/files/') repeat-y}

/* Table Header cells */
th{background: #161616 url('http://img6.xooimage.com/files/c/b/cb_fbr_tex2-32561.gif');color:#FFFFCC;font-size:11px;
font-weight:bold;height:27px;white-space:nowrap;text-align:center;padding-left:8px;padding-right:8px}

/* This is the border line & background colour round the entire page */
.bodyline{background:#161616 url('http://img8.xooimage.com/files/c/b/cb_fbr_tex-31751.gif')}

/* This is the outline round the main forum tables */
.forumline{background:#161616}

.bodyline,.forumline{border:1px solid;border-color: #000000 #000000 #000000 #000000}

/* The largest text used in the index page title and toptic title etc. */
.maintitle,h1{
font:bold 20px/120% "Trebuchet MS",Verdana,Arial,Helvetica,sans-serif;text-decoration:none;color:#000000}

.subtitle,h2{font:bold 18px/180% "Trebuchet MS",Verdana,Arial,Helvetica,sans-serif;
text-decoration:none}

/* Used for the navigation text,(Page 1,2,3 etc) and the navigation bar when in a forum */
.nav{font-size:11px;font-weight:bold;color:#FFFFFF}
.postbody{font-size:12px;line-height:125%}

/* Location,number of posts,post date etc */
.postdetails{font-size:10px;color:#CCCCCC}

/* Quote blocks */
.quote{background:#bebebe;border:3px solid #696969;color:#000000;
font-size:11px;line-height:125%}

/* Code blocks */
.code{background:#000000;border:3px solid #bebebe;color:#bebebe;
font:12px Courier,"Courier New",sans-serif;padding:5px}

/* This is for the error messages that pop up */
.errorline{background:#292929;border:1px solid #990606}

/* Form elements */
form{display:inline}

input{font:11px Verdana,Arial,Helvetica,sans-serif;color:#000000}

select{background:#FFFFFF;color:#000000;font:11px Verdana,Arial,Helvetica,sans-serif}

input.post,textarea.post{background:#bebebe;color:#292929;
font:11px Verdana,Arial,Helvetica,sans-serif;padding-bottom:2px;padding-left:2px;
border:1px solid;border-color: #000000 #707070 #707070 #000000}

input.button,input.liteoption,.fakebut{background:#bebebe;font-size:11px;color:#292929;
border:1px solid; border-color:#696969 #000000 #000000 #696969}
input.mainoption{background:#bebebe;color:#292929;font-size:11px;
border:1px solid; border-color:#696969 #000000 #000000 #696969}
input.catbutton{background:#bebebe;font-size:11px;
border:1px solid; border-color:#696969 #000000 #000000 #696969}

a.but,a.but:hover,a.but:visited{color:#000000;text-decoration:none}

/* This is the line in the posting page which shows the rollover help line. */
.helpline{background:#bebebe;border:0 solid;font-size:10px}

/* This is the gradient background at the top of the page */
.topbkg{background: #000000 url('http://img.xooimage.com/files/') repeat-x;height:120px; font-size:13px;
line-height: 140%;font-weight:bold;color:#bebebe}
.headtitle{font:bold 28px/180% "Trebuchet MS",Verdana,Arial,Helvetica,sans-serif;color: #ffffff}

.topnav{font-size:10px;background:#000000;color:#bebebe;height:23px;white-space:nowrap}

/* Admin & Moderator Colours MODification */
.admin,.mod{font-size:11px;font-weight:bold}
.admin,a.admin,a.admin:visited{color:#80253F}
.mod,a.mod,a.mod:visited{color:#FFFFCC}
a.admin:hover,a.mod:hover{color:#767676}

/* Specify the space around images */
.imgtopic,.imgicon{margin-left:0}
.imgspace{margin-left:1px;margin-right:2px}
.imgfolder{margin:1px 4px 1px 4px}

/* Gets rid of the need for border="0" on hyperlinked images */
img{border:0 solid}

/* Background images for tables */
.tbltop{background:#161616 url('http://img.xooimage.com/files/') repeat-x}
.tblleft{background:#161616 url('http://img.xooimage.com/files/') repeat-y}
.tblright{background:#161616 url('http://img.xooimage.com/files/') repeat-y}
.tblbot{background:#161616 url('http://img.xooimage.com/files/') repeat-x}
J'ai surement mal compris mais pourquoi tu ne mets pas ta bannière entre les balises <a>

Exemple :

<td>
 <a href="lien.html">
  <img src = "ta_banniere.jpg" />
 </a>
</td>

Modifié par pacsys (04 May 2019 - 17:58)
J'ai essayer mais ça décale les menus en haut a gauche
voici mon fichier overall_header.tpl
<?xml version="1.0" encoding="{S_CONTENT_ENCODING}"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="{S_CONTENT_DIRECTION}">
<head>
<meta http-equiv="Content-Type" content="text/html; charset={S_CONTENT_ENCODING}" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<link href="dgfwarcraft.css" rel="stylesheet" type="text/css" />
{META}
{NAV_LINKS}
<title>{SITENAME} :: {PAGE_TITLE}</title>
<link rel="stylesheet" href="http://img4.xooimage.com/files/d/g/dgfwarcraft-3256a.css" type="text/css" />
<!-- BEGIN switch_enable_pm_popup -->
<script type="text/javascript">
<!--
	if ( {PRIVATE_MESSAGE_NEW_FLAG} )
	{
		window.open('{U_PRIVATEMSGS_POPUP}', '_phpbbprivmsg', 'HEIGHT=225,resizable=yes,WIDTH=400');;
	}
//-->
</script>
<!-- END switch_enable_pm_popup -->
</head>
<body style="margin:0px">
<table align="center" width="900" border="0" cellpadding="0" cellspacing="0">
	<tr>
		<td colspan="2">
			<img src="http://img110.xooimage.com/files/b/d/2/headc-gauche1-561a768.gif" width="210" height="244" alt=""></td>
		<td background="http://img110.xooimage.com/files/8/2/0/headc-centre-4-561aa39.gif" width="100%" height="244" align="center" valign="bottom">
        <span class="mainmenu">&nbsp;<a href="{U_FAQ}" class="mainmenu">{L_FAQ}</a></span><span class="mainmenu">&nbsp;  &nbsp;<a href="{U_MEMBERLIST}" class="mainmenu">{L_MEMBERLIST}</a>&nbsp; &nbsp;<a href="{U_GROUP_CP}" class="mainmenu">{L_USERGROUPS}</a>&nbsp; 
						<!-- BEGIN switch_user_logged_out -->
						&nbsp;<a href="{U_REGISTER}" class="mainmenu">{L_REGISTER}</a></span>&nbsp;
						<!-- END switch_user_logged_out -->
		<span class="mainmenu">&nbsp;<a href="{U_PRIVATEMSGS}" class="mainmenu">Messages priv&eacute;</a>&nbsp; &nbsp;<a href="{U_PROFILE}" class="mainmenu">{L_PROFILE}</a>&nbsp; &nbsp;<a href="{U_LOGIN_LOGOUT}" class="mainmenu">D&eacute;/connexion</a>&nbsp;</span>				
						<br /><br />
			</td>
		<td colspan="2">
			<img src="http://img110.xooimage.com/files/a/3/7/headc-droite-561a745.gif" width="224" height="244" alt=""></td>
	</tr>
	<tr>
		<td>
			<img src="http://img9.xooimage.com/files/c/a/cadrehg-3256e.gif" width="65" height="30" alt=""></td>
		<td background="http://img4.xooimage.com/files/c/a/cadrehc-3256f.gif" width="100%" height="30" colspan="3">
		</td>
		<td>
			<img src="http://img5.xooimage.com/files/c/a/cadrehd-32570.gif" width="74" height="30" alt=""></td>
	</tr>
	<tr>
		<td background="http://img6.xooimage.com/files/c/a/cadreg-32571.gif" width="65" height="100%">
			</td>
		<td background="http://img6.xooimage.com/files/f/o/fontforum-32572.gif" colspan="3" valign="top">
	<br />		
	<table cellpadding="0" cellspacing="0" border="0" width="100%">
	    <tr>
		    <td align="right">
			    <form action="{U_SEARCH}?mode=results" method="post" target="_top">
                Recherche rapide :<br /><input type="text" class="post" name="search_keywords" size="14" />&nbsp;<input type="submit" class="mainoption" name="login" value="Ok" /><br />
                </form>
			</td>
	   </tr>
	</table>
	<br />
Original sans modification du fichier overall_header.tpl
upload/1556991709-16476-avecbalisetd-.jpg
Modifié par limwim (04 May 2019 - 19:42)
Et sans la modification du fichier la barre de navigation du fofo est bien placée

upload/1556991882-16476-originalsanslien-.jpg
Modifié par limwim (04 May 2019 - 19:44)
J'ai pu intégrer différemment après plusieurs essais avec cette ajustement cela fonctionne mais j'ai du faire une image transparent de 466 px sur 244 px
<a href="http://detection-lyon.leforum.eu/index.php"><img src="https://i.postimg.cc/xdsdqcDM/prospecteur-center.png" width="100%" height="200" align="center" valign="bottom></a>

Merci pour tout et pour votre réactivité et les divers solutions
Petite question pourquoi tu ne m'est pas une classe ou un ID à l'element cible (le TD je crois) ??
En jquery/js tu peux choper ton <td> et y ajouter un lien.


Comme tu n'as pas mis de classe ou d'id, il faut choper le <td> via un autre élement, je vois que l'element ENFANT à une classe :
mainmenu
c'est un <span>
du coup :

jQuery("span.mainmenu").parent();


voila j'ai mon <td>

jQuery("span.mainmenu").parent().on('click',function(e){
    window.location='http://detection-lyon.leforum.eu/index.php';
});


J'ai testé sur ton site en 2 seconde, ça fonctionne.
Modifié par JENCAL (07 May 2019 - 11:46)
C'est quoi la différence avec la méthode que j'ai ajouter et les avantages ?
sinon ou dois je placer ce bout de code ?
Dans le fond c'est la même chose.

Sauf que là tu avais une couche éxistante de HTML/CSS, tu as du "casser" un peu ton architecture et modifier ton CSS, en JS tu ne casse rien tu viens "ajouter" par dessus.

Le js est là pour gérer tous les événement (clavier, souris).

Si tu ne connais rien en JS alors oublie. sinon, il faut mettre entre <script></script> à la fin du <body> en dernière place (je t'évite toutes la partie architecture où normalement tu dois le mettre dans un fichier à part.)
limwim a écrit :
Mais le problème c'est que n'est pas accès au fichiers Js uniquement aux tpl


Ah pardon, j'avais pas tout lu. Smiley smile