Hola a todos bueno, tenia tiempo de no meterme a hacer un foro y ahora que lo estoy haciendo quiera poner los campos del perfil tal y como estan en mybb, entonces me vi en la tarea de hacer algo similar, pero sin usar el codigo que aqui tienen y asi que les dejo este tuto y juzguen si estan buenos o no ;D

Paso 1:
Primero nos vamos a ACP->ESTILOS Y PLANTILLAS->ESTILOS DE TU PLANTILLA->Global.css
Y colocamos de ultimo esto: (en mi caso uso la ID Button ustedes usen lo que les convenga ;D)

#button{
	padding:0;
        list-style:none; 
        overflow:hidden;
        margin:0; 
}
#button li{
	float:left; 
        margin:1px 0px 1px 0px;
        padding:0; 
}

Paso 2:
Ahora se dirigen a ACP->Estilos y Plantillas->Plantillas de su tema->postbit_author_user

Depende de ustedes si quieren borrar todo lo que esta en el postbit_author_user (obiamente haciendo un copia) si quieren que este tal y como en el ejemplo o demo que voy a dejar abajo .

Si lo quieren tal y como esta el demo
1.Para las banderas de plugin hmflags de himura

<div style="background: #FFF; border-radius: 3px; border: 1px solid #ccc; margin: 2px; color: #4a4a4a; box-shadow: 0 1px 0 #FFF; opacity: 0.9;">
	<ul id="button">
		<li>
			<div style="background: #FFF; border-radius: 3px; border: 1px solid #ccc; margin: 2px; color: #4a4a4a; padding: 5px;width:24px; text-align: left; box-shadow: 0 1px 0 #FFF; opacity: 0.9;">
				<a href="javascript:;" onclick="MyBB.popupWindow('misc.php?action=hmflags&amp;cnam=$post[fid4]&amp;pf=4',
				'hmflags', 450, 500);"><img src="{$mybb->settings['bburl']}/images/pais/$post[fid4].png" alt="$post[fid4]" title="$post[fid4]" width="24" height="24"></a> 
			</div>
		</li>

Como podran ver estoy usan listas por tanto si quieren que les salga tienen que colocar sus campos siguientes despues del </li> y cerrar con un </ul></div>

Para el icono de sexo:(agregar despues del ultimo </li>)

<li>
		<div style="background: #FFF; border-radius: 3px; border: 1px solid #ccc; margin: 2px; color: #4a4a4a; padding: 5px;width:24px; text-align: left; box-shadow: 0 1px 0 #FFF; opacity: 0.9;">
          <img src="{$mybb->settings['bburl']}/images/$post[fid3].gif" alt="$post[fid3]" title="$post[fid3]" width="24" height="24"></a>
	    </div>
     </li>  

Para la especialidad:(Agregar despues del ultimo </li>)

<li>
	<div style="background: #FFF; border-radius: 3px; border: 1px solid #ccc; margin: 2px; color: #4a4a4a; padding: 5px; text-align: left;width:24px; box-shadow: 0 1px 0 #FFF; opacity: 0.9;">
		<img src="{$mybb->settings['bburl']}/images/especialidad/$post[fid5].png" alt="$post[fid5]" title="$post[fid5]" width="24" height="24"></a>
	</div>
  </li>	
	</ul>

Esos son 3 campos de ejemplo siquieren agregar otro solo se tienen que basar en la siguiente estructura:

<li> 
     <div style="background: #FFF; border-radius: 3px; border: 1px solid #ccc; margin: 2px; color: #4a4a4a; padding: 5px; text-align: left;width:24px; box-shadow: 0 1px 0 #FFF; opacity: 0.9;">

<img src="{$mybb->settings['bburl']}/images/"campo"/$post[fid5].png" alt="$post[fid5]" title="$post[fid5]" width="24" height="24"></a>
	</div>
  </li>	
	</ul>

Siempre recuerden cambiar sus $post[fid] por la id del campo que quieran poner Y obiamente de cambiar los que estan de ejemplo asi como la url de las imagenes.

Los tutoriales usados para que el postbit se vea asi son:
Globos de Dialogo para el postbit (1 Imagen)
[Tutorial] Recuadros de Postbit con sombra parecido a MyBB-Es

Screenshto

Buen tutorial.
Eso si tendré que quitar el enlace, ya que por lo visto el theme no es comprado & de alguna u otra manera te haces publicidad. Doy aviso a un admin para ver si se permite.

20 Dec, 2012, 8:54 am Steeep wrote:
Buen tutorial.
Eso si tendré que quitar el enlace, ya que por lo visto el theme no es comprado & de alguna u otra manera te haces publicidad. Doy aviso a un admin para ver si se permite.

ok -.- ni sabia que el theme era premium -.- me lo encontre en una web que decia que eran gratuitos y bueno lo descarge XD

Perfecto el tutorial, respecto al theme es otro asunto espero que puedas retirarlo

me gusta esta modificacion por cierto como hago para ponerlo como campo de perfil perzonalizado y que cada usuario lo pueda modificar

Buen tuto!! muchas gracias por compartirlo,

Muchas gracias por el tutorial, lo probaremos

Como haria para centrarlo. ?. por mas que quiero centrarlo no logro hacerlo
solo se me queda ahi. al hacer right solo cambia Mensajes , reputacion . mas no la imagen.




Y ala vez colocar el gracias dentro ... mensajes , reputacion..

Busca en el css del tuto:
#button li...
Quita el
float: left;
y agrega:
display: inline-block

Después en .ppbox cambias el:
text-align: left;
por
text-align: center;
y solucionas lo primero...

Lo segundo es meter la variable del plugin thanks en el ppbox y ya

ADiós

Gracias logre Cuadrarlo ambos ! pero tuve que aumentar un .ppbox2 :p ahi cambiarle center y al otro dejarlo en left Gracias =)