JMiur [E]

Somos muchos los que no usamos los nuevos comentarios anidados de Blogger por diferentes razones.

Porque lo intentamos cuando apenas salieron y había tantos problemas que les tomamos antipatía; porque si bien muchos de esos errores se corrigieron hay otro errores que persisten; porque no nos da ganas volver a escribir el CSS y dejar las cosas a nuestro gusto, etc etc. Tantas razones como usuarios existen. Yo soy uno de ellos y la verdad es que tantas ideas y vueltas me quitaron las ganas de usarlos. Además el que se lean desde los feeds en lugar de ser parte del servidor mismo me pareció siempre una tontera ... lenta. Demasiadas vueltas y demasiada falta de control de los resultados para mi gusto.

Sin embargo ...

Un día apareció Felipe con una idea que publicó en NicoNico donde arma los comentarios anidados con las opciones de reply incluidas pero sin el sistema de Blogger, simplemente (no tan simplemente) agregando una serie de códigos a los comentarios normales lo que nos permite, tener tanto control sobre su forma de verse como teníamos antes; es más, colocando esos códigos tal y como los muestra en su entrada, los comentarios se verán igual y sólo habrá que agregarle CSS a los agregados.

La explicación detallada la pueden ver en su página y acá la repetiré acá con las variantes que usé en mi plantilla.

Tal como dice, lo primero es expandir la plantilla y buscar esto que es el formulario de comentarios; allí cambiaremos ese DIV:
<b:includable id='comment-form' var='post'>
<div id='comment-form'>
    .......
</div>
</b:if>
por esto:
<div class='comment-form' id='comment-form-thread'>
Ahora, vamos a tener que modificar el loop donde se muestran los comentarios así que buscamos esto:
<b:loop values='data:post.comments' var='comment'>
  .......
</b:loop>
Básicamente, deberíamos cambiar el contenido y eso debe hacer con cuidado así que sugiero hacer una copia previa:
<b:loop values='data:post.comments' var='comment'>
  <b:if cond='data:comment.inReplyTo'>
    <!--FIX-->
  <b:else/>
    ....... dejamos el código tal como está .......
    ....... y debajo, agregaremos el código extra .......
  </b:if>
</b:loop>
Ese código extra es el que NicoNico muestra en su página en color azul. Acá, dejo el código completo del loop tal como lo uso en este blog, con los agregados que requiere en caso de usar scripts o las personalizaciones propias de esta plantilla.

<b:loop values='data:post.comments' var='comment'>

<b:if cond='data:comment.inReplyTo'>
  <!-- FIX -->
<b:else/>
  <div class='comentariobloque' expr:id='data:comment.id'>
    <div class='comentario-base'>
      <a expr:name='&quot;comment-&quot; + data:comment.id'/>
      <dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
        <b:if cond='data:comment.favicon'>
          <img expr:src='data:comment.favicon' height='16' style='margin-bottom:-2px;' width='16'/>
        </b:if>
        <a expr:name='data:comment.anchorName'/>
        <b:if cond='data:blog.enabledCommentProfileImages'>
          <data:comment.authorAvatarImage/>
        </b:if>
        <span class='autorcomentario'>
          <b:if cond='data:comment.authorUrl'>
            <a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
          <b:else/>
            <data:comment.author/>
          </b:if>
        </span>
        <span class='comment-footer'>
          <span class='comment-timestamp'>
            <a expr:href='&quot;#comment-&quot; + data:comment.id' title='comment permalink'>
              <!-- uso un script para mostrar la fecha relativa -->
              <script type='text/javascript'>fecharelativa(&#39;<data:comment.timestamp/>&#39;);</script>
            </a>
            <b:include data='comment' name='commentDeleteIcon'/>
          </span>
        </span>
      </dt>
      <dd class='comment-body'>
        <b:if cond='data:comment.isDeleted'>
          <span class='deleted-comment'><data:comment.body/></span>
        <b:else/>
          <p expr:id='&quot;combody-&quot; + data:comment.anchorName'><data:comment.body/></p>
          <!-- uso un script para mostrar los emoticones -->
          <script type='text/javascript'>
            cual = &quot;combody-&quot; + &quot;<data:comment.anchorName/>&quot;;
            emoticonComentario(cual);
          </script>
        </b:if>
      </dd>
    </div>
    <div class='contenedor-respuestas'>
      <b:loop values='data:post.comments' var='comentariohijo'>
        <b:if cond='data:comentariohijo.inReplyTo == data:comment.id'>
          <div class='respuestas-comentarios'>
            <div expr:class='&quot;comment-author-thread &quot; + data:comentariohijo.authorClass' expr:id='data:comentariohijo.anchorName'>
              <b:if cond='data:comentariohijo.favicon'>
                <img expr:src='data:comentariohijo.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
              </b:if>
              <a expr:name='data:comentariohijo.anchorName'/>
              <b:if cond='data:blog.enabledCommentProfileImages'>
                <data:comentariohijo.authorAvatarImage/>
              </b:if>
            </div>
            <div class='respuesta'>
              <span class='autorcomentario'>
                <b:if cond='data:comentariohijo.authorUrl'>
                  <a expr:href='data:comentariohijo.authorUrl' rel='nofollow'><data:comentariohijo.author/></a>
                 <b:else/>
                   <data:comentariohijo.author/>
                 </b:if>
              </span>
              <span class='comment-footer'>
                <span class='comment-timestamp'>
                  <!-- uso un script para mostrar la fecha relativa -->
                  <a expr:href='&quot;#comment-&quot; + data:comment.id' title='comment permalink'>
                     <script type='text/javascript'>fecharelativa(&#39;<data:comentariohijo.timestamp/>&#39;);</script>
                  </a>
                  <b:include data='comentariohijo' name='commentDeleteIcon'/>
                </span>
              </span>
              <div class='comment-body'>
                <b:if cond='data:comentariohijo.isDeleted'>
                  <span class='deleted-comment'><data:comentariohijo.body/></span>
                <b:else/>
                  <p expr:id='&quot;combody-&quot; + data:comentariohijo.anchorName'><data:comentariohijo.body/></p>
                  <!-- uso un script apra mostrar los emoticones -->
                  <script type='text/javascript'>
                    cual = &quot;combody-&quot; + &quot;<data:comentariohijo.anchorName/>&quot;;
                    emoticonComentario(cual);
                  </script>
                </b:if>
              </div>
            </div>
          </div>
        </b:if>
      </b:loop>
    </div>
    <b:if cond='data:post.numComments &lt; 200'>
      <a class='reply-action' expr:id='&quot;replyboton-&quot; + data:comment.id' expr:onclick='&quot;reply(&apos;&quot; + data:comment.id + &quot;&apos;);return false;&quot;' href='#'>Responder</a>
    <b:else/>
      <script type='text/javascript'>
        var indexc = &#39;<data:post.numComments/>&#39;
        var indexcomment = &#39;<data:comment.id/>&#39;
        //<![CDATA[
        var indexpage = indexc/200;
        indexpage = Math.ceil(indexpage);
        var indexl = window.location.href;
        indexl = indexl.indexOf("commentPage=" + indexpage + "");
        var replyAction = "<a id='replyboton-" + indexcomment +"' class='reply-action' onclick='reply(&quot;" + indexcomment + "&quot;);return false;' href='#'>Responder</a>";
        if(indexl!=-1) {
          if(indexc < (indexpage*200)) { document.write(replyAction) }
        }
        //]]>
      </script>
    </b:if>
    <div class='contenedorreply' expr:id='&quot;contenedorreply-&quot; + data:comment.id'/>
  </div>
</b:if>

</b:loop>

Último paso; buscamos:
<b:includable id='comments' var='post'>
y justo debajo, agregamos lo siguiente:
<b:if cond='data:blog.pageType == &quot;item&quot;'>
  <script type='text/javascript'>var flagItem = 0;</script>
</b:if>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
  <script type='text/javascript'>var flagItem = 1;</script>
</b:if>
<script type='text/javascript'>
  /* Código bajo Licencia Creative Commons 3.0 (Atribución-No Comercial)
     Felipe @ http://gplus.to/iFelipeCalvo */
  var indexa = &#39;<data:top.id/>&#39;;
  var indexb = &#39;<data:post.id/>&#39;;
  //<![CDATA[
    // Distingue entre post y página estática
    flagItem="0"==flagItem?"&postID=":"&pageID=";
    // ACA VAN LAS DOS FUNCIONES
  //]]>
</script>
Acá hay una variante respecto del código original. Simplemente coloqué las dos funciones del script junto con el resto por razones de comodidad pero es indistinto agregarlas allí o en el head; las dos funciones tsl como las uso, dicen lo siguiente:

<script type='text/javascript'>
//<![CDATA[
function replyOriginal() {
  var b = document.getElementById("comment-editor").getAttribute("src"), a = b.indexOf("#"), b = b.substring(a), a = document.getElementById("comment-editor");
  a.parentNode.removeChild(a);
  a = document.getElementById("replypost");
  a.parentNode.removeChild(a);
  b = "http://www.blogger.com/comment-iframe.g?blogID=" + (indexa + flagItem + indexb + b) + "";
  a = document.createElement("iframe");
  a.setAttribute("id", "comment-editor");
  a.setAttribute("name", "comment-editor");
  a.setAttribute("src", b);
  a.setAttribute("height", "250px");
  a.setAttribute("width", "100%");
  a.setAttribute("frameborder", "0");
  a.setAttribute("allowtransparency", "true");
  document.getElementById("comment-form-thread").appendChild(a)
}

function reply(b) {
  var a = document.getElementById("comment-editor").getAttribute("src"), c = a.indexOf("#"), a = a.substring(c), c = document.getElementById("comment-editor");
  var boton = c.parentElement.getAttribute("id").replace("contenedorreply-", "replyboton-");
  if(document.getElementById(boton).innerHTML=="Cancelar") {
    document.getElementById(boton).innerHTML="Responder";
  }
  if(c.parentElement.getAttribute("id").indexOf(b)>=0) { replyOriginal();
    return;
  }
  c.parentNode.removeChild(c);
  a = "http://www.blogger.com/comment-iframe.g?blogID=" + (indexa + flagItem + indexb) + "&parentID=" + (b + a) + "";
  c = document.createElement("iframe");
  c.setAttribute("id", "comment-editor");
  c.setAttribute("name", "comment-editor");
  c.setAttribute("src", a);
  c.setAttribute("height", "250px");
  c.setAttribute("width", "100%");
  c.setAttribute("frameborder", "0");
  c.setAttribute("allowtransparency", "true");
  document.getElementById("contenedorreply-" + b + "").appendChild(c);
  document.getElementById("replyboton-"+b).innerHTML = "Cancelar";
  document.getElementById("replypost") || (b = document.createElement("a"), b.innerHTML = "Agregar un comentario", b.setAttribute("id", "replypost"), b.setAttribute("class", "LoadMore"), b.setAttribute("href", "#"), b.setAttribute("onclick", "replyOriginal();return false;"), document.getElementById("comment-form-thread").appendChild(b))
}
//]]>
</script>

Y por último, como siempre, el CSS antes de </head> que,como dije, sólo requiere que se agreguen las nuevas reglas y que dependerán totlamente del blog donde se agregaue esto asi que me limito a enumerarlas:
<:style>
  .respuestas-comentarios {}
  .comment-author-thread {}
  #comments .contenedor-respuestas .avatar-image-container {}
  .contenedor-respuestas {}
  .comment-body-thread {}
  .comment-body-thread p {}
  .reply-action {}
  #replypost {}
<:/style>

¿Problemas? Pocos por no decir ninguno. Un detalle menor impide que cuando hay más de 200 comentarios, las funciones de "Responder" sólo se muestren en la ultima página, es decir, en esa donde se encuentran los comentarios más recientes pero, salvo condiciones muy particulares, es un detale que no me parce que tenga relevancia alguna.

142 comentarios:

Felipe  

Me alegra mucho ver el sistema de comentarios anidados funcionando de lujo aca en tu casa, gracias por compartirlo con tus visitantes y lectores.

Gem@  

Entonces Felipe y NicoNico son la misma persona?? y se asombran que Gem@ Y Julia también lo sean :)
Muy bueno tu trabajo Felipe, yo soy una de las que no quiere saber nada de cambios hasta que no se demuestra que funciona correctamente y en este caso está sobradamente demostrado :)

JMiur  

Gracias por mostrarme el truco, Felipe. Tardé en ponerlo pero acá está :D

¿Serán cómo Doctor Jekyll y Mr Hyde Doña GemaJulia? :D

Felipe  

Es todo un problema complejo de tripolaridades e impulsos espontáneos de creación de cuentas de correo, afortunadamente nada grave para la salud. :D

JMiur  

Se llama esquizofrenia 2.0, Felipe y no es grave pero es incurable :D

Gem@  

Enfermedades modernas diría los abuelos, el causante de esta doble personalidad es el gran Google que le gusta enterarse de todo y enterarse bien.

Responder
♥ Ana  

¡¡Que bien!!, ésto es lo que quería,pero me pasa algo muy raro, cuando le doy a vista previa, en la cabecera del blog, encima del nombre de mi blog se ven todos los símbolos y letras del último código que pones, es decir, éste:



.respuestas-comentarios {}

.comment-author-thread {}

#comments .contenedor-respuestas .avatar-image-container {}

.contenedor-respuestas {}

.comment-body-thread {}

.comment-body-thread p {}

.reply-action {}

#replypost {}

He probado con el mismo código de Felipe por ai había algo diferente a el tuyo y es lo mismo, me salen todos los símbolos en la cabecera del blog
Lo he probado en mi blog de pruebas y en mi blog principal y pasa lo mismo en los dos
También he probado, poniendo solo ese código, es decir, sin añadir todo lo demás del truco, simplemente para ver si "la culpa" es solo de ese trozo de código y, efectivamente se sigue viendo en la cabecera del blog, así que he tenido que quitarlo, no se si sabes tú a que es debido y me puedes ayudar, imagino que será por alguna cosa que tengo puesta en mi blog

Un abrazo y gracias por el truco

JMiur  

Eso del final son las reglas básicas de estil oque deberían usarse para personalizarlos. Deben ir entre etiquetas <style> y </style> o dentro de <b:skin> </b:skin>

♥ Ana  

He probado poniéndolo como dices y , ese problema se arregló, muchas gracias, ahora toca a ver si puedo ponerlo todo bien sin fastidiar nada en el blog porque , con todo lo que tengo modificado en la zona de comentarios no se si sabré hacerlo bien
Un abrazo

JMiur  

Perfecto, Ana. Lo que falta, es cosa de paciencia :D

♥ Ana  

JMiur, vengo toda contenta, jejejje, como tenía algún problemilla porque no me salía esto he estado probando para hacerlo en un blog de pruebas , al tener activado el nuevo sistema de Blogger, he tenido que quitar unos cuantos códigos, con un poco de miedo, jajajaja, pero, nada, ¡¡lo he hecho y funciona bien!!, me ha costado pero ha salido

Ahora viene una duda que tengo, en mi blog de verdad, creo que tengo algunas cosas mal hechas porque he querido pegar esa plantilla en un blog de pruebas y me sale error, entonces quería rehacer toda la plantilla en el blog de pruebas y cuando todo esté hecho, quería llevar la plantilla a mi blog real y eliminar la plantilla que tengo ahora , y mi pregunta es, ¿simplemente copio la plantilla del blog de pruebas con todo ya puesto y la pego en mi otro blog?, creo que te voy a liar con tantas palabras

Bueno, voy a seguir dándole vueltas a todo, jejeje, saludines

JMiur  

Es posible hacer eso pero, a veces, puede haber problemas así que siempre conviene copiar por partes.

Trata de copiar el contenido completo de los includables y reemplazarlos en lugar de copair toda la plantilla.

Sea como sea, antes, haz una copia de seguridad de la plantila original.

♥ Ana  

Hola de nuevo, siempre hago la copia de seguridad de la plantilla por lo que pueda pasar, jejejje
Ayer me animé a hacer éste truco en mi blog original y no salió , me daba error, y no se por qué, así que , de momento, lo he dejado, a ver si más adelante tengo ganas de volver a la carga, te desesperas cuando las cosas no salen bien y, luego un día, te vuelves a poner a hacerlo y ¡¡sorpresa!! sale a la primera
Solo una pregunta más; para quitar totalmente el código que maneja los comentarios anidados de Blogguer,¿hay que cambiar todas las líneas de la plantilla que contengan ésto?
<b:if cond='data:post.showThreadedComments'>

            <b:include data='post' name='threaded_comments'/>

          <b:else/>

            <b:include data='post' name='comments'/>

          </b:if>

        </b:if>
¿Por ésto otro?


            <b:include data='post' name='comments'/>

          </b:if>

      
Gracias por tus ayudas y consejos, siempre son bienvenidos
Abrazos

♥ Ana  

Olvida todo lo que te he dicho en el anterior comentario ¡¡lo hice!! ya está bien, ainsssss ¡¡no me lo puedo creer!!, jajajaja, miles de gracias, ésta vez me ha salido a la primera, sin errores de ningún tipo, ¿ves lo que te decía?, a veces, es mejor dejar las cosas para otro momento en el que no estemos ofuscados, jejeje
Bueno, y , para no variar tengo otra pregunta o, mejor dicho, dos preguntitas de nada, jajajaja, vamos con la primera:

Hace tiempo puse más ancho el formulario de comentarios gracias a una entrada tuya, en concreto es ésta:
http://vagabundia.blogspot.com/2008/11/el-formulario-de-comentarios-un-poco-ms.html
Y, ahora, se vuelve a ver el formulario mas pequeño ¿puedo hacer algo para que vuelva a estar ancho?

Ahora vamos con la segunda:
Cada respuesta que escriben en los comentarios de mi blog, sale enmarcada pero, ahora, si le doy a responder no se enmarca esa respuesta, solo pasa al darle a responder, bueno pues eso es todo
Estoy contenta, parece mentira con que poco me contento, jajaja

Bueno, creo que , de momento, no te pregunto nada más, vas a acabar aburrido de verme por acá, jejeje
Miles de abrazos

JMiur  

OK. Me olvido :D

Para el ancho del formulario, prueba agregando esta regla y me avisas si requiere algún ajuste extra:

.comment-form {max-width: 100% !important;}

No veo que las respuestas se enmarquen en ningún caso. Si quieres que se vean con el borde que tienen los comentarios "originales", le debes colocar ese borde a esta regla:

.comment-body-thread {
border: 2px ridge #EA9999;
.......
}

♥ Ana  

¡¡Madre mía!!, ¿hay algo que tú no sepas respecto a éstos temas "bloggeriles"? jajaja, genial, ha quedado genial, era lo que quería, el borde (al decir enmarcados, quería decir con borde)y la anchura, ¡¡estupendo!!, fíjate, te voy a mandar un besote ¡¡muak!! hala, hoy estoy generosa, jajajaja
En serio, muchas gracias, tengo alguna otra cosilla que preguntarte pero, si te parece, te dejo respirar ésta noche y te lo pregunto mañana
Buenas noches y mañana sigo con el tema en cuestión, la verdad es que impresiona ver todo lo que sabes de éstas cosas

JMiur  

Gracias Ana. Una exageracion de tu parte pero se agradece igual :D

♥ Ana  

Ya vuelvo, vamos por partes

1-quería poner "responder" en un botón, similar al tuyo, con un borde como el resto de mis comentarios
2-¿puedo desplazar la fecha de debajo de los comentarios y la papelera hacia la derecha para que no quede encima de la palabra "responder"?, es decir, que quede todo en la misma línea
3-he notado que las letras que salen en los comentarios al "responder" son más grandes que las del resto de comentarios, me gustaría que quedaran del mismo tamaño
4-al pinchar en "responder" en el rectángulo de los comentarios que se abre no puedo poner los emoticones, pongo los símbolos pero, no se ven las imágenes

Creo que eso es todo, un abrazo

JMiur  

Veamos si es posible reesponder eso:

1. Para cambiar el enlace responder debes colocarle las propiedades en una regla casí:
.reply-action {}
allí defines lo que quieras, colocres, fondos, etc.

2- Puedes alinear el texto de la fecha en esta otra regla:
#comments-block .comment-footer {}
agregando la propiedad text-align:right;
ahi puedes establecer o cambiar otros datos que ya tiene como el padding, el tamaño del texto, etc

3. Para el tamaño de las respuestas, agrega font-size: 15px; en la misma regla donde has puesto el borde:
.comment-body-thread {
border: 2px ridge #EA9999;
font-size: 15px;
}

4. El tema de losemoticones, imagino que sería cambiando el script. Como n ousas el mismo que yo, trato de adivinar y deducir.
Ahora, en function addSmiley(dummy) dice esto:

var d = [], i=0, def = ['post-body','entry-content','comment-body','blog-author-comment'];

e imagino que habría que agregarle la nueva clase comment-body-thread:

var d = [], i=0, def = ['post-body','entry-content','comment-body','comment-body-thread','blog-author-comment'];

♥ Ana  

Ahora estoy con ello, de momento ya he hecho varias cosas, entre ellas, lo de los emoticones, que es tal y como me lo has dicho ¡¡perfecto!!, y, respecto a los emoticones, no uso los mismos que tú ,cogí el truco en el blog de Rosa y, en fin, ella ya no está, por eso te lo pregunté a ti, espero no molestar con ello, suelo preguntar en el mismo blog de donde cojo los trucos pero, ésta vez no es posible

De momento, he quitado la fecha porque no me acababa de gustar como quedaba, estoy mirando alguna otra forma de ponerla, a ver si puedo solucionarlo.

Muchas gracias por tus respuestas, como siempre muy acertadas
Un saludo

JMiur  

Si los emoticones andan, todo resuelto, el sistema no importa, en este caso, solo advertía que como no lo uso ni lo he probado, la respuesta era una suposición y nada más :-)

♥ Ana  

JMiur, hola de nuevo, ya he hecho todo lo que te pregunté y me gusta el resultado, también he hecho alguna cosilla más por mi cuenta, jugando un poco con lo que he aprendido en tu entrada, aún quiero probar a hacer otros pequeños detalles, a ver si me salen

Se me había olvidado comentarte que yo no veo tus emoticones, se ven en los comentarios pero no los veo en el formulario de comentarios

Y, otra cosa, solo por curiosidad y por aprender un poco más , Felipe, pone en su entrada que hay que poner el último código antes de:
]]></b:skin>
y tú, dices de ponerlo antes de:
</head>
¿cuál es la diferencia entre ponerlo en uno u otro lugar?

Saludos

JMiur  

Los emoticones no se muestran en el formulario, sólo en el comentario publicado, por eso no los ves, simplemente, no los puse ahí.

En cuanto al último código, me imagino que te refieres a las reglas de estilo.

Puestas de ambos modos será igual. Prefiero ponerlas separadas para poder condicionar esa parte y cargarla sólo en las páginas de entradas ya que en otras páginas no son necesarias.

Responder
Yurika-Chan  

En estos momentos estoy retocando la plantilla así que es una muy buena oportunidad para probar, ya lo implementaste???, quiero ver como funciona!!!

Yurika-Chan  

Bueno ya lo implemente y funciona, y muy bien, mejor que el de Blogger, lo unico es que estoy teniendo problemas con el CSS en algunas partes...

JMiur  

Funciona mejor que el de Blogger, sin duda. No sé que parte del CSS es la que te da problemas, deberías indicarme cuá y dónde puede verse proque eso depende de cad sitio en aprticular.

Responder
Snake  

Wow! Los han implementado genial.

Responder
Yurika-Chan  

Lo estoy probando en este blog http://dinamodeprueba.blogspot.com/, el problema es en el nombre del autor del comentario cuando deja una respuesta, no logro dejarlo igual al otro

JMiur  

Vi que Felipe te ha dado una solución modificando levemente el codigo ¿eso lo ha solucionado?

Yurika-Chan  

No, no cambia en nada el estilo con esa solución!!, el que ya pude arreglar fue el de los emociones.

JMiur  

Eso ocurre porque dentro del div class='respuesta', el nombre del autor y el texto adjunto carecen de clase y por lo tanto, se ven como enlaces normales.

Coloca todo ese código dentro de una etiqueta SPAN que tenga la misma clase que usas con los otros;

<span class='comment-author'>
....... aca el enlace al autor y la palabra respondió o la que quieras utilizar
</span>

Yurika-Chan  

Perfecto, eso era lo que hacia falta, también le puse otras clases para que quedará mejor y funcionó, ahora si me gusta como se ve todos, muchas gracias JMiur por siempre ayudarme!!!

JMiur  

Me alegra que se arreglara :D

Responder
Syd  

Pues vaya que agiliza la carga de la pagina, hice un test antes y despues de implementar estos codigos, y la diferencia es notoria:

http://3.bp.blogspot.com/-nhdXZzWWts0/T0wTEqRGPwI/AAAAAAAAApY/4h0tAkLsU2w/s1600/captura.jpg

Muchas gracias a Felipe y a ti, JMiur, que garcias a tus genialidades mi blog trabaja y luce mejor :D


Pregunta aparte... he leido en algunos blogs que el problema que hacia que este tipo de comentarios no funcionara en IE estaba corregido, esto sin necesidad de aplicarle los cambios a scriptaculous, ¿es asi? porque a mi siguen sin funcionarme las respuestas en el navegador de bulbos aquel.

JMiur  

También leí eso pero no sabría decirte si funcionan o no porque hace tiemp oque abandoné el intento de usarlos así que este modelo, me ha venido perfecto.

Syd  

La verdad es que esta mucho mas configurable, genial trabajo de Felipe, y sobre IE, pues nada, a seguir esperando que le pase lo mismo que al pajaro Dodo.

Gracias, JMiur!

JMiur  

Sí. Excelente trabajo de Felipe. Muy configurable, habrá que seguirlo investigando y además, funciona bien en IE :D

Responder
Emilio Cobos Álvarez  

Impresionante, JMiur, el trabajo es maravilloso.

JMiur  

Sí, Emilio: Excelente trabajo de Felipe; me gustó apenas lo vi.

Responder
Abraham Santos Fernández  

¿Dónde pongo los códigos de esta entrada? Lo que pasa es que no tengo ninguno de los códigos que aparecen en esta entrada. Mi página es Músicos Unidos.

JMiur  

Todos estos códigos están en cualquier plantilla de Blogger:

&ltb:includable id='comment-form' var='post'&gt
&ltb:loop values='data:post.comments' var='comment'&gt
&ltb:includable id='comments' var='post'&gt

debes expandir los artilugios para verlos.

Responder
Gizaa Veiga  

Gracias eternas mestre!
Consegui adicionar estilos até mesmo para os meus comentarios nas respostas (destacar o comentário do autor do blog), ficou perfeito ♥

Dá uma olhadinha?

[ ]s

JMiur  

Me gusta. Quedó muy bien :D

Responder
Joker  

Llevo unos días usando este tip y todo genial, es un pasote. Aunque me gustaría hacer que los anidados no salgan solapados, mira cómo se ven en mi blog: http://bit.ly/x9oJtb

No sé cómo hacer para que salgan debajo. A ver si puedes echarme un cable. Gracias por adelantado.

JMiur  

Eso ocurre porque hay un exceso de propiedades float que son innecesarias; por ejemplo, la que está en:
#comment-header { }
Tampoco es necesaria la de #comments-block3 {}

float es una propiedad que debe ser utilizada con cuidado.

Joker  

Muchísimas gracias JMiur, solucionado. Y de ahora en adelante procuraré usar mejor la propiedad float.

JMiur  

Perfecto, Joker. Me alegra que se arreglara :D

Responder
♥ Ana  

Buenos días JMiur, he intentado solucionar una cosilla en mi blog, pero no he dado con la solución y, para no variar, acudo a ti
Es un tema sobre los comentarios anidados, por eso lo escribo aquí, por si le puede ayudar a alguien más tu respuesta.
Cuando respondo en los comentarios anidados, el borde de dicho comentario queda superpuesto a mi avatar, sin embargo, en los comentarios "normales" (no se como llamarlos), el borde queda por debajo del avatar, quizás es una tontería pero me gustaría poder arreglarlo si tú me ayudas con ello
Un abrazo

JMiur  

Agrega estas dos propiedades a esta regla a ver si eso lo resuelve:

#comments-block .avatar-image-container img
.......
position: relative;
z-index: 1000;
}

♥ Ana  

Has dado con la solución, ya está resuelto.

Muchas gracias , que pases un buen día

Responder
CUENTAGOTAS  

Jorge he implementado este hack y funciona muy bien sin embargo se perdio la numeración, ¿como debo hacer para numerar los comentarios nuevamente?, gracias.

JMiur  

No sé en que blog l oestás haciendo. La nuemeración de los comentarios no deberia desaparecer y l oque sí hace falta es agregarle la regla para las respuestas:

#comments-block .respuestas-comentarios:before {
..........
}

Responder
CUENTAGOTAS  

Jorge algo anda mal en el hack hecha un vistazo a ver que sucede por favor http://rockpop70sy80s.blogspot.com/2010/07/mix-ochentas-vol-9-by-dj-jorge.html#comment-form
no lo puedo arreglar a pesar de seguir todos los pasos.
Gracias por tu ayuda

JMiur  

Esto es lo que se muestra al ingersar a tu blog así que, no lo he visto: captura

CUENTAGOTAS  

lo que sucede Jorge es que al darle un click en responder me envía arriba de la página y no abre el cuadro del comentario, espero puedas hacer algo al respecto y gracias por tu tiempo.

JMiur  

OK pero, para que pueda verto, tienes que solucionar el acceso ya que el navegador lo detecta como un sitio peligroso e impide el acceso:

"Este sitio web en rockpop70sy80s.blogspot.com ha sido reportado como una web atacante y ha sido bloqueado basándose en sus preferencias de seguridad."

Responder
CUENTAGOTAS  

Jorge, ante todo mil disculpas por la tardía respuesta.

Lo he logrado solucionar pero no en el blog de pruebas que estaba contaminado :S, puedes mirarlo acá http://ritmosymelodiasecuador.blogspot.com/2010/03/paco-godoy-super-fiestero.html

ahora el problema que tengo es que en las los gadgets que usan expandir y contraer no funcionan excepto en las páginas individuales, no tengo la menor idea de lo que sea :'(, ayuda loco por favor.

Gracias

JMiur  

Lo que ahí no parece estar funcionando es Prototype+Scriptaculous; prueba cargarlas de manera directa o verifica la versión.

CUENTAGOTAS  

Gracias Jorge ya logré solucionarlo, ahora por favor ayúdame con la numeración de los comentarios como debo hacerlo o en que entrada me guío.

Gracias una vez más :)

JMiur  

Básciamente, sería así:

#comments-block {counter-reset: contadorcomentarios;}
#comments-block dt{position:relative}
#comments-block dt:before {
content: counter(contadorcomentarios, decimal);
counter-increment: contadorcomentarios;
position: absolute;
right: 0px;
top: 0px;
}
#comments-block .respuestas-comentarios{position:relative}
#comments-block .respuestas-comentarios:before {
content: counter(contadorcomentarios, decimal);
counter-increment: contadorcomentarios;
position: absolute;
right: 0px;
top: 0px;
}

Responder
CUENTAGOTAS  

Gracias Jorge, ha quedado perfecto, ahora tengo que cambiar colores para personalizarlo y solo resta un pequeño detalle más que quiero pedirte, ¿como hago para que la numeración se vea en iexplorer?.

Gracias Amigo y perdona la constante fregada ;)

JMiur  

No veo que haya ningún problema en Internet Explorer, se ven perfectamente salvo que estés usando versiones anteriores a IE8

CUENTAGOTAS  

Que raro Jorge, yo logro ver tu numeración en IE9 pero no la mía. :D

Responder
Graciela  

Tengo dos → <b:loop values='data:post.comments' var='comment'>
<div class='loscomentarios' expr:id='data:comment.id'>
<a expr:name='&quot;comment-&quot; + data:comment.id'/>
<b:if cond='data:comment.authorUrl == &quot;http://www.blogger.com/profile/06388548438772111775&quot;'>
<dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
<b:if cond='data:comment.favicon'>
<img expr:src='data:comment.favicon' height='16' style='margin-bottom:-2px;' width='16'/>
</b:if>

y → <b:loop values='data:post.comments' var='comment'>
<dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
<b:if cond='data:comment.favicon'>
<img expr:src='data:comment.favicon' height='48px' style='margin-bottom:-3px;' width='48px'/>
</b:if>
<a expr:name='data:comment.anchorName'/>
<b:if cond='data:blog.enabledCommentProfileImages'>
<data:comment.authorAvatarImage/>

Me causa gracia, alguien alguna vez me dijo que tenía la plantilla 'muy tocada' ;)

JMiur  

El LOOP está en este includable:
<b:includable id='comments' var='post'>

da la impresión que el que se muestra en Palomas es el primero ... no sé de dónde sale el segundo loop :D

Graciela  

No sabés??? menos yo jejeje, muchas gracias ahora pruebo y repruebo :)

Graciela  

<b:loop values='data:post.comments' var='comment'>
<b:if cond='data:comment.inReplyTo'>
<!--FIX-->
<b:else/>
....... dejamos el código tal como está .......
....... y debajo, agregaremos el código extra .......
</b:if>
</b:loop>

cuando decís dejamos el código como está te referís al que tengo en la plantilla?

JMiur  

Sí, exacto. Lo que debe hacerse es "rodear" el código actual con esa condición.

Responder
Lluvia  

Buenos Días.

Recibe un cordial saludo.

Primero que nada, es mi deseo darte las gracias por este maravilloso blog que ha servido de apoyo para muchas personas como yo, que no tenemos conocimientos avanzados pero hacemos lo posible por tener un blog bonito, ¡Infinitas gracias!

Abusando de tu generosidad, deseo preguntarte por una dificultad que se me presentó al implementar este código: los cajones de comentarios se pegan el uno al otro sin importar si son comentarios o respuestas a comentarios... (puedes ver lo que sucede en este artículo http://www.amanecerbajolalluvia.com/2012/03/crees-que-ganas-mucho-discutiendo.html)

:( La verdad no sé qué es lo que está pasando y mis conocimientos en el área son escasos. Te agardecería, si es posible, que me ayudaras con ello.

Que una lluvia de éxito caiga sobre tu vida.

Atentamente,
Lluvia

JMiur  

Lo que ocurre es que los divs flotan y no están dimensionados; simplemente, elimina el float:left que está en esta regla:

#comment-header { ....... }

Lluvia  

Hola, buenas tardes.

Recibe un cordial saludo.

¡Muchas gracias! Te quedo infinitamente agradecida, ya lo he aplicado y me ha quedado absolutamente maravilloso :) ¡Gracias nuevamente.

Amablemente,
Lluvia

JMiur  

Perfecto :D

Responder
Peter  

Hola Jmiur, muchas gracias... muy bueno, ya lo implementé.. tengo que seguirle trabajando... tienes alguna sugerencia para mejorar el CCS...a los principiante nos da muy duro

JMiur  

No. Eso es algo muy personal. Sólo hay que probar y ver que sale.

Responder
ELSACERDOTE2011  

Hola JMiur. He implementado los códigos sin problema y todos cerraron bien. La cuestión ahora es "COPIARTE EL ESTILO TUYO" claro si no tienes inconveniente o me quieras cobrar derechos intelectuales, jajaja ya que no tengo un mango. El asunto es si puedes pasarme los parámetros de colores y las cajas de comentarios para hacer algo parecido, quizás buscaría redondear las cajas. Pero en realidad me fascina tu estilo y yo te conté en otro momento que tienes un estilo muy similar al mío, austero, discreto y señorial. Puedes ayudarme? Donde agregar y que y si se te ocurre sugerencias, también. Estoy abierto al diálogo franco y directo.- Mi blog : http://crochetporelmundo.blogspot.com/ es el primero de 7 en total que ya te iré mencionando para que veas como van quedando y si te gustan. Espero comentarios. Gracias por tu paciencia.

JMiur  

Sería una tontera de mi parte prohibir lo que no puedo impedir. En este blog, todo está a la vista.

ELSACERDOTE2011  

Como dije, los códigos los inserté perfectamente pero en la entrada no me aparece lo que está ACÁ DE LA FORMA QUE ESTÁ y lo que colocas dentro de <:style>
.respuestas-comentarios {}
.comment-author-thread {}
#comments .contenedor-respuestas .avatar-image-container {}
.contenedor-respuestas {}
.comment-body-thread {}
.comment-body-thread p {}
.reply-action {}
#replypost {}
<:/style>
como recién estoy ingresando al mundo del HTML (lo mío antes era CLIPPER, y esto fue hace 20 años) no se que poner dentro de las llaves.-
No te pido marques mi estilo, sino que me guies para poner los códigos dentro de las llaves.
Gracias

ELSACERDOTE2011  

Tampoco puedo mantener este cuadro de publicar fijo a la vista como pasa aquí, en el blog de prueba hice unos cuantos comentarios y cuando cierro y abro para ver, solo me pone "3 comentarios" pero no quedan desplegados como los tienes tú. Que solución tiene?
Gracias

JMiur  

No hay manera de indicarte qué propiedades CSS colocar (es eso que debe ir entre las llaves) sin saber qué quieres hacer. Allí se colocan las propiedades de color, fondo, margen, fuentes o lo que se desee.

No sé cuál ese ese blog de pruebas porque el único que veo es este y allí se muestran los comentarios con el código "normal" de Blogger para los anidados.

ELSACERDOTE2011  

Estimado amigo: El blog que entraste es el de PRUEBA y en ese tengo los 3 comentarios pero NO SE MUESTRAN COMO ESTOS TUYOS QUE QUEDAN DESPLEGADOS Y AL FINAL LA CAJA QUE TIENES PARA PUBLICAR COMENTARIOS, con todos esos mensajes como "¿Quiere dejar un comentario?.....etc. Puedes orientarme en el código para que quede así? Gracias, un abrazo.-

JMiur  

No se ve igual porque, como te dije, no estás usando el sistema que indica este post sino los comentarios de Blogger por defecto sobre los cuales, el control es escaso. Puedes mirar estas otras ters entradas: 1, 2 y 3.

Responder
Obed Calva  

JMiur Que bien se ven estos comentarios, solo me queda una duda como puedo poner la fecha abajo del nombre y separar el avatar del nombre del autor?

JMiur  

¿Tienes un ejemplo que pueda verse? Son detalles que dependen del contexto donde esté puesto el código.

Obed Calva  

Estoy tratando de hacer eso en mi blog de pruebas http://otrasawesome.blogspot.com

Lo único que los comentarios son algo parecidos a los tuyos espero que eso no te moleste.

JMiur  

Para mover la fecha debes buscar el contenido de comment-footer:
<dd class='comment-footer'>
.............
</dd>
y moverlo para que queda arriba de comment-body o en cualquier parte que quieras ubicarlo.

Las propiedades del nombre se encuentran en .autorcomentario{} no sé a que te refieres con exactitud con separarlo, si es moverlo a la derecha, aumenta el valor de padding-left

Obed Calva  

Gracias JMiur, mi plantilla quedo de lujo.

Responder
Kaduh Santos  

Es impresionante JMiur. Excelente trabajo de Felipe, estoy experimentando en el blog de pruebas para más tarde incluirlo en la principal. Pero antes quería incluir una acción de cancelar. Como puedo incluirlo?

Desde ya le agradezco mucho.

JMiur  

El script que muestra esta entrada incluye esa posibildiad.

Responder
Yurika-Chan  

JMiur hoy me di cuenta de un problemilla, a llegar a los 200 comentarios la opción de responder desparece, no me habia dado cuenta antes por que no tenia tantos comentarios en una entrada, que puede estar fallando

JMiur  

No existe problema con el script y la paginación; puedes verlo acá.

Lo que existe, es un problema con Blogger y la paginación de comentarios que es lo primero que debes resolver. El sistema que utilizo es el que indica Oloblogger en esta entrada

Yurika-Chan  

A mi me muestra las paginas de los comentarios sin problema, el asunto que en la primera pagina, que tiene los 200 comentarios, no puedo responder a ninguno, es decir, no aparece la opción de responder, pero si paso a la pagina 2 ahí si aparece

JMiur  

Ahora entiendo. Sí. Esa es una limitación del script. Tendrias que preguntarle a Emilio si ha encontrado una solución a ese tema si es que tal solución existe.

Magoplup  

JMiur ¿has visto el blog del potro? allí en ciudadblogger veo que hay entradas con más de 300 comentarios y la opción de Responder sigue apareciendo quizás es por la forma de presentar los comentarios ya que no los pagina solo los continua de 200 en 200 tal vez sea esa la solución es solo un dato ya sabes que de esto son ustedes quienes saben :)

JMiur  

Porque lo que debe estar usando son los comentarios anidados de Blogger. No creo que la limitación a la que se hace referencia tenga algún tipo de importancia práctica.

Responder
Obed  

Que tal JMiur perdón por molestarte tanto, pero tu eres el que sabe... estoy tratando de poner los emoticones de esta entrada http://vagabundia.blogspot.com/2007/08/blogger-y-los-emoticones.html pero no funcionan en las respuestas, se puede solucionar?

JMiur  

Lo que muestra esa entrada ha sufrido varias modificaciones a medida que Blogger ha ido cambiando el sistema. Fíjate en esta otra.

Responder
Haruki-chan  

bien

Responder
Haruki-chan  

bien lo intentare

Responder
Agustín  

Estimado JMiur he implementado los comentarios anidados y funcionan bien, excepto en una cosa: los comentarios me siguen apareciendo numerados, excepto, lo que se dan como respuesta que no tienen ningún tipo de numeración, ¿cómo puedo hacer que todos aparezcan numerados?

Muchísima gracias

JMiur  

Si estas usando el mismo tipo de esquema que acá, es probable que lo que te falte es la regla apra las respuestas que es similar a la otra:

#comments-block .respuestas-comentarios:before {
y aquí repites las mismas reglas que usas en comments-block dt:before{}
}

Responder
Agustín  

Mil gracias JMiur, conseguí que todos los comentarios apareciesen numerados bien, tanto los iniciales como las respuestas.

¿Cómo podría conseguir que en las respuestas la numeración se iniciase, es decir, si por ejemplo se está contestanco al comentario 1, la respuestas apareciesen con otra numeración, por ejemplo 1.1 1.2 etc.

Los códigos que tengo son:

#comments-block {counter-reset: contadorcomentarios;}
#comments-block dt{position:relative}
#comments-block dt:before {
content: counter(contadorcomentarios, decimal);
counter-increment: contadorcomentarios;
position: absolute;
right: 0px;
top: 0px;
}
#comments-block .respuestas-comentarios{position:relative}
#comments-block .respuestas-comentarios:before {
content: counter(contadorcomentarios, decimal);
counter-increment: contadorcomentarios;
position: absolute;
right: 0px;
top: 0px;
}

Millones de gracias

JMiur  

Podría ser agregando esto:

#comments-block .contenedor-respuestas {
counter-reset: contador_reply;
}

y luego, modificando #comments-block .respuestas-comentarios:before {}

#comments-block .respuestas-comentarios:before {
content: counter(contadorcomentarios, decimal) "." counter(contador_reply, decimal) !important;
counter-increment: contador_reply !important;
position: absolute;
right: 0px;
top: 0px;
}

Agustín  

Perfecto, muchísimas gracias.

Responder
Inés  

Hola admirado JMuir me gustaría que me ayudases.
Te comento, tengo personalizado los comentarios del autor y he implementado los comentarios anidados tal como indicas aquí, la personalización en los comentarios del autor sigue funcionando. Pero cuando el autor responde, y aparece su comentario como respuesta, la personalización que puse no aparece en dicha respuesta. No sé si en los nuevos códigos de los comentarios anidados debo introducir algo que diga que personalice también las respuesta del autor. Muchísimas gracias.

JMiur  

Te respondí en el mail que me enviaste.

Responder
CUENTAGOTAS  

Hola Jmiur, vengo con una consulta pues me acabo de dar cuenta, resulta que si te fijas en los comentarios anidados sin el nuevo código que implemente en mi blog http://ritmosymelodiasecuador.blogspot.com/2010/11/oro-negro-bombas-con-sabor-y.html?showComment=1344118656245#comment-2470297702523356813
la información que solía ser indicativo de cuando se publicó el comentario se ha perdido y solo se muestra el siguiente texto ¨hace NaN años¨ por lo que necesito arreglarlo o en su defecto eliminarlo.

Espero puedas darme una mano como siempre Jorge.

Gracias.

JMiur  

Eso ocurre porque al parecer, Blogger ha cambiado el formato de las fechas. No me había dado cuenta; prueba cambiando levemente la función y que ahora, comience de este modo:

function fecharelativa(dato) {
dato=dato.replace("a.m.","AM");
dato=dato.replace("p.m.","PM");
var fechapost = new Date(dato).getTime()/1000; // fecha y hora de la publicación

por lo menos, acá parece funcionar.

Responder
CUENTAGOTAS  

Funciona a la perfección Jorge ;)

Gracias una vez más Maestro y que Dios te bendiga siempre.

Responder
Beyka ♫  

Hola JMiur :)

Muchas gracias por la aportación, me ha ido estupendamente. Al principio me lié un poco y acabé siguiendo los pasos de Nicondroid pero después tus aportaciones extra me han ayudado mucho.

Quería preguntarte dos cosas, si no es molestia:
1. ¿Qué reglas debería añadir para poder modificar el estilo de los comentarios "padre"? Es que con las que nos dais sólo se cambian las respuestas, mientras que, por ejemplo, no puedo enmarcar los comentarios padre ni darle formato a su avatar ni nada.

2. Utilicé el contador de comentarios que escribiste en el comentario 60 de esta entrada, y me funcionó perfectamente, incluso añadiéndole la parte en que las respuestas se numeran sucesivamente (1.1, 1.2...) que vi un poco más abajo, pero en cuando lo implemento los avatares de las respuestas "padre" se alteran y se mueven horizontalmente saliéndose de su sitio hacia la izquierda. ¿Qué podría hacer?

Pienso que probablemente con la respuesta a la pregunta 1 pueda solucionar la 2 pero por si acaso te he hecho las dos.

Muchas gracias por tu tiempo :)
Un abrazo ^^

JMiur  

Tal como lo tienes armado, no hay un contenedor separado para los comentarios "padre" que, en el ejemplo de esta entrada, son los que se incluyen en un DIV llamado class='comentario-base'

En tu caso, hay tres etiquetas que forman esa parte y que, como carecen de alguna clase que las agrupe, deben ser tratadas de modo individual:
dt class="comment-author"
dd class="comment-body"
dd class="comment-footer"

Debajo de esas está el contenedor-respuestas que si has podido modificar.

¿Podrías explicar un poco más lo del contador o mostrar un ejemplo? Es que no veo que haya problema alguno cuando miro lo que hay en tu blog.

Beyka ♫  

Pues es que al final he podido solucionar lo del contador! He añadido un codigo de Oloblogger para redondear los avatares, con lo que he podido obtener un código para modificarlos, y entonces les he aplicado "margin" y los he colocado de nuevo en su sitio ^^

En cuanto a lo otro... supongo que no se puede hacer nada, ¿no? Así mismo he modificado un par de cosas más y más o menos me gusta cómo lo he dejado.
En cualquier caso gracias por tu ayuda.

Un abrazo :)

Responder
JugadorCompulsivo  

Hola maestro
a ver si me salvas de un "desarme" en un blog en el que participo, hace poco hice el asunto de "responder comentarios anidados", obtenido de aquí:

http://nicondroid.blogspot.com/p/comentarios-anidados-personalizados-en.html

Todo perfecto pero me descuadró el texto personalizado que tenia sobre el cajón de comentarios, (lo dejó ajustado a media pantalla)

captura de pantalla
http://3.bp.blogspot.com/-y-eiGwiR0hE/UJlq4ZaONdI/AAAAAAAABDY/_-PiFcm2AyE/s1600/blog.jpg

le deje la pregunta a al dueño del blog y aun no responde... no he podido solucionarlo, así que recurro a los expertos...

Gracias de antemano
Saludos

JMiur  

No sé si por "descuadre" te refieres a que parece verse una columna angosta con textos que no ocupan todo el ancho.

Si es así, eso ocurre porque Blogger define un máximo para el ancho de ese DIV, así que debes quitarle esa propiedad con esta regla:

.comment-form {max-width: 100%;}

o agregando !important:

.comment-form {max-width: 100% !important;}

a partir de ahi podrás modificar cualquier otro detalle.

JugadorCompulsivo  

Maestro... simplemente... maestro
funcionó perfecto

no se si la puse en el lugar correcto pero funcionó

pegué esto completo
.comment-form {max-width: 100% !important;}

y quedó de lujo

Muchas gracias

JMiur  

Si funciona es que está en el lugar correcto :D

Responder
Magoplup  

Hola JMiur pasaba por acá luego de mucho tiempo de haber dejado el blog sin actualizar y me encuentro con estos comentarios que ya tienen su tiempo pero son relativamente nuevos para todos y me encuentro con un problema al intentar colocar este sistema con el cancelar no me deja agregarlo en el último paso donde dices " // ACA VAN LAS DOS FUNCIONES" copio y pego el script le doy vista previa y resulta que me sale este mensaje No se ha podido analizar su plantilla, porque no está bien formada. Asegúrese de que todos los elementos XML se han cerrado correctamente. <br/>Mensaje de error de XML: The character sequence "]]>" must not appear in content unless used to mark the end of a CDATA section.
Error 500

JMiur  

Sin ver lo que estás poniendo con exactitud, aparentemente, el mensaje dice que te falta la etiqueta
//<![CDATA[

Magoplup  

Si es lo que dice pero la verdad no se cual sea el problema probé con la opción que ofrece Felipe en su blog y resulta bien el problema es cuando aplico el código:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>var flagItem = 0;</script>
</b:if>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<script type='text/javascript'>var flagItem = 1;</script>
</b:if>
<script type='text/javascript'>
/* Código bajo Licencia Creative Commons 3.0 (Atribución-No Comercial)
Felipe @ http://gplus.to/iFelipeCalvo */
var indexa = &#39;<data:top.id/>&#39;;
var indexb = &#39;<data:post.id/>&#39;;
//<![CDATA[
// Distingue entre post y página estática
flagItem="0"==flagItem?"&postID=":"&pageID=";
<script type='text/javascript'>
//<![CDATA[
function replyOriginal() {
var b = document.getElementById("comment-editor").getAttribute("src"), a = b.indexOf("#"), b = b.substring(a), a = document.getElementById("comment-editor");
a.parentNode.removeChild(a);
a = document.getElementById("replypost");
a.parentNode.removeChild(a);
b = "http://www.blogger.com/comment-iframe.g?blogID=" + (indexa + flagItem + indexb + b) + "";
a = document.createElement("iframe");
a.setAttribute("id", "comment-editor");
a.setAttribute("name", "comment-editor");
a.setAttribute("src", b);
a.setAttribute("height", "250px");
a.setAttribute("width", "100%");
a.setAttribute("frameborder", "0");
a.setAttribute("allowtransparency", "true");
document.getElementById("comment-form-thread").appendChild(a)
}

function reply(b) {
var a = document.getElementById("comment-editor").getAttribute("src"), c = a.indexOf("#"), a = a.substring(c), c = document.getElementById("comment-editor");
var boton = c.parentElement.getAttribute("id").replace("contenedorreply-", "replyboton-");
if(document.getElementById(boton).innerHTML=="Cancelar") {
document.getElementById(boton).innerHTML="Responder";
}
if(c.parentElement.getAttribute("id").indexOf(b)>=0) { replyOriginal();
return;
}
c.parentNode.removeChild(c);
a = "http://www.blogger.com/comment-iframe.g?blogID=" + (indexa + flagItem + indexb) + "&parentID=" + (b + a) + "";
c = document.createElement("iframe");
c.setAttribute("id", "comment-editor");
c.setAttribute("name", "comment-editor");
c.setAttribute("src", a);
c.setAttribute("height", "250px");
c.setAttribute("width", "100%");
c.setAttribute("frameborder", "0");
c.setAttribute("allowtransparency", "true");
document.getElementById("contenedorreply-" + b + "").appendChild(c);
document.getElementById("replyboton-"+b).innerHTML = "Cancelar";
document.getElementById("replypost") || (b = document.createElement("a"), b.innerHTML = "Agregar un comentario", b.setAttribute("id", "replypost"), b.setAttribute("class", "LoadMore"), b.setAttribute("href", "#"), b.setAttribute("onclick", "replyOriginal();return false;"), document.getElementById("comment-form-thread").appendChild(b))
}
//]]>
</script>

¿estoy haciendo algo mal en esta parte? entiendase que es la ultima parte del codigo junto al script la unica en la que creo podria estar el error que dice bloger

JMiur  

Perfecto, con el código es más sencillo de ver el problema.

Lo que ocurre es que hay una interpretación errónea de la variante pero la solución es simple.

Esto es lo que pones:

<script type='text/javascript'>
/* Código bajo Licencia Creative Commons 3.0 (Atribución-No Comercial)
Felipe @ http://gplus.to/iFelipeCalvo */
var indexa = &#39;<data:top.id/>&#39;;
var indexb = &#39;<data:post.id/>&#39;;
//<![CDATA[
// Distingue entre post y página estática
flagItem="0"==flagItem?"&postID=":"&pageID=";
<script type='text/javascript'>
//<![CDATA[
function replyOriginal() {
....... y todo lo demás

Allí, abres una etiqueta SCRIPT pero no la cierras y luego, la vuelves abrir por lo que hay dos CDATA.

Debería ser de este modo ... espero escribirlo bien y que se entienda:

<script type='text/javascript'>
/* Código bajo Licencia Creative Commons 3.0 (Atribución-No Comercial)
Felipe @ http://gplus.to/iFelipeCalvo */
var indexa = &#39;<data:top.id/>&#39;;
var indexb = &#39;<data:post.id/>&#39;;
// Distingue entre post y página estática
flagItem="0"==flagItem?"&postID=":"&pageID=";
</script>

<script type='text/javascript'>
//<![CDATA[
function replyOriginal() {
....... y todo lo demás

Magoplup  

Hola JMiur siento decir que aun con este cambio no puedo aplicar el código dentro de la plantilla aunque debo decirte que los CDATA que están en el código son del original que has dejado en la entrada solamente hice un copy paste con la ultima recomendación que me has dejado aparece el siguiente error: No se ha podido analizar su plantilla, porque no está bien formada. Asegúrese de que todos los elementos XML se han cerrado correctamente. <br/>Mensaje de error de XML: The reference to entity "postID" must end with the ';' delimiter.
Error 500 ...Seguiré intentándolo te incluiré una imagen que muestra lo que hago con ambos códigos estaré atento a tu respuesta espero sea un error mío y no de la plantilla

JMiur  

Justamente, lo que muestras en la imagen es el error ya que la entrada dice:

Acá hay una variante respecto del código original. Simplemente coloqué las dos funciones del script junto con el resto por razones de comodidad pero es indistinto agregarlas allí o en el head ...

dice // ACA VAN LAS DOS FUNCIONES porque ese es el formato original que utilizó Felipe pero, a mi entender como esas son dos funciones, es innecesario que vayan allí y pueden ponerse antes de </head> o junto con las demás que se utilizan la plantilla por lo tanto, nuevamente se escriben etiquetas <script&/lt; </script> y sus correspondientes CDATA.

Si no se quiere hacer así, simplemente se copian las funciones pero no las etiquetas porque dentro de una etiqueta <script> no puede agregarse otra etiqueta. Las funciones son:

function replyOriginal() { ... } y function reply(b) { ... }

Responder
Yurika-Chan  

JMiur de nuevo yo, espero que no estes aburrido de mi

El caso es que tengo un blog con varios autores y quiero diferenciar tanto los comentarios padre como las respuestas, de los que publican los demás, he intentado de todo pero no he podido poner clases que me funcionen, los cambios los hago en este blog de pruebas

JMiur  

Pués no sabría responderte porque es algo muy engorroso y habría que ir probando si tal cosa es posible. No sé que tipo de dato estás usando para condicionar las diferencias.

Yurika-Chan  

Pues es que no sabría bien decirte que clases tiene esta es la plantilla que tengo para que tu veas Plantilla

JMiur  

No es algo que pueda probar; no tengo blogs con varios autores. Por eso preguntaba cuáles son las condiciones que etsás usando para diferenciar los comentarios.

Responder
Pepe Pilato  
Este comentario ha sido eliminado por el autor.
JMiur  

Los estilos de esa página son para los comentarios anidados de Blogger.

Los estilos dependen de la estructura que tengan los comentarios. Depende de cada caso.

Pepe Pilato  
Este comentario ha sido eliminado por el autor.
JMiur  

Son los que muestra esta entrada.

Responder
Pepe Pilato  
Este comentario ha sido eliminado por el autor.
JMiur  

hay un script que dice:
if(fechapost<=ahora) ........
y la variable ahora no está definida

Pepe Pilato  

¿Y qué debería hacer?

¿Eliminar todo esto?

if(fechapost"=ahora) {
var segundos = ahora - fechapost;

Gracias.

Pepe Pilato  

Y ahora resulta que el boton responder no funciona, me aparece el signo # en la barra de direcciones, y aparece la caja de comentarios

Ayudame!!!

JMiur  

Revisa el script y cópialo correctamente, te falta una línea.

Responder
Pepe Pilato  

Para terminar con este especial, ¿cómo le quito los enlaces a los avatares y para ponerle el target=blank a los enlaces de los autores.

gracias

JMiur  

Busca y modifica los enlaces que veas en el código html:

<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>

<a expr:href='data:comentariohijo.authorUrl' rel='nofollow'>


Responder
Yurika-Chan  

HOla de nuevo, le estoy haciendo unos cambios a mi blog, y hay algo que no he podido modificar, quiero que el tamaño del avatar en el comentario padre, sea un poco más grande que el del comentario hijo, lo intente todo pero no lo logro

JMiur  

Dependerá del sitio y de las reglas de estilo que hayas colocado. Sin saber cuál es el ejemplo es imposible responder.

Responder
Pepe Pilato  

En los comentarios antiguos, yo le había quitado el rel="nofollow" para que los comentarios aparecieran en las búsquedas, ¿este nuevo código tiene el nofollow?

Gracias

JMiur  

El código lo armas a tu gusto. No es nada bueno que los comentarios se indexen; deben tener siempre un nofollow.

Responder
Naira Shair  

hola!
quiero ponerle comentarios anidados a mi blog ( http://juegodeloserrores.blogspot.com/ )
pero el problema es que en mi plantilla no aparencen los codigos que me piden buscar en los tutoriales... supongo que el que creo la plantilla que uso habra usado otras etiquetas o algo, pero no se suficiente html como para buscarlas..
alguna idea? xD

JMiur  

Imposible saberlo sin saber qué códigos buscas ni que dice tu plantilla.

Responder

¿Quiere dejar un comentario?

recuerde que los comentarios están siendo moderados y serán publicados a la brevedad ...

Todos los archivos y demos alojados en Fileden han sido redireccionados y deberían estar funcionando correctamente.
De todos modos, también puede accederse a ellos a través de SkyDrive

Nota: sólo los miembros de este blog pueden publicar comentarios.

Si le gusta ir a lo seguro utilice este botón para abrir los comentarios en una ventana modal en esta misma pagina.

Si añora tiempos idos, use este enlace para agregar un comentario al viejo estilo ...

 
CERRAR