Comentar con Google+, Blogger o Facebook en Blogger + contador de comentarios. Comentar con Google+, Blogger o Facebook en Blogger + contador de comentarios.
Comentar con Google+, Blogger o Facebook en Blogger + contador de comentarios.
Página 1 de 2 12 ÚltimoÚltimo
Mostrando resultados del 1 al 10 de 14
  1. Comentar con Google+, Blogger o Facebook en Blogger + contador de comentarios.
    Este Tutorial no lo encontré aquí en el foro, si alguien más lo publico pido disculpas y que lo borren.


    COMO HACERLO

    Paso # 1: Has copia de seguridad de tu plantilla! (en caso de que algo salga mal)
    Paso # 2: Ve a Plantilla >> Editar HTML (* Click dentro del Editor después Presione CTRL + F para activar el cuadro de búsqueda) y buscar el siguiente código:

    Código HTML:
    <b:include data='post' name='post'/>
    Paso # 3: debajo del codigo anterior agrega el siguiente código:

    Código HTML:
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <div id='com-header'>
    <div align='center' style='padding-top: 5px;font-size: 16px;'><b>Para Comentar Elige el Sistema de Comentario de tu Agrado:</b></div>
    </div>
    <div class='commentacon'>
    <script language='javascript' type='text/javascript'>
    function show(id) {
    var oc = document.getElementById(id).style;
    hide();
    oc.display = &quot;block&quot;;
    }
    function hide() {
    document.getElementById('gpluscomments').style.display = &quot;none&quot;;
    document.getElementById('comments').style.display = &quot;none&quot;;
    document.getElementById('comentariosFacebook').style.display = &quot;block&quot;;
    }
    </script>
    <style type='text/css'>#gpluscomments{margin-left:10px}
    #com-header {width: 550px;margin-left:10px;padding: 2px;float:left;margin-bottom: 10px;text-align: center; }
    .commentacon {background:#edeaea;width: 550px;margin-left:10px; margin-top: 5px; } #comments, #gpluscomments {display:none;}#goog{margin-left:65px;display:block;}#blog{margin-left:210px;margin-top:-45px;} #face{margin-left:355px;margin-top:-45px;}#comentariosFacebook{margin-left:15px;margin-top:10px;}</style>
    <div id='goog'>
    <a class='googl' href='javascript:show(&apos;gpluscomments&apos;)'><img alt='comentarios google' border='0' src='http://3.bp.blogspot.com/-0ydXXdbASA4/UlbMP6XctDI/AAAAAAAANBE/w9z9FF3y5ps/s1600/comentarios-google.gif'/></a></div>
    <div id='blog'>
    <a class='blogg' href='javascript:show(&apos;comments&apos;)'><img alt='comentarios blogger' border='0' src='http://2.bp.blogspot.com/-tFYhYwlbXUA/UlbMNa9qTjI/AAAAAAAANA4/D-SOu2qRGiU/s1600/comentarios-blogger.gif'/></a></div>
    <div id='face'>
    <a class='faceb' href='javascript:show(&apos;comentariosFacebook&apos;)'><img alt='comentarios facebook' border='0' src='http://4.bp.blogspot.com/-y9s-D8JTI3Q/UlbMPgX-o2I/AAAAAAAANBA/yZEUpHOR9KU/s1600/comentarios-facebook.gif'/></a></div>
    </div>
    <div class='comentarios' id='gpluscomments'>
    <div class='g-comments' data-first_party_property='BLOGGER' data-view_type='FILTERED_POSTMOD' data-width='550' expr:data-href='data:post.url'/>
    </div>
    </b:if>
    Paso # 4: Acontinuación veremos estas líneas:

    Código HTML:
    <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
    <b:include data='post' name='comment_picker'/>
    </b:if>
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <b:include data='post' name='comment_picker'/>
    </b:if>
    Depues de ellas, colocamos la caja de facebook:

    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <div class='comentarios' id='comentariosFacebook'>
    <div class='fb-comments' data-colorscheme='light' data-num-posts='1' data-width='540' expr:href='data:post.url'/></div> </b:if>

    Configurar ancho de la caja:

    En el código puedes observar en rojo el ancho de la caja, si no se adapta a sus necesidades, con aumentar o disminuir lo solucionan.
    El ancho de la caja de Facebook lo marca: data-width='540'.

    Paso # 5: Ahora para que funcione la caja de comentarios de facebook hay que localizar la etiqueta <body> y justo debajo insertar el siguiente código:

    Código HTML:
    <div id="fb-root"></div><script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/es_ES/all.js#xfbml=1"; fjs.parentNode.insertBefore(js, fjs);}(document, 'script', 'facebook-jssdk'));</script>

    Con esto Terminamos de Colocar las Cajas de Comentarios de Google+, Blogger y Facebook

    Paso # 6: Instalar el Contador de Comentarios

    buscar el siguiente código:

    Código HTML:
    <div id='com-header'>
    Paso # 7: debajo de esa linea agrega el siguiente código:

    Código HTML:
    <div class='comments-count-blo-goo'>
    <div align='center'>
    <div class='comment-google'><div class='g-commentcount' data-color='#666666' data-font-family='arial' data-font-size='13px' data-preexisting_count='0' expr:data-href='data:post.url'/></div>
    <div class='comment-blogger'><data:post.numComments/> comentarios</div>
    <div class='comment-facebook'><fb:comments-count expr:href='data:post.url'/> Comentarios</div>
    </div>
    </div>
    <style>.comments-count-blo-goo {padding: 5px;margin-left:10px;background: rgb(248, 248, 248); margin-top: 5px; border: 1px solid rgb(229, 229, 229);border-radius: 3px; line-height: normal; vertical-align: top; font-size: 13px; font-family: arial; margin: 0 2px 15px 10px; }
    .comment-blogger, .comment-google, .comment-facebook { padding-left: 18px; height: 16px; display: inline-block; width: 110px; }
    .comment-blogger { background: url(&quot;//www.blogger.com/img/logo-16.png&quot;) no-repeat; background-size: 14px;}
    .comment-google {background: url(&quot;//www.google.com/images/icons/ui/gprofile_button-16.png&quot;) no-repeat;background-size: 14px; vertical-align: top; line-height: normal;}
    .comment-facebook { background: url(&quot;http://2.bp.blogspot.com/-rae4j6NaLkY/T1JrjUEIkkI/AAAAAAAAGBc/PzwMIo1g1Is/s400/fbcomment.png&quot;) no-repeat; background-size: 14px; vertical-align: top; line-height: normal;}
    .comment-total { font-size: 13px; vertical-align: top; display: inline-block; }
    .comment-total div, .comment-google div, .comment-facebook div { vertical-align: top !important; } </style>
    Paso # 8: Ahora presione el botón "GUARDAR PLANTILLA" y ya está todo hecho. Enhorabuena

    **Si esto no funciona ...

    Puede que no tenga las bibliotecas jQuery instaladas en su plantilla. Para agregarlas Copia / pega el siguiente código y agregarlo a la plantilla justo antes de </head>

    Código HTML:
    <script language='javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'></script>
    Con esto ya tendremos funcionando el número de comentarios de cada Red Social en nuestros blogs y las caja de comentarios.

    Lo pueden ver funcionando en mi blog: Aquí

    Credito al creador: Comentar con Google+, Blogger o Facebook en Blogger. - Amor Sevillista <---- aquí el original.
    Última edición por Nelo; 20-jun-2014 a las 11:07

  2. #2
    Registro
    12-noviembre-2013
    Ubicación
    Lima, Peru
    Edad
    24
    Mensajes
    561
    Esto es Copy paste amigo da creditos al menos
    Este es el original: Comentar con Google+, Blogger o Facebook en Blogger. - Amor Sevillista
    Citar Citar  

  3. #3
    Registro
    09-septiembre-2012
    Ubicación
    España
    Edad
    28
    Mensajes
    1.221
    Muy buen tutorial
    Citar Citar  

  4. #4
    Registro
    06-agosto-2013
    Ubicación
    Managua, Nicaragua
    Mensajes
    171
    Cita Iniciado por Souhiro Ver Mensaje
    Esto es Copy paste amigo da creditos al menos
    Este es el original: Comentar con Google+, Blogger o Facebook en Blogger. - Amor Sevillista
    Antes de Amor Sevillista yo ya lo habia creado y he creado otro mas de diferentes estilo y responsive.

    Saludes
    Citar Citar  

  5. Cita Iniciado por Souhiro Ver Mensaje
    Esto es Copy paste amigo da creditos al menos
    Este es el original: Comentar con Google+, Blogger o Facebook en Blogger. - Amor Sevillista
    Se me paso amigo pido disculpas y ya he agregado los créditos correspondientes..
    Citar Citar  

  6. #6
    Gracias por el tuto, aprovecho para consultar si alguien sabe como implementar los comentarios de gogole + en wordpress sin plugin, alguien tiene el código?.
    Citar Citar  

  7. #7
    Registro
    12-noviembre-2013
    Ubicación
    Lima, Peru
    Edad
    24
    Mensajes
    561
    Normal amigo, solo te lo digo porque te pueden eliminar el tuto
    Cita Iniciado por Nelo Ver Mensaje
    Se me paso amigo pido disculpas y ya he agregado los créditos correspondientes..
    Citar Citar  

  8. #8
    Registro
    10-septiembre-2013
    Ubicación
    Barcelona
    Edad
    24
    Mensajes
    1.578
    Guardado en favoritos
    Citar Citar  

  9. #9
    Registro
    03-febrero-2013
    Ubicación
    España
    Mensajes
    1.533
    bueno materiar duplicado pero igual para los que no lo sabian buen aporte
    Citar Citar  

  10. #10
    Registro
    07-enero-2012
    Ubicación
    Cali, Colombia
    Mensajes
    2.089
    Comentar con Google+, Blogger o Facebook en Blogger + contador de comentarios.
    No lo habia visto en el foro. De cualquier forma graias por el tuto.
    Citar Citar  

Página 1 de 2 12 ÚltimoÚltimo

Temas similares

  1. Presumo mi Post de Comentarios de Blogger, Goolge+ y FaceBook en Blogger
    Bueno amigo vengo a presumir un articulo de mi pagina porque me parece que es muy interesante y quiero compartirlo con ustedes y que quiero saber que...
    Respuestas: 4
    Último mensaje: 23-oct-2013
  2. consulta por contador de facebook en blogger
    hola como les va? les escribo mas q nada para hacerles una preg. hoy cuando mire mi blog, me volvieron el contador de "me gusta" a 0, no es q tuviese...
    Respuestas: 1
    Último mensaje: 28-ago-2013
  3. comentarios facebook en blogger
    Alguien sabe como se ponen los comentarios facebook en blogger ?
    Respuestas: 2
    Último mensaje: 22-nov-2012
  4. Comentarios de Facebook y no los de blogger
    ( puse 2 temas seguidos con diferentes preguntas porque me parecio correcto separarlo asi y no es spam ni nada de eso ) hola de nuevo compañeros...
    Respuestas: 5
    Último mensaje: 10-nov-2011
  5. Comentarios Facebook en Blogger
    Se puede hacer integrar para que comenten que su perfil de facebook?.
    Respuestas: 4
    Último mensaje: 02-feb-2011

Normas de publicación

  • No puedes crear nuevos temas
  • No puedes responder mensajes
  • No puedes subir archivos adjuntos
  • No puedes editar tus mensajes
  •