phpBB España Oficial

Publicado: **20 Jun 2011, 11:32**

Hola. Soy bastante nuevo en el foro pero creo que empezaré a pasarme bastante por aqui jeje
Quiero empezar a "tunear" un poquito mi foro. De momento estoy mirando MODs q me puedan resultar interesante e intentando averiguar como instalarlos y tal. Pero he encontrado un par de cosas que creo que son sencillas y utiles pero que no se exactamente como implimentar al foro. De momento me conformo con insertar un enlace a mi pagina de Facebook tal y como teneis vosotros en la navbar.

: Dibujo.JPG (69.61 KiB) Visto 1977 veces

El otro tema es que ayer estuve modificando los colores de mi navbar. El problema es que no consigo encontrar como cambiar los colores de las pestañas para dejarlas igual. Para que veais a que me refiero:

: Dibujo.JPG (9.44 KiB) Visto 1976 veces

Tal vez sea una duda muy basica pero si podeis indicarme como hacerlo os lo agradeceria bastante.

He estado buscando por el foro temas similares pero no he encontrado nada. Mis disculpas si existe y no lo he sabido encontrar :S

Publicado: **21 Jun 2011, 02:38**

los coloreares de las pestañas son imagenes que esta en theme/images/tab.*

Publicado: **21 Jun 2011, 10:46**

Gracias Makoto! Los he estado modificando y perfecto!

Aunque me he encontrado con un detalle que no se solucionar...bueno de hecho dos jejeje. Mira, te comento a ver si podrias echarme un cable.
Despues de cambiar el color de los bg_tabs, al seleccionar una de ellas entre la pestaña y el navbar aparece una linea gris que no se como eliminar:

: 1.PNG (6.38 KiB) Visto 1952 veces

Por otro lado, al cambiar el color de las pestañas de la navbar tambien cambia el color de las pestañas del Panel de Control de Usuario. Y el problema es que queda asi:

: 2.PNG (21.46 KiB) Visto 1952 veces

He intentado encontrar en el colour.css el punto donde cambiar el color gris del Panel de Control de Usuario pero no hay manera, cambie lo que cambie se mantiene gris y queria cambiarlo por el mismo verde que tiene la navbar, pero nada, no lo consigo.
Si pudierais echarme una manilla os lo agradeceria mucho

Publicado: **21 Jun 2011, 16:32**

cientificoloco88 escribió: Aunque me he encontrado con un detalle que no se solucionar...bueno de hecho dos jejeje. Mira, te comento a ver si podrias echarme un cable.
Despues de cambiar el color de los bg_tabs, al seleccionar una de ellas entre la pestaña y el navbar aparece una linea gris que no se como eliminar:
1.PNG
Por otro lado, al cambiar el color de las pestañas de la navbar tambien cambia el color de las pestañas del Panel de Control de Usuario. Y el problema es que queda asi:
2.PNG
He intentado encontrar en el colour.css el punto donde cambiar el color gris del Panel de Control de Usuario pero no hay manera, cambie lo que cambie se mantiene gris y queria cambiarlo por el mismo verde que tiene la navbar, pero nada, no lo consigo.
Si pudierais echarme una manilla os lo agradeceria mucho

El Problema con esto, es que usa el mismo css, la clave sería crear "otro distinto"
En Primer lugar, devuelve las imagenes originales de styles/tuestilo/theme/images/
Luego, hacer estos cambios
Abrir: styles/tuestilo/theme/colours.css
Buscar

Código: Seleccionar todo

/* CP tabbed menu
----------------------------------------*/
#tabs a {
	background-image: url("{T_THEME_PATH}/images/bg_tabs1.gif");
}

#tabs a span {
	background-image: url("{T_THEME_PATH}/images/bg_tabs2.gif");
	color: #bbb;
}

#tabs a:hover span {
	color: #ba1d1d;
}

#tabs .activetab a {
	border-bottom-color: #bbb;
}

#tabs .activetab a span {
	color: #bbb;
}

#tabs .activetab a:hover span {
	color: #ba1d1d;
}

Añadir despues

Código: Seleccionar todo

/* tabbed menu
----------------------------------------*/
#tabs1 a {
	background-image: url("{T_THEME_PATH}/images/menu_tabbed/bg_tabs1.gif");
}

#tabs1 a span {
	background-image: url("{T_THEME_PATH}/images/menu_tabbed/bg_tabs2.gif");
	color: #bbb;
}

#tabs1 a:hover span {
	color: #ba1d1d;
}

#tabs1 .activetab a {
	border-bottom-color: #bbb;
}

#tabs .activetab a span {
	color: #bbb;
}

#tabs1 .activetab a:hover span {
	color: #ba1d1d;
}

Una vez este cambio, deberás subir las imagenes en "verde", a la carpeta styles/tuestilo/theme/images/menu_tabbed/
Nota: Deben tener el mismo nombre que las originales
Luego, me imagino que tendrías que modificar el "color" de #tabs a span, y poner en formato hexadecimal el color verde que estas usando
Luego, debes de ir a styles/prosilver/template/overall_header.html
Buscar:

Código: Seleccionar todo

<div id="tabs">

Reemplazar por

Código: Seleccionar todo

<div id="tabs1">

Tras esto, ir al Panel de Admnistración (ACP) > Estilos > Plantilla > Tu estilo > Actulizar
Luego ir al Panel de Admnistración (ACP) > Estilos > Tema > Tu estilo > Actulizar
Luego nos cuentas como te fue

Publicado: **22 Jun 2011, 01:21**

Gracias zoby!
Te cuento, he seguido tus pasos al pie de la letra y efectivamente las pestañas del Panel de Control vuelven a su color gris original como me gustaba. El problema viene con las pestañas de la navbar y el color de la navbar, que ha vuelto al color por defecto del prosilver. Asi que ha quedado asi :S:

: 1.PNG (5.54 KiB) Visto 1938 veces

Voy a intentar averiguar probando un poco a ver si encuentro la solución. En ese caso avisaria, pero si puedes echarme una manilla me vendra bien seguro! Gracias otra vez!

Publicado: **22 Jun 2011, 01:51**

He estado haciendo pruebas y veo que los cambios en el colour.css en la parte de CP tabbed menu tienen efecto sobre las pestañas tanto del Panel de Control de Usuario como de las pestañas de la navbar. Asi que llego a la conclusión (tal vez erronea) de que el fallo deberia estar en el overall_header... Te lo pego aqui por si te sirve de algo. Voy a intentar seguir averiguando cosillas.
Por cierto...dejando el overall_header tal cual estaba antes, sin el cambio que indicabas, he vuelto a la navbar verde y las pestañas grises.

Código: Seleccionar todo

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="{S_CONTENT_DIRECTION}" lang="{S_USER_LANG}" xml:lang="{S_USER_LANG}">
<head>

<meta http-equiv="content-type" content="text/html; charset={S_CONTENT_ENCODING}" />
<meta http-equiv="content-style-type" content="text/css" />
<meta http-equiv="content-language" content="{S_USER_LANG}" />
<meta http-equiv="imagetoolbar" content="no" />
<meta name="resource-type" content="document" />
<meta name="distribution" content="global" />
<meta name="copyright" content="2000, 2002, 2005, 2007 phpBB Group" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7; IE=EmulateIE9" />
{META}
<link rel="icon" href="images/favicon.ico" type="image/x-icon" />
<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon" />
<title>{SITENAME} &bull; <!-- IF S_IN_MCP -->{L_MCP} &bull; <!-- ELSEIF S_IN_UCP -->{L_UCP} &bull; <!-- ENDIF -->{PAGE_TITLE}</title>

<!-- IF S_ENABLE_FEEDS -->
	<!-- IF S_ENABLE_FEEDS_OVERALL --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {SITENAME}" href="{U_FEED}" /><!-- ENDIF -->
	<!-- IF S_ENABLE_FEEDS_NEWS --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {L_FEED_NEWS}" href="{U_FEED}?mode=news" /><!-- ENDIF -->
	<!-- IF S_ENABLE_FEEDS_FORUMS --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {L_ALL_FORUMS}" href="{U_FEED}?mode=forums" /><!-- ENDIF -->
	<!-- IF S_ENABLE_FEEDS_TOPICS --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {L_FEED_TOPICS_NEW}" href="{U_FEED}?mode=topics" /><!-- ENDIF -->
	<!-- IF S_ENABLE_FEEDS_TOPICS_ACTIVE --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {L_FEED_TOPICS_ACTIVE}" href="{U_FEED}?mode=topics_active" /><!-- ENDIF -->
	<!-- IF S_ENABLE_FEEDS_FORUM and S_FORUM_ID --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {L_FORUM} - {FORUM_NAME}" href="{U_FEED}?f={S_FORUM_ID}" /><!-- ENDIF -->
	<!-- IF S_ENABLE_FEEDS_TOPIC and S_TOPIC_ID --><link rel="alternate" type="application/atom+xml" title="{L_FEED} - {L_TOPIC} - {TOPIC_TITLE}" href="{U_FEED}?f={S_FORUM_ID}&t={S_TOPIC_ID}" /><!-- ENDIF -->
<!-- ENDIF -->

<!--
	phpBB style name: prosilver
	Based on style:   prosilver (this is the default phpBB3 style)
	Original author:  Tom Beddard ( http://www.subBlue.com/ )
	Modified by:

	NOTE: This page was generated by phpBB, the free open-source bulletin board package.
	      The phpBB Group is not responsible for the content of this page and forum. For more information
	      about phpBB please visit http://www.phpbb.com
-->

<script type="text/javascript">
// <![CDATA[
	var jump_page = '{LA_JUMP_PAGE}:';
	var on_page = '{ON_PAGE}';
	var per_page = '{PER_PAGE}';
	var base_url = '{A_BASE_URL}';
	var style_cookie = 'phpBBstyle';
	var style_cookie_settings = '{A_COOKIE_SETTINGS}';
	var onload_functions = new Array();
	var onunload_functions = new Array();

	<!-- IF S_USER_PM_POPUP -->
		if ({S_NEW_PM})
		{
			var url = '{UA_POPUP_PM}';
			window.open(url.replace(/&/g, '&'), '_phpbbprivmsg', 'height=225,resizable=yes,scrollbars=yes, width=400');
		}
	<!-- ENDIF -->

	/**
	* Find a member
	*/
	function find_username(url)
	{
		popup(url, 760, 570, '_usersearch');
		return false;
	}

	/**
	* New function for handling multiple calls to window.onload and window.unload by pentapenguin
	*/
	window.onload = function()
	{
		for (var i = 0; i < onload_functions.length; i++)
		{
			eval(onload_functions[i]);
		}
	}

	window.onunload = function()
	{
		for (var i = 0; i < onunload_functions.length; i++)
		{
			eval(onunload_functions[i]);
		}
	}

// ]]>
</script>
<script type="text/javascript" src="{T_TEMPLATE_PATH}/styleswitcher.js"></script>
<script type="text/javascript" src="{T_TEMPLATE_PATH}/forum_fn.js"></script>

<link href="{T_THEME_PATH}/print.css" rel="stylesheet" type="text/css" media="print" title="printonly" />
<link href="{T_STYLESHEET_LINK}" rel="stylesheet" type="text/css" media="screen, projection" />

<link href="{T_THEME_PATH}/normal.css" rel="stylesheet" type="text/css" title="A" />
<link href="{T_THEME_PATH}/medium.css" rel="alternate stylesheet" type="text/css" title="A+" />
<link href="{T_THEME_PATH}/large.css" rel="alternate stylesheet" type="text/css" title="A++" />

<!-- IF S_CONTENT_DIRECTION eq 'rtl' -->
	<link href="{T_THEME_PATH}/bidi.css" rel="stylesheet" type="text/css" media="screen, projection" />
<!-- ENDIF -->

</head>

<body id="phpbb" class="section-{SCRIPT_NAME} {S_CONTENT_DIRECTION}">

<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 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>

		<!-- 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 -->

			<span class="corners-bottom"><span></span></span></div>
		</div>

<div id="tabs">
       <ul>
          <li<!-- IF $_SERVER['SCRIPT_NAME'] == '/index.php' or $_SERVER['SCRIPT_NAME'] == '/viewforum.php' or $_SERVER['SCRIPT_NAME'] == '/viewtopic.php' --> class="activetab"<!-- ENDIF -->><a href="{U_INDEX}"><span>{L_INDEX}</span></a></li>
          <!-- IF S_DISPLAY_SEARCH --><li<!-- IF $_SERVER['SCRIPT_NAME'] == '/search.php' --> class="activetab"<!-- ENDIF -->><a href="{U_SEARCH}" title="{L_SEARCH_ADV_EXPLAIN}"><span>{L_SEARCH}</span></a></li><!-- ENDIF -->
          <!-- IF S_DISPLAY_MEMBERLIST --><li<!-- IF $_SERVER['SCRIPT_NAME'] == '/memberlist.php' --> class="activetab"<!-- ENDIF -->><a href="{U_MEMBERLIST}" title="{L_MEMBERLIST_EXPLAIN}"><span>{L_MEMBERLIST}</span></a></li><!-- ENDIF -->
          </ul>
    </div>
		<div class="navbar">
			<div class="inner"><span class="corners-top"><span></span></span>

			<ul class="linklist navlinks">
				<li class="icon-home"><a href="{U_INDEX}" accesskey="h">{L_INDEX}</a> <!-- BEGIN navlinks --> <strong>&#8249;</strong> <a href="{navlinks.U_VIEW_FORUM}">{navlinks.FORUM_NAME}</a><!-- END navlinks --></li>

				<li class="rightside"><a href="#" onclick="fontsizeup(); return false;" onkeypress="return fontsizeup(event);" class="fontsize" title="{L_CHANGE_FONT_SIZE}">{L_CHANGE_FONT_SIZE}</a></li>

				<!-- IF U_EMAIL_TOPIC --><li class="rightside"><a href="{U_EMAIL_TOPIC}" title="{L_EMAIL_TOPIC}" class="sendemail">{L_EMAIL_TOPIC}</a></li><!-- ENDIF -->
				<!-- IF U_EMAIL_PM --><li class="rightside"><a href="{U_EMAIL_PM}" title="{L_EMAIL_PM}" class="sendemail">{L_EMAIL_PM}</a></li><!-- ENDIF -->
				<!-- IF U_PRINT_TOPIC --><li class="rightside"><a href="{U_PRINT_TOPIC}" title="{L_PRINT_TOPIC}" accesskey="p" class="print">{L_PRINT_TOPIC}</a></li><!-- ENDIF -->
				<!-- IF U_PRINT_PM --><li class="rightside"><a href="{U_PRINT_PM}" title="{L_PRINT_PM}" accesskey="p" class="print">{L_PRINT_PM}</a></li><!-- ENDIF -->
			</ul>

			<!-- IF not S_IS_BOT and S_USER_LOGGED_IN -->
			<ul class="linklist leftside">
				<li class="icon-ucp">
					<a href="{U_PROFILE}" title="{L_PROFILE}" accesskey="e">{L_PROFILE}</a>
						<!-- IF S_DISPLAY_PM --> (<a href="{U_PRIVATEMSGS}">{PRIVATE_MESSAGE_INFO}</a>)<!-- ENDIF -->
					<!-- IF S_DISPLAY_SEARCH --> &bull;
					<a href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a>
					<!-- ENDIF -->
					<!-- IF U_RESTORE_PERMISSIONS --> &bull;
					<a href="{U_RESTORE_PERMISSIONS}">{L_RESTORE_PERMISSIONS}</a>
					<!-- ENDIF -->
				</li>
			</ul>
			<!-- ENDIF -->

			<ul class="linklist rightside">
				<li class="icon-faq"><a href="{U_FAQ}" title="{L_FAQ_EXPLAIN}">{L_FAQ}</a></li>
				<!-- IF not S_IS_BOT -->
					<!-- IF S_DISPLAY_MEMBERLIST --><li class="icon-members"><a href="{U_MEMBERLIST}" title="{L_MEMBERLIST_EXPLAIN}">{L_MEMBERLIST}</a></li><!-- ENDIF -->
					<!-- IF not S_USER_LOGGED_IN and S_REGISTER_ENABLED and not (S_SHOW_COPPA or S_REGISTRATION) --><li class="icon-register"><a href="{U_REGISTER}">{L_REGISTER}</a></li><!-- ENDIF -->
					<li class="icon-logout"><a href="{U_LOGIN_LOGOUT}" title="{L_LOGIN_LOGOUT}" accesskey="x">{L_LOGIN_LOGOUT}</a></li>
				<!-- ENDIF -->
			</ul>

			<span class="corners-bottom"><span></span></span></div>
		</div>

	</div>

	<a name="start_here"></a>
	<div id="page-body">
		<!-- IF S_BOARD_DISABLED and S_USER_LOGGED_IN and (U_MCP or U_ACP) -->
		<div id="information" class="rules">
			<div class="inner"><span class="corners-top"><span></span></span>
				<strong>{L_INFORMATION}:</strong> {L_BOARD_DISABLED}
			<span class="corners-bottom"><span></span></span></div>
		</div>
		<!-- ENDIF -->

Publicado: **22 Jun 2011, 03:54**

Vale...solucionado. Tu solucion estaba perfecta pero faltaba modificar el cp.css insertando, al igual que en el colours.css este fragmento:

Código: Seleccionar todo

/* tabbed menu
----------------------------------------*/
#tabs1 {
	line-height: normal;
	margin: 20px 0 -1px 7px;
	min-width: 570px;
}

#tabs1 ul {
	margin:0;
	padding: 0;
	list-style: none;
}

#tabs1 li {
	display: inline;
	margin: 0;
	padding: 0;
	font-size: 1em;
	font-weight: bold;
}

#tabs1 a {
	float: left;
	background: none no-repeat 0% -35px;
	margin: 0 1px 0 0;
	padding: 0 0 0 5px;
	text-decoration: none;
	position: relative;
	cursor: pointer;
}

#tabs1 a span {
	float: left;
	display: block;
	background: none no-repeat 100% -35px;
	padding: 6px 10px 6px 5px;
	color: #828282;
	white-space: nowrap;
}

#tabs1 a:hover span {
	color: #bcbcbc;
}

#tabs1 .activetab a {
	background-position: 0 0;
	border-bottom: 1px solid #ebebeb;
}

#tabs1 .activetab a span {
	background-position: 100% 0;
	padding-bottom: 7px;
	color: #333333;
}

#tabs1 a:hover {
	background-position: 0 -70px;
}

#tabs1 a:hover span {
	background-position:100% -70px;
}

#tabs1 .activetab a:hover {
	background-position: 0 0;
}

#tabs1 .activetab a:hover span {
	color: #000000;
	background-position: 100% 0;
}

Asi que muchas gracias por la solucion! Hoy ya he aprendido un poquito mas...mis horas me ha costado pero bueno jeje
Ahora solo falta si podriais decirme algo del boton de Facebook y ya seria perfecto

Publicado: **22 Jun 2011, 04:57**

Pensaba borrar una de mis respuestas q ya no es necesaria y editar la anterior pero el foro no me deja. Asi q dejo esta como ultima respuesta (ya va siendo hora).
Parecia q estaba todo solucionado pero antes de cerrar he probado a entrar con otro explorador y lo que me he encontrado ha sido esto:

: fail.png (2.79 KiB) Visto 1930 veces

Curiosamente, si cambio en overall_header el

Código: Seleccionar todo

<div id="tabs1">

por

Código: Seleccionar todo

<div id="tabs">

vuelvo a la situacion anterior: navbar verde y pestañas grises normales.
No entiendo porque las pestañas se incorporan a la navbar asi que no tengo ni idea de como solucionarlo :S
Ideas?

Publicado: **22 Jun 2011, 15:51**

cientificoloco88 escribió: No entiendo porque las pestañas se incorporan a la navbar asi que no tengo ni idea de como solucionarlo :S
Ideas?

Creo que Ya encontré "lo que falta"
Abrir: styles/prosilver/theme/bidi.css
Buscar

Código: Seleccionar todo

/* CP tabbed menu
----------------------------------------*/
.rtl #tabs {
	margin: 20px 7px -1px 0;
}

.rtl #tabs a {
	float: right;
}

/*.rtl #tabs a span {
	float: right;
}*/

Añadir despues

Código: Seleccionar todo

/* tabbed menu
----------------------------------------*/
.rtl #tabs1 {
	margin: 20px 7px -1px 0;
}

.rtl #tabs1 a {
	float: right;
}

/*.rtl #tabs1 a span {
	float: right;
}*/

Tras este cambio, debes actualizar el tema, debes ir al Panel de Administración (ACP) > Estilos > Temas > Tu estilo > Actualizar

Publicado: **22 Jun 2011, 17:13**

Por fin!!
He insertado el codigo q me decias y sin resultado alguno. Pero luego me he puesto a buscar en todos los .css y en el tweak.css he encontrado referencias a "tabs" asi que he insertado otras iguales para "tabs1" y...ohhh, milagro...funciono!!!
Muchas gracias!!!

Para lo del tema del boton de Facebook teneis alguna idea?

phpBB España Oficial

Boton Facebook y color pestañas navbar

Boton Facebook y color pestañas navbar

Re: Boton Facebook y color pestañas navbar

Re: Boton Facebook y color pestañas navbar

Re: Boton Facebook y color pestañas navbar

Re: Boton Facebook y color pestañas navbar

Re: Boton Facebook y color pestañas navbar

Re: Boton Facebook y color pestañas navbar

Re: Boton Facebook y color pestañas navbar

Re: Boton Facebook y color pestañas navbar

Re: Boton Facebook y color pestañas navbar