Página 1 de 1

Modificar header en SimpleGreen

Publicado: 27 Ene 2011, 21:34
por ezepim6
Estoy intentando realizar unas modificaciones a la cabecera y se me esta complicando.

Utilicé la guía para modificar el ancho de Prosilver, especificamente hice estas modificaciones...

Código: Seleccionar todo

QUITAR BUSQUEDA


EDITAR: styles/prosilver/template/overall_header.html


BUSCAR:

		<!-- IF S_DISPLAY_SEARCH and not S_IN_SEARCH -->
			<div id="search-box">
				<form action="{U_SEARCH}" method="post" id="search">
				<fieldset>
					<input name="keywords" id="keywords" type="text" maxlength="128" title="{L_SEARCH_KEYWORDS}" class="inputbox search" value="<!-- IF SEARCH_WORDS-->{SEARCH_WORDS}<!-- ELSE -->{L_SEARCH_MINI}<!-- ENDIF -->" onclick="if(this.value=='{LA_SEARCH_MINI}')this.value='';" onblur="if(this.value=='')this.value='{LA_SEARCH_MINI}';" /> 
					<input class="button2" value="{L_SEARCH}" type="submit" /><br />
					<a href="{U_SEARCH}" title="{L_SEARCH_ADV_EXPLAIN}">{L_SEARCH_ADV}</a> {S_SEARCH_HIDDEN_FIELDS}
				</fieldset>
				</form>
			</div>
		<!-- ENDIF -->

CAMBIAR POR:

		<!-- IF S_DISPLAY_SEARCH and not S_IN_SEARCH -->
		<!-- ENDIF -->


-----------------------------------------------------------------------------------------------------------------------

Poner BUSCAR en la linea de Desconectar ETC

EDITAR: styles/prosilver/template/overall_header.html

BUSCAR:

<li class="icon-faq"><a href="{U_FAQ}" title="{L_FAQ_EXPLAIN}">{L_FAQ}</a></li>

AÑADiR DEPUES:

<li class="icon-search"><a href="{U_SEARCH}" title="{L_FAQ_EXPLAIN}">{L_SEARCH}</a></li>

-----------------------------------------------------------------------------------------------------------------------
Me esta qeudando todo asi...

Imagen

Quisiera sacar los links y la busqueda avanzada que marque con un circulo rojo, y achicar la distancia que marque con flecha azul.

Para sacar los links y la busqueda avanzada lo encontre en el overall_header, aca..

Código: Seleccionar todo

<div class="menu-block" style="float: {S_CONTENT_FLOW_END}; width: 19%;">
             <div class="menu-row-first"><a class="left menu-link" href="#">Your Link</a></div>
             <div class="menu-row-first"><a class="left menu-link" href="#">Your Link</a></div>
             <div class="menu-row-first"><a class="left menu-link" href="#">Your Link</a></div>
             <div class="menu-row-first"><a class="left menu-link" href="#">Your Link</a></div>
             <div class="menu-row-first"><a class="left menu-link" href="#">Your Link</a></div>			 
             <div class="menu-row"><a class="left menu-link" href="{U_SEARCH}" title="{L_SEARCH_ADV_EXPLAIN}">{L_SEARCH_ADV}</a></div>	
			 <br />
Pero cuando elimino todo eso se me achican los bordes del foro, osea el foro se ensancha hasta el borde negro y queda muy feo...

Imagen

Entonces lo unico que quedaria es, que no se modifique el borde del foro y achicar la distancia que marque con la flecha azul.

Re: Modificar header en SimpleGreen

Publicado: 28 Ene 2011, 16:37
por leviatan21
Veo que ya lo solucionaste, sería bueno que nos dijeras como para que sirva de referencia a otros usuarios 8-)

Modificar header en SimpleGreen

Publicado: 28 Ene 2011, 21:06
por ezepim6
Si leviathan, disculpa es que ando con otro quilombo que me tiene loco (supongo que tendré que abrir otro post)

Lo solucionné asi...

Para bajar la distancia que habia marcado con flecha azul, era el SITE_NAME y SITE_DESCRIPTION que no se veian porque eran blancos y el fondo también.

Hice esto:

Código: Seleccionar todo

<div id="site-description">
				<a href="{U_INDEX}" title="{L_INDEX}" id="logo">{SITE_LOGO_IMG}</a>
				<h1>{SITENAME}</h1>
				<p>{SITE_DESCRIPTION}</p>
				<p class="skiplink"><a href="#start_here">{L_SKIP}</a></p>
			</div>
Lo deje asi:

Código: Seleccionar todo

<div id="site-description">
				<a href="{U_INDEX}" title="{L_INDEX}" id="logo">{SITE_LOGO_IMG}</a>
				<p class="skiplink"><a href="#start_here">{L_SKIP}</a></p>
			</div>
Asi desaparecieron esos dos renglones que no se veian pero era lo que hacia el espacio...


Despues para eliminar los links del lado derecho sin que modifique el borde, hice lo siguiente:

Código: Seleccionar todo

<div id="wrap">
	<a id="top" name="top" accesskey="t"></a>
	<div id="page-header">
		<div class="headerbar">
			<div class="inner"><span class="corners-top"><span></span></span>

          <div class="menu-block" style="float: {S_CONTENT_FLOW_END}; width: 19%;">
             <div class="menu-row-first"><a class="left menu-link" href="#">Your Link</a></div>
             <div class="menu-row-first"><a class="left menu-link" href="#">Your Link</a></div>
             <div class="menu-row-first"><a class="left menu-link" href="#">Your Link</a></div>
             <div class="menu-row-first"><a class="left menu-link" href="#">Your Link</a></div>
             <div class="menu-row-first"><a class="left menu-link" href="#">Your Link</a></div>			 
             <div class="menu-row"><a class="left menu-link" href="{U_SEARCH}" title="{L_SEARCH_ADV_EXPLAIN}">{L_SEARCH_ADV}</a></div>	
			 <br />
		<!-- IF S_DISPLAY_SEARCH and not S_IN_SEARCH -->
Lo deje así:

Código: Seleccionar todo

<div id="wrap">
	<a id="top" name="top" accesskey="t"></a>
	<div id="page-header">
		<div class="headerbar">
			<div class="inner"><span class="corners-top"><span></span></span>
		<div class="menu-block" style="float: {S_CONTENT_FLOW_END}; width: 19%;">

  
<!-- IF S_DISPLAY_SEARCH and not S_IN_SEARCH -->
Creo que la linea importante es esta <div class="menu-block" style="float: {S_CONTENT_FLOW_END}; width: 19%;"> no es la que genera un bloque?

En fin, ahí logre lo que queria hacer, igualmente me gustarioa dejarlo abierto si es posible, porque estoy otro problema con los archivos adjuntos que no aparecen, y no quisiera dar por terminado este tema, ustedes diran....

Hasta luego amigos

Modificar header en SimpleGreen  Tema Solucionado

Publicado: 28 Ene 2011, 21:18
por leviatan21
ezepim6 escribió:Despues para eliminar los links del lado derecho sin que modifique el borde, hice lo siguiente:
Así como está ahora tu overall_header.html, este código está sobrando :

Código: Seleccionar todo

		<div class="menu-block" style="float: {S_CONTENT_FLOW_END}; width: 19%;">

  
<!-- IF S_DISPLAY_SEARCH and not S_IN_SEARCH -->
		<!-- ENDIF -->
          </div>
Y este otro :

Código: Seleccionar todo

          <div style="float: {S_CONTENT_FLOW_BEGIN}; width: 79.5%;">			
			
			<div id="site-description">
				<a href="{U_INDEX}" title="{L_INDEX}" id="logo">{SITE_LOGO_IMG}</a>

				<p class="skiplink"><a href="#start_here">{L_SKIP}</a></p>
			</div>

    </div>
puedes reemplazarlo por :

Código: Seleccionar todo

			<div id="site-description">
				<a href="{U_INDEX}" title="{L_INDEX}" id="logo">{SITE_LOGO_IMG}</a>

				<p class="skiplink"><a href="#start_here">{L_SKIP}</a></p>
			</div>
Con todo eso limpio, tendría que quedarte algo así :

Código: Seleccionar todo

		<div class="headerbar">
			<div class="inner"><span class="corners-top"><span></span></span>
			<div id="site-description">
				<a href="{U_INDEX}" title="{L_INDEX}" id="logo">{SITE_LOGO_IMG}</a>
				<p class="skiplink"><a href="#start_here">{L_SKIP}</a></p>
			</div>
			<span class="corners-bottom"><span></span></span></div>
		</div>
		<br />

Modificar header en SimpleGreen

Publicado: 29 Ene 2011, 08:18
por ezepim6
BIen , hice lo que pusiste , parece que va todo bien, quedo igual pero supongo que ahora esta todo el codigo mas limpio, no?

Gracias por todo.

Re: Modificar header en SimpleGreen

Publicado: 29 Ene 2011, 10:21
por leviatan21
Sip, mas limpio :chulo: