Staff en línea

[Javascript] Añadir un mensaje al dar las Gracias
Tema iniciado por y Añadir a favoritos

[codebox]Gracias a este código pueden añadir automáticamente un mensaje cuando un usuario le da las gracias.[/codebox]

Resultado Final:


Necesitamos hacer los siguientes pasos:

1. Instalamos el siguiente CSS (Los colores son personalizables):
[hidecode]
Código:
    #fa_thanks_message img { vertical-align:middle }
#fa_thanks_message {
    background-color: rgb(207, 242, 255);
    border: 1px solid rgb(69, 180, 231);
    border-radius: 6px;
    color: rgb(29, 120, 224);
    font-size: 16px;
    font-weight: 700;
    margin: 6px;
    padding: 6px;
    text-align: center;
}
[/hidecode]

2. Añadimos este Javascript (En Todas las Páginas):

[hidecode]
Código:
$(function() {
      var message = function(child, parent) {
            var pseudo = $(child, parent).text(),
                icon = '<img src="LINK DEL ICONO" alt=""/>';
       
            return '<div id="fa_thanks_message">' + icon + ' El creador del tema te lo agradece ' + pseudo + ' ! ' + icon + '</div>';
          },
         
          version = $('.bodylinewidth')[0] ? 0 : document.getElementById('wrap') ? 1 : $('.pun')[0] ? 2 : document.getElementById('ipbwrapper') ? 3 : 'badapple', // version check
          node = document.createElement(version ? 'DIV' : 'TR'),
          post = $(version ? 'div' : 'tr' + '.post'),
          j = post.length,
          i = 0;
     
      if (version == 'badapple') {
        if (window.console) console.error('Este plugin no esta optimizado para la version de tu foro. Por favor contacta con el equipo de foroactivo.');
        return;
      }
     
      node.id = 'fa_thanks'; // id for style modifications
      if (!version) node.innerHTML = '<td colspan="2"></td>'; // phpbb2 must have a cell as the child node
     
      for (; i < j; i++) {
       
        if ((version ? post[i] : post[i].firstChild).style.backgroundColor) { // thanked posts have the backgroundColor style property
         
          post[i].className += ' thanked'; // mark the thanked post with a class
          (version ? node : node.firstChild).innerHTML = message(['.name', 'dl > dt > strong', '.username', '.popmenubutton'][version], post[i]); // thanks message
         
          switch (version) {
           
            case 0 : // phpbb2
              node.firstChild.style.backgroundColor = post[i].firstChild.style.backgroundColor;
              node.firstChild.className = post[i].firstChild.className;
              post[i].parentNode.insertBefore(node, post[i].nextSibling);
              break;
             
            case 1 : // phpbb3
              post[i].firstChild.insertBefore(node, post[i].firstChild.lastChild.previousSibling);
              break;
             
            case 2 : // punbb
              node.className = 'postfoot';
              node.style.margin = '0';
              post[i].appendChild(node);
              break;
             
            case 3 : // invision
              node.className = 'post-footer';
              node.style.backgroundColor = post[i].style.backgroundColor;
              post[i].appendChild(node);
              break;
           
          }
         
          break; // break out of the for loop when the thanked post is found
        }
       
      }
    });
[/hidecode]

Para cambiar el mensaje, solo buscar en el código anterior, el trozo:

Código:
return '<div id="fa_thanks_message">' + icon + ' El creador del tema te lo agradece ' + pseudo + ' ! ' + icon + '</div>';
          },

Hay que respetar la variable + pseudo + (nombre de usuario) y + icon + referente al icono que aparece a lados.

No olviden definir en la tag html <img src=LINK DEL ICONO alt=""/> el url del icono que quieran mostrar. Puede ser una estrella por ejemplo.

Eso es todo (=
YoshiGM
avatar

¿Que estoy pensando? :

Aquí Sigo .w. [table class=fecha_up][td]Se modifico:12/07/18 - 17:29 hrs. [/td][/table]


Banner en temas :

https://i.servimg.com/u/f19/13/45/80/80/banner10.jpg


Color de titulos :

#fff


Sombra titulo :

1px 1px 1px #555


Mensajes :

1129


Puntos :

1503


Me gusta :

214


ingreso :

17/12/2014


Sexo :

Masculino

Plataforma :

PhpBB3


Navegador :

Chrome


Ver perfil de usuario http://www.yoshifansclub.net

Volver arriba Ir abajo

gracias por el aporte
Roger
avatar

¿Que estoy pensando? :

Probando el status del foro [table class=fecha_up][td]Se modifico:9/03/17 - 9:13 hrs.[/td][/table]


Banner en temas :

http://thedesigninspiration.com/wp-content/uploads/2012/06/Facebook-Covers-029.jpg


Color de titulos :

#333


Sombra titulo :

1px 1px 1px #fff


Mensajes :

304


Puntos :

342


Me gusta :

30


ingreso :

30/03/2015


Sexo :

Masculino

Plataforma :

PhpBB3


Navegador :

Chrome


Ver perfil de usuario

Volver arriba Ir abajo

 En la misma categoria


Permisos de este foro:
No puedes responder a temas en este foro.