Deprecated: str_replace(): Passing null to parameter #3 ($subject) of type array|string is deprecated in /var/www/mybb-es.com/html/inc/class_language.php on line 201
Campos personales como en mybb-es
sahashi   20 Dec, 2012, 8:22 am
#1
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)
Código:
#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
Código:
<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>)
Código:
<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>)
Código:
<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:
Código:
<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
[Imagen: screen.png]
Última modificación: 20 Dec, 2012, 8:54 am por V1K1NGO.
HSSWebs   20 Dec, 2012, 8:54 am
#2
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.
sahashi   20 Dec, 2012, 8:57 am
#3
(20 Dec, 2012, 8:54 am)Steeep escribió: 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
Cluster   20 Dec, 2012, 3:40 pm
#4
Perfecto Big Grin el tutorial, respecto al theme es otro asunto espero que puedas retirarlo Smile

:)
Eloy   15 Feb, 2013, 1:17 pm
#5
me gusta esta modificacion por cierto como hago para ponerlo como campo de perfil perzonalizado y que cada usuario lo pueda modificar
Última modificación: 15 Feb, 2013, 1:38 pm por Eloy.

Aprendiendo cada vez mas
Bewan   15 Feb, 2013, 1:57 pm
#6
Buen tuto!! muchas gracias por compartirlo, Smile
Comunidadb   21 Feb, 2013, 9:00 pm
#7
Muchas gracias por el tutorial, lo probaremos Big Grin
leono90   19 Oct, 2013, 7:22 pm
#8
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.

[Imagen: ezHD7DX.png]

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

[Imagen: dClRKm1.png]
angeluz   19 Oct, 2013, 8:24 pm
#9
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 Tongue

ADiós
leono90   19 Oct, 2013, 8:35 pm
#10
Gracias Big Grin logre Cuadrarlo ambos ! Big Grin pero tuve que aumentar un .ppbox2 :p ahi cambiarle center y al otro dejarlo en left Big Grin Gracias =)
  
Powered By MyBB, © 2002-2024 MyBB Group.
Made with by Curves UI.