[Tutorial] "Recuadrar" los datos del postbit[TUTO][VBULLETIN 3.x]

Pirata-Gatolo

Usuario Nuevo nvl. 1
2 Ago 2009
272
2
17
Sn Fernando
"Recuadrar" los datos del postbit"

untitled.png


He visto que mucha gente pregunta como "recuadrar" los datos que son mostrados en el postbit del usuario, por lo que decidi hacer este pequeño tutorial

Primero tienen que agregar el siguiente codigo en el estilo al que quieran agregar esta modificacion:

AdminCP > Estilos y Plantillas > Administrador de Estilos

Seleccionan el estilo y hacen click en Ir

Al final, donde dice Definición Adicional de CSS, agregan el siguiente codigo:



Código:
.postbit {
	padding-left: 3px;
	padding-right: 0px;
	padding-top: 3px;
	padding-bottom: 3px;
	background-color: #f7f7e6;
	border-top: 1px solid #dedec1;
	border-right: 2px solid #dedec1;
	border-left: 1px solid #dedec1;
	border-bottom: 2px solid #dedec1;
	margin-bottom: 3px;
}

Y editan los colores a su gusto para que queden con el mismo color del estilo que estan usando

Aca tienen una lista con colores HTML: HTML Color Names


Como segundo paso, van a tener que editar la plantilla postbit_legacy o la plantilla postbit [dependiendo cual de las dos usen, la primera muestra los datos de manera vertical, la segunda de manera horizontal]

AdminCP > Estilos y Plantillas > Administrador de Estilos


Buscan una de las dos plantillas anteriormente mencionadas y la editan

Ahora tienen que buscar el siguiente bloque de codigo:


Código:
 <div class="smallfont"> 
                &nbsp;<br /> 
                <if condition="$post['joindate']"><div>$vbphrase[join_date]: $post[joindate]</div></if> 
                <if condition="$post['field2']"><div>$vbphrase[location_perm]: $post[field2]</div></if> 
                <if condition="$post['age']"><div>$vbphrase[age]: $post[age]</div></if> 
                <div> 
                    $vbphrase[posts]: $post[posts] 
                </div> 
                $template_hook[postbit_userinfo_right_after_posts] 
                <if condition="$show['infraction']"><div>$vbphrase[infractions]: $post[warnings]/$post[infractions] ($post[ipoints])</div></if> 
                <if condition="$show['reputation']"><div><if condition="$show['reppower']">$vbphrase[reppower]: <span id="reppower_$post[postid]_$post[userid]">$post[reppower]</span> </if><span id="repdisplay_$post[postid]_$post[userid]">$post[reputationdisplay]</span></div></if> 
                $template_hook[postbit_userinfo_right] 
                <div>$post[icqicon] $post[aimicon] $post[msnicon] $post[yahooicon] $post[skypeicon]</div> 
            </div>




Aca van a tener que encerrar lo que quieran que aparezca con el recuadro con el siguiente codigo:


Código:
<div class="postbit">ACA VA EL CODIGO</div>

Por ejemplo, si quieren encerrar lo que dice "Posts:", editando quedaria asi:


Código:
<div class="postbit">
					$vbphrase[posts]: $post[posts]
				</div>

Ah, para que no les quede un cuadrado vacio si los usuarios no han seleccionado ningun tipo de contacto, deben reemplazar esto:


Código:
[COLOR=#000000][COLOR=#007700]<[/COLOR][COLOR=#0000BB]div[/COLOR][COLOR=#007700]>[/COLOR][COLOR=#0000BB]$post[/COLOR][COLOR=#007700][[/COLOR][COLOR=#0000BB]icqicon[/COLOR][COLOR=#007700]] [/COLOR][COLOR=#0000BB]$post[/COLOR][COLOR=#007700][[/COLOR][COLOR=#0000BB]aimicon[/COLOR][COLOR=#007700]] [/COLOR][COLOR=#0000BB]$post[/COLOR][COLOR=#007700][[/COLOR][COLOR=#0000BB]msnicon[/COLOR][COLOR=#007700]] [/COLOR][COLOR=#0000BB]$post[/COLOR][COLOR=#007700][[/COLOR][COLOR=#0000BB]yahooicon[/COLOR][COLOR=#007700]] [/COLOR][COLOR=#0000BB]$post[/COLOR][COLOR=#007700][[/COLOR][COLOR=#0000BB]skypeicon[/COLOR][COLOR=#007700]]</[/COLOR][COLOR=#0000BB]div[/COLOR][COLOR=#007700]>  [/COLOR][/COLOR]


Por esto:

Código:
[COLOR=#000000][COLOR=#007700]<if [/COLOR][COLOR=#0000BB]condition[/COLOR][COLOR=#007700]=[/COLOR][COLOR=#DD0000]"$post[icqicon] or $post[aimicon] or $post[msnicon] or $post[yahooicon] or $post[skypeicon]"[/COLOR][COLOR=#007700]><[/COLOR][COLOR=#0000BB]div [/COLOR][COLOR=#007700]class=[/COLOR][COLOR=#DD0000]"postbit"[/COLOR][COLOR=#007700]>[/COLOR][COLOR=#0000BB]$post[/COLOR][COLOR=#007700][[/COLOR][COLOR=#0000BB]icqicon[/COLOR][COLOR=#007700]] [/COLOR][COLOR=#0000BB]$post[/COLOR][COLOR=#007700][[/COLOR][COLOR=#0000BB]aimicon[/COLOR][COLOR=#007700]] [/COLOR][COLOR=#0000BB]$post[/COLOR][COLOR=#007700][[/COLOR][COLOR=#0000BB]msnicon[/COLOR][COLOR=#007700]] [/COLOR][COLOR=#0000BB]$post[/COLOR][COLOR=#007700][[/COLOR][COLOR=#0000BB]yahooicon[/COLOR][COLOR=#007700]] [/COLOR][COLOR=#0000BB]$post[/COLOR][COLOR=#007700][[/COLOR][COLOR=#0000BB]skypeicon[/COLOR][COLOR=#007700]]</[/COLOR][COLOR=#0000BB]div[/COLOR][COLOR=#007700]></if>  [/COLOR][/COLOR]

Esto sirve para cualquier version de vBulletin, siempre y cuando lo hagan a mano, ya que si copian y pegan pueden pasar por alto algun codigo que en nuevas versiones falte, como tambien puede haber codigo de mas

Escrito por : Skavenger
 
gracias
pero no me gusta ponerle asi en cuadro
jajajajja
salu2

PD: se viene el mega tutorial para crear foros vbulletin
by jah pablo
entendible 100%