Pestañas en el perfil estilo vbulletin

~EroKenji 19 Dec, 2009, 5:38 pm

Les dire como poner el perfil con las pestañitas de vbulletin aunque ya es cuestion suya modificarlas en colores y como quieren que este ordenado todo.
Quedaria algo asi:
[Imagen: perfilq.png]

Lo primero es subir este archivo a "images->tu tema".

Luego van a "PA->Plantillas y Estilos->Plantillas->Tu tema->Miembro-> member profile" y sustituyen todo por lo siguiente.

Código:
<html>

<head>

<title>{$mybb->settings['bbname']} - {$lang->profile}</title>

{$headerinclude}

</head>

<body>

<script type="text/javascript" src="{$theme['imgdir']}/tabcontent.js">

</script>

{$header}

<table width="100%" cellspacing="0" cellpadding="0" border="0" align="center">

<tr>

<td width="75%" valign="top">

<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder">

<tr>

<td align="left" class="trow1" valign="middle">{$avatar}</td>

<td class="trow1" align="left" width="100%">

<span class="largetext"><strong>{$formattedname}</strong></span><br />

<span class="smalltext">

({$usertitle})<br />

{$groupimage}

<strong>{$lang->registration_date}</strong> {$memregdate}<br />

<strong>{$lang->date_of_birth}</strong> {$membday} {$membdayage}<br />

<strong>{$lang->local_time}</strong> {$localtime}<br />

<strong>{$lang->postbit_status}</strong> {$online_status}

</span>

</td>

</tr>

{$awaybit}

</table>

<br />

<div id="toolbar" class="usertabs"><div id="nav"><ul id="countrytabs" class="shadetabs">

<li><a href="#" rel="country1" class="selected"><b>Mensajes de visita</b></a></li>

<li><a href="#" rel="country2"><b>Acerca de mi</b></a></li>

<li><a href="#" rel="country3"><b>Estadisticas</b></a></li>

<li><a href="#" rel="country4"><b>Contactar</b></a></li>

<li><a href="#" rel="country5"><b>Firma</b></a></li>

</ul></div></div>

<div style="border:1px solid gray; width:100%px; margin-bottom: 1em; padding: 0px">

<div id="country1" class="tabcontent">

<!-- ProfileComments -->{$comments_index}<!-- /ProfileComments -->

</div>

<div id="country2" class="tabcontent">

{$profilefields}

</div>

<div id="country3" class="tabcontent">

<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder">

<tr>

<td class="trow1"><strong>{$lang->joined}</strong></td>

<td class="trow1">{$memregdate}</td>

</tr>

<tr>

<td class="trow2"><strong>{$lang->lastvisit}</strong></td>

<td class="trow2">{$memlastvisitdate} {$memlastvisittime}</td>

</tr>

<tr>

<td class="trow1"><strong>{$lang->total_posts}</strong></td>

<td class="trow1">{$memprofile['postnum']} ({$lang->ppd_percent_total})<br /><span class="smalltext">(<a href="search.php?action=finduserthreads&amp;uid={$uid}">{$lang->find_threads}</a> &mdash; <a href="search.php?action=finduser&amp;uid={$uid}">{$lang->find_posts}</a>)</span></td>

</tr>

<tr>

<td class="trow2"><strong>{$lang->timeonline}</strong></td>

<td class="trow2">{$timeonline}</td>

</tr>

{$reputation}

{$warning_level}

</table>

</div>

<div id="country4" class="tabcontent">

<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder">

<tr>

<td class="trow1"><strong>{$lang->homepage}</strong></td>

<td class="trow1">{$website}</td>

</tr>

{$sendemail}

<tr>

<td class="trow2"><strong>{$lang->pm}</strong></td>

<td class="trow2"><a href="private.php?action=send&amp;uid={$memprofile['uid']}">{$lang->send_pm}</a></td>

</tr>

<tr>

<td class="trow1"><strong>{$lang->icq_number}</strong></td>

<td class="trow1"><a href="javascript:;" onclick="MyBB.popupWindow('misc.php?action=imcenter&amp;imtype=icq&amp;uid={$uid}', 'imcenter', 450, 300);">{$memprofile['icq']}</a></td>

</tr>

<tr>

<td class="trow2"><strong>{$lang->aim_screenname}</strong></td>

<td class="trow2"><a href="javascript:;" onclick="MyBB.popupWindow('misc.php?action=imcenter&amp;imtype=aim&amp;uid={$uid}', 'imcenter', 450, 300);">{$memprofile['aim']}</a></td>

</tr>

<tr>

<td class="trow1"><strong>{$lang->yahoo_id}</strong></td>

<td class="trow1"><a href="javascript:;" onclick="MyBB.popupWindow('misc.php?action=imcenter&amp;imtype=yahoo&amp;uid={$uid}', 'imcenter', 450, 300);">{$memprofile['yahoo']}</a></td>

</tr>

<tr>

<td class="trow2"><strong>{$lang->msn}</strong></td>

<td class="trow2"><a href="javascript:;" onclick="MyBB.popupWindow('misc.php?action=imcenter&amp;imtype=msn&amp;uid={$uid}', 'imcenter', 450, 300);">{$memprofile['msn']}</a></td>

</tr>

</table>

</div>

<div id="country5" class="tabcontent">

{$signature}

</div>

</div>

<script type="text/javascript">

var countries=new ddtabcontent("countrytabs")

countries.setpersist(true)

countries.setselectedClassTarget("link") //"link" or "linkparent"

countries.init()

</script>

</td>

<td><img src="{$theme['imgdir']}/pixel.gif" height="1" width="8" alt=""/></td>

<td width="25%" valign="top">

<table class="tborder" border="0" cellspacing="1" cellpadding="1">

<tr><td colspan="1" class="thead"><center><strong>Mini Estadisticas</strong></center></td></tr>

    <td class="trow1">&nbsp;<FONT SIZE=2><strong>{$lang->joined}</strong><br />&nbsp;{$memregdate}<br />

&nbsp;<strong>{$lang->total_posts}</strong><br />&nbsp;{$memprofile['postnum']} <br /></font></td>

<tr>

<td class="trow2" align="right"><a href="#" rel="country3"><FONT SIZE=2>Mostrar Estadísticas Completas</font></a></td>

</tr>

</table>

<br />{$buddylist}

</td>

</tr>

</table>

{$footer}

</body>

</html>

Luego van a "PA->Plantillas y Estilos->Estilos->Tu tema->Agregar hoja de estilo.
En el nombre ponen "usertabs.css" y seleccionan "escribir mi propio codigo" (aquí es donde cambian el color de las pestañas, ni me acuerdo cuales son pero exprimentenle un poco xD)

Código:
.usertabs {

    margin-left: 0;

    margin-top: 1px;

    margin-bottom: 0;

    list-style-type: none;

    text-align: left;

    font-size: 11px;

}

.usertabs ul {

margin: 0;

padding: 0;

}

.usertabs li {

display: inline;

margin: 0;

}

.usertabs li a {

background: #676767;

color: #FFFFFF;

position: relative;

z-index: 1;

border: 1px solid #939FAE;

border-bottom: 0;

padding: 8px;

text-decoration: none;

}

.usertabs li a:visited {

color: #2d2d2d;

text-decoration: none;

}

.usertabs li a:hover {

color: #FFFFFF;

text-decoration: none;

}

.usertabs li a.selected {

background: #303B4A;

color: #fff;

border-color: #262D35;

}

.usertabs li a.selected:hover {

text-decoration: none;

}

.tabcontent {

background: #FBFCFF;

display: none;

padding: 5px;

border: 1px solid #999;

margin-top: 7px;

}

.box-thing {

background: #f7f7f7;

border: 1px solid #8e8e8e;

padding: 8px;

}

@

media print {

.tabcontent {

display:block !important;

}

}

Chava 19 Dec, 2009, 9:12 pm

ta bueno ya sabia pero no te compliques tanto el estilo usertabs.css lo puedes agregar directamente en la platilla member_profile

dioseva 24 Dec, 2009, 10:54 pm

Bueno amigos yo intente el tutorial y me salio pero en los perfiles la tienen como un contorno blanco o algo asi

miren la captura

[Imagen: 2rz27vr.jpg]

Ignnacio 25 Dec, 2009, 8:56 am

Apreto en las pestañas y no me jala :S

dioseva 26 Dec, 2009, 6:05 pm

Que paso con mi problema del color en el perfil por favor ayudenme!!!!

Stheal 27 Dec, 2009, 4:36 pm

a mi me aparecen las pestañas, pero no el contenido. no se que onda, ayuda por favor.

dioseva 27 Dec, 2009, 5:38 pm

debes de cargar ell archivo que se descarga de mega upload a ka carpeta images de tu directorio

Himura 27 Dec, 2009, 5:41 pm

(24 Dec, 2009, 10:54 pm)dioseva escribió: Bueno amigos yo intente el tutorial y me salio pero en los perfiles la tienen como un contorno blanco o algo asi

dioseva mira busca en el css
.tabcontent
buscas background: #xxxxxx; hay configuras el color de fondo, hay puedes poner otras cosas como los bordes y demas

los que no les funciona bien aseguren de bajar el script en java y de subirlo a su server

dioseva 28 Dec, 2009, 6:43 pm

Muchas Gracias amigo ya lo soluciones no era en background, era en border pero tu ayuda me ayudo a solucionar esto muchas gracias

Perdon por el doble post pero como le cambio el tamaño para que sea mas chiquito es que en otro foro tengo un tema que es de resolucion chica y el perfil al estilo vbulletin se ve como qe muy grande

Última modificación: 28 Dec, 2009, 6:49 pm por klimax[X].

modw 29 Dec, 2009, 6:44 pm

#10

no aparecen las pestañas