Atascada con el DJ's Dynamic Tab Content

El codigo esta bastante mal, tienes condiciones donde deberia ir la url y cierre de etiquetas donde no deberian.

El codigo que mencionas ni se toca, lo que tienes que modificar es el apartado de abajo, osea:

Código HTML:

<!--TAB 1 CONTENT -->  
<div id="tab1{vb:raw post.postid}" class="tabcontent">  
   
<div class="info">Tab 1 Content:Block A</div>  
<div class="info">Tab 1 Content:Block B</div>  
<div class="info">Tab 1 Content:Block C</div>  
   
</div>

Modificar todos los <!--TAB 1 CONTENT -->, <!--TAB 2 CONTENT -->, <!--TAB 3 CONTENT -->, etc.

Donde <div class="info">Tab 1 Content:Block A</div> es donde colocas cada contenido y recuerda todos los if condition van siempre al principio te doy un ejemplo de como deberia ser cada uno.

Código HTML:

<!--TAB 1 CONTENT -->  
<div id="tab1{vb:raw post.postid}" class="tabcontent">  
   
<vb:if condition="$post['joindate']"><div class="info"><dt>{vb:rawphrase join_date}</dt> <dd>{vb:raw post.joindate}</dd></div></vb:if>  
<vb:if condition="$post['field2']"><div class="info"><dt>{vb:rawphrase location_perm}</dt> <dd>{vb:raw post.field2}</dd></div></vb:if>  
<vb:if condition="$post['age']"><div class="info"><dt>{vb:rawphrase age}</dt> <dd>{vb:raw post.age}</dd></div></vb:if>  
   
</div>

Puedes ir agregan mas segun como lo necesites y tambien puedes borrar si es que no lo necesitas, pero siempre respetando los codigos.

Es un poco tedioso editar todo eso pero con calma y dedicacion lo lograras.

Ojo solo edita los apartados como te mencione arriba los: <!--TAB 1 CONTENT -->, <!--TAB 2 CONTENT -->, <!--TAB 3 CONTENT -->, <!-- TAB 4 CONTENT -->, <!-- TAB 5 CONTENT --> .

A bruta no me gana nadie.

Pero a cabezona tampoco.

He copiado tu ejemplo en mi foro, pero sigue sin salir. El primer puntito negro sigue llevando al index. Tengo que analizarlo despacito porque seguramente algo se me pasa. Duermo un poco y voy a ello.

Gracias kuervo, volveré y te contaré si lo conseguí o no.

Saludos!!

Si modificaste el headinclude y subiste el javascript donde corresponde deberia funcionar, cualquier cosa lo respondes en este hilo.

//Movido a Soporte Para Complementos (Hacks/Mods).

Lamento el incordio, pero aquí estoy de nuevo

He borrado todo y he vuelto al principio.

He resubido la carpeta, le he metido dentro el js que he descargado del link que dan, he vuelto a modificar el headinclude y he copiado el código en el postbit_legacy


Yo pensaba que cada TAB Content se correspondía al contenido de cada uno de los botoncitos, pero todos ellos me siguen llevando al index, tanto con tu código, como con el que he hecho yo.


Me atreví con esta modificación, porque ponía que el nivel de complicación era intermedio, pero a mí esto me supera, creo que necesito tener más base en programación. Sé algo de html, pero este tipo de código no lo entiendo.


Además, el .css está en su sitio, el .js también. Todo metido en la carpeta postbit_tabs en la raiz del servidor, tal como lo explican en las FAQ 5 y 6. En la 7 creo que pone que si sigue sin funcionar, es porque hay que hacer algún tipo de modificación al CSS del foro.
Está todo en inglés y así no es fácil aprender.


No sé, creo que todavía no estoy preparada para meter mano a este tipo de modificaciones. Aunque me tomaré otro descanso y segurié leyendo post en inglés algunas horas más antes de tirar la toalla.

Muchas gracias por tu paciencia kuervo

---------- Actualizado a las 17:35 ---------- Original a las 15:51 ----------



Aquí vuelo, reportando un pequeño avance.

Tal como me había parecido entender, las cajitas no salían porque faltaba una parte del código.
Ahora salen negras, muy feas, pero ya es cuestión sólo de cambiarle los colores hasta que dé con el que necesito.

Hay que copiar el siguiente código en el additional.css

Código:

/* Info Boxes CSS */
.info {
font-size:10px;
font-face:Arial;
color: #CCCCCC;
padding-left: 3px;
padding-right: 3px;
padding-top: 3px;
padding-bottom: 3px;
background-color: #181818;
border-top: 1px solid #000000;
border-right: 2px solid #000000;
border-left: 1px solid #000000;
border-bottom: 2px solid #000000;
margin-bottom: 3px;
}  

El js sigue sin funcionar. Parece que lo ha descargado mucha gente y han bloqueado la descarga directa, por lo que lo he vuelto a bajar de nuevo de la web original, lo he vuelto a meter en la carpeta postbit_tabs, pero los botones siguen marcando el index y no cambian de color.

Otro problema que me surge es que ahora la misma información me sale dos veces en el postbit. Fecha de ingreso, Ubicación y Edad. Supongo que debo quitar la del original, pero eso lo averiguaré luego.




Sigue saliendo feo, en nada se parece al que ponen como muestra en la release, pero poco a poco creo que lo conseguiré. Estoy feliz! =)

Lo voy a instalar en un foro de pruebas que tengo para ir indicandote los pasos a seguir.

Otra cosa importante, actualiza la informacion de tu perfil agregando la url de tu foro.

Mas informacion: vBulletin Hispano - Nuevos Lineamientos

Edito: Estuve mirando tu foro y fijandome en codigo fuente de como tienes puesto el codigo al parecer no me haz hecho caso en nada, la primera parte del codigo no se toca.

Código HTML:

<ul>  
<li><span title="View Tab 1"><a href="#" rel="tab1{vb:raw post.postid}" id="selected{vb:raw post.postid}">&nbsp;</a></span></li>  
<li><span title="View Tab 2"><a href="#" rel="tab2{vb:raw post.postid}">&nbsp;</a></span></li>  
<li><span title="View Tab 3"><a href="#" rel="tab3{vb:raw post.postid}">&nbsp;</a></span></li>  
<li><span title="View Tab 4"><a href="#" rel="tab4{vb:raw post.postid}">&nbsp;</a></span></li>  
<li><span title="View Tab 5"><a href="#" rel="tab5{vb:raw post.postid}">&nbsp;</a></span></li>  
</ul>

Esa parte no se edita para nada, lo tienes que dejar tal cual es por eso que no te toma el .js

Solo tienes que editar los <!--TAB 1 CONTENT --> - <!--TAB 2 CONTENT -->, etc. asi como lo explique arriba.

Otra vez yo, espero que exponer aquí mis avances pueda servir a alguien para algo.

Ya he aprendido a ocultar la información duplicada. Lo he hecho así:

Código:

En el postbit_legacy

<!-- quitar fecha
<vb:if condition="$post['joindate']"><dt>{vb:rawphrase join_date}</dt> <dd>{vb:raw post.joindate}</dd></vb:if>
-->
<!-- quitar localización
                    <vb:if condition="$post['field2']"><dt>{vb:rawphrase location_perm}</dt> <dd>{vb:raw post.field2}</dd></vb:if>
-->
<!-- quitar edad
                    <vb:if condition="$post['age']"><dt>{vb:rawphrase age}</dt> <dd>{vb:raw post.age}</dd></vb:if>
-->

<!-- quitar número de post                
<dt>{vb:rawphrase 'posts'}</dt> <dd>{vb:raw post.posts}</dd>    
-->

Lo he dejado así explicado por si finalmente no consigo realizar bien la modificación y tengo que volver a ponerlo.

Ahora el postbit queda así:
postbit.jpg

Pero me falta conseguir que funcione el js para poder poner todos estos campos distribuidos en cada uno de los puntos, porque si no, esta modificación no tiene mucho sentido.

Ya he preguntado en vBulletin.org para ver si el creador del mod sabe lo que puede pasar, pero si alguien me lo puede explicar aquí en castellano, se lo agradecería mucho, porque llevo con esto ya dos días y realmente estoy muy cansada




**Oops!!! Lo siento, no había visto tu post kuervo, olvidé quitarlo, voy a borrarlo ahora mismo!!

Pues debe ser otra cosa kuervo, porque he vuelto a poner el código original y sigue sin funcionar.

Ya puse la url, disculpa!

Lo e instalado en un foro de pruebas y me ha funcionado perfectamente.

Prueba colocando el codigo que va en el headinclude al final de la plantilla y dejando la url original, osea borra el anterior codigo del headinclude y pega este al final de plantilla.

Código HTML:

<link rel="stylesheet" type="text/css" href="http://www.happydjs.com/postbit_tabs/tabcontent.css" />
<script type="text/javascript" src="http://www.happydjs.com/postbit_tabs/tabcontent.js">
/***********************************************
* Tab Content script v2.2- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
</script>

Nada, tampoco...

No será que el foro tenga desactivado algo por lo que los js no funcionan?? Es muy raro que te haya funcionado a ti a la primera y que a mí no me funcione ninguna solución


Añado la imagen del ftp, para que veas que está todo en su sitio

javascpt.jpg



Edito: Son ya más de las 5 de la mañana en España, ayer me acosté casi a las 7, me duermo de pie.
Si no consigo arreglar esto mañana, lo dejaré todo como estaba. Buenas noches y muchas gracias kuervo.

Saca un nuevo ticket de soporte indicando datos de alguna cuenta que tenga permisos administrativos para editar plantillas.

http://www.vbhispano.com/foros/soporte/nuevo_ticket/

Eso si, lo vere mañana ya que ahora me tengo que ir.

Listo problema solucionado.

El error era del headinclude, reverti dicha plantilla y coloque el codigo del javascript al final de la plantilla header.
Haciendo esto se soluciono el error.

Lo demas duditas va por tu cuenta, me refiero a añadir nuevos campos o eliminar si es que no necesitas alguna de ellas.

1. Un punto importante antes de borrar una tab es que debes eliminar el enlace de la pestaña y tambien el contenido, por ejemplo para eliminar la 5 tab borras.

Código HTML:

<li><span title="View Tab 5"><a href="#" rel="tab5{vb:raw post.postid}">&nbsp;</a></span></li>

y el contenido.

Código HTML:

<!-- TAB 5 CONTENT -->  
<div id="tab5{vb:raw post.postid}" class="tabcontent">  
   
<div class="info">Tab 5 Content:Block A</div>  
<div class="info">Tab 5 Content:Block B</div>  
<div class="info">Tab 5 Content:Block C</div>  
<div class="info">Tab 5 Content:Block D</div>  
<div class="info">Tab 5 Content:Block E</div>  
<div class="info">Tab 5 Content:Block F</div>  
<div class="info">Tab 5 Content:Block G</div>  
<div class="info">Tab 5 Content:Block H</div>  
<div class="info">Tab 5 Content:Block I</div>  
   
</div>

Lo mismo si deseas eliminar mas pestañas, ya con eso estaria todo ok.

Ante cualquier duda o pregunta al respecto, solo comentalo en este hilo.

Hola Ryuk, supongo que serás kuervo cambiado de nombre.

Ahora el js funciona correctamente, el problema es que ha desaparecido lo de las gracias recibidas, lo que salía debajo.

nosale.jpg


He estado también investigando lo que me dijiste sobre lo de no tocar la primera parte del código.
Por lo que he podido ver, es la única forma de que salga el texto al poner el ratón encima. Mira:

Código:

<li><span title="View Tab 2"><a href="#" rel="tab2{vb:raw post.postid}">&nbsp;</a></span></li>

The code in red is your TITLE. It's what will show in the Tool Tip when someone mouseovers one of the tabs. Change this to your liking. I group my tabs by categories like Contact Info, TCG Info, General Info, etc. Do what cha' like.

The code in blue just a non-breaking space added in so people have something to click on. Users will see a background image, but what they'll actually be clicking is this non-breaking space. Change this space if you want to use text for your tabs instead of images. Otherwise just leave it be.


Lo he vuelto a cambiar y funciona perfecto, pero ahora qué hago para que salga el contador de "gracias" tal como estaba antes?

Iniciado por Ryuk

1. Un punto importante antes de borrar una tab es que debes eliminar el enlace de la pestaña y tambien el contenido, por ejemplo para eliminar la 5 tab borras.

Código HTML:

<li><span title="View Tab 5"><a href="#" rel="tab5{vb:raw post.postid}">&nbsp;</a></span></li>

y el contenido.

Código HTML:

<!-- TAB 5 CONTENT -->  
<div id="tab5{vb:raw post.postid}" class="tabcontent">  
   
<div class="info">Tab 5 Content:Block A</div>  
<div class="info">Tab 5 Content:Block B</div>  
<div class="info">Tab 5 Content:Block C</div>  
<div class="info">Tab 5 Content:Block D</div>  
<div class="info">Tab 5 Content:Block E</div>  
<div class="info">Tab 5 Content:Block F</div>  
<div class="info">Tab 5 Content:Block G</div>  
<div class="info">Tab 5 Content:Block H</div>  
<div class="info">Tab 5 Content:Block I</div>  
   
</div>

Lo mismo si deseas eliminar mas pestañas, ya con eso estaria todo ok.

Uff lo he intentado, pero cuando pongo menos de 5 dots, se cambian de lugar. Se suben al lado derecho del avatar.
derecha.jpg

Tendré que inventar contenidos para ponerlos en los bloques? No se me ocurre más información para mostrar

Por cierto, la edad no sale. Me falta algo en el código?

Código:

<vb:if condition="$post['age']"><div class="info"><dt>{vb:rawphrase age}</dt> <dd>{vb:raw post.age}</dd></div></vb:if>

Edito para avisar de que algo raro ha pasado con el hack de dar las gracias. No sólo no sale el contador, si no que además, antes, cuando dabas las gracias, el botoncito desaparecía, pero ahora, doy las gracias y el botoncito sigue ahí

gracias.jpg

Esto es muy raro Ryuk, desde que funciona el js, como te he dicho antes, el contador de "gracias" recibidas ha desaparecido. He mirado en las instrucciones del hack y no veo que haya que escribir nada en el postbit_legacy, así que no entiendo por qué ahora no sale, aunque hayas revertido la plantilla.

Luego, me di cuenta de que daba las gracias, pero el botón no desaparecía, como te he comentado antes.
Pero ahora, me he dado cuenta de que no desaparece en el momento, porque cuando vuelvo a entrar al post, ya no sale :-S

Es decir, que sí desaparece, pero sólo se ve al refrescar la página. Por qué puede ser esto?