ConectarseRegistrarse
0

Temas

Monedas

Likes

0
Debes de estar Registrado y comentar para ver el enlace de descarga
Pulsa en Me Gusta para desbloquear contenidos ocultos y Agradecer por este aporte
Logros y Medallas obtenidos por

Temas Similares


Respuestas

avatar
Administrador
Administrador

Tu Vil Amigo™
avatarTu Vil Amigo™
Administrador
Ver perfil de usuario http://www.15tronos.foroac.org
el Dom 20 Mayo 2012, 8:35 pm

Con este tutorial podrás aprender a cambiar las imágenes de los bbcodes por unas más personalizadas y profesionales:


FUNCIONA EN TODAS LAS VERSIONES

1.- Creación de una página HTML y modificación del código

Este sistema funciona mediante jQuery, por lo que se necesita la creación de una página html con un nombre que quieras, sin usar la parte alta y baja de tu foro ni usarla como índice...
Panel de administración->Módulos->Html->Gestión de la páginas html->Crear una nueva página HTML
Donde dice código HTML vas a colocar este código:

Código:
jQuery(document).ready(function() {
    jQuery('button img').each(function() {
        if(jQuery(this).attr('src') == 'LINK') jQuery(this).attr('src', 'NUEVO_LINK');
    });
})

Modificación del código:

Lo seleccionado en colo Amarillo (LINK) es la imagen por defecto que va a ser sustituida por otra, un ejemplo claro, la de Negritas, usa esta imágen:
Por consiguiente el color Verde es la imagen que va a sustituir a la por defecto, para el mismo caso de las b]Negritas[/b], usaremos ésta imagen


Nos quedaría de esta forma:

Este código sirve para cambiar una sola imagen, si quieres cambiar las demás, solo debes agregar esta linea:
Código:
if(jQuery(this).attr('src') == 'LINK') jQuery(this).attr('src', 'NUEVO_LINK');

Donde al igual, el color amarillo es la imagen por defecto que se va a sustituir y el color verde es la nueva imagen....
Quedaría así:



2.- Aplicación de script en tu foro:
Finalmente hay que hacer funcionar el script.. para hacerlo simplemente ve a
Panel de administración->General->foro->configuración->Descripción del sitio
Y pega esto
Código:
<script src='URL DE TU PAG HTML'></script>
sustituyendo el "URL DE TU PAG HTML" por la url de la página html una vez ya guardada y registrada...

Ejemplo de cómo quedaría la respuesta rápida Modificada completamente

Ejemplo de la respuesta completa


¡¡EXTRA!!

Nuestro amigo yuninho Nos facilitó el código que usó en su foro (Capturas) para vuestros foros... éste es el código completo ya modificado

Código:
jQuery(document).ready(function() {
    jQuery('button img').each(function() {
        if(jQuery(this).attr('src') == 'http://illiweb.com/fa/wysiwyg/text_bold.png') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/bold10.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/wysiwyg/text_italic.png') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/italic10.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/wysiwyg/text_underline.png') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/underl10.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/wysiwyg/text_strikethrough.png') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/strike10.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/wysiwyg/text_align_center.png') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/align_10.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/wysiwyg/text_align_left.png') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/align_11.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/wysiwyg/text_align_right.png') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/align_12.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/wysiwyg/page_white_code.png') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/code10.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/i/smiles/icon_smile.gif') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/emotic10.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/wysiwyg/color_swatch.png') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/font_c11.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/wysiwyg/help.png') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/help10.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/wysiwyg/link.png') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/link10.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/wysiwyg/film.png') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/media10.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/wysiwyg/text_list_numbers.png') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/ordere10.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/wysiwyg/picture.png') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/pictur10.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/wysiwyg/comments.png') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/quote10.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/i/switch_wysiwyg.gif') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/remove12.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/wysiwyg/text_list_bullets.png') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/unorde10.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/wysiwyg/text_align_justify.png') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/align_13.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/wysiwyg/text_horizontalrule.png') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/text_h10.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/wysiwyg/table.png') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/table10.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/wysiwyg/picture_save.png') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/pictur11.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/wysiwyg/page_white_flash.png') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/page_w10.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/wysiwyg/style.png') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/size10.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/wysiwyg/font.png') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/fon10.png');

 if(jQuery(this).attr('src') == 'http://illiweb.com/fa/wysiwyg/separator.png') jQuery(this).attr('src', 'http://i26.servimg.com/u/f26/12/56/56/12/separa10.png');
    });
})

Tutorial Creado por : Rey! aporte de código modificado por yuninho
Copyrigth © FOROACTIVO.COM



El Post Se Muestra Tal Cual es Posteado en Foroactivo.com



Última edición por Tu Vil Amigo™ el Vie 08 Mar 2013, 3:58 pm, editado 1 vez





15-Tronos Diseñamos Tu Foro
Copyright 15-Tronos,©2010-2015-Todos los derechos reservados
avatar
Usuario VIP
Usuario VIP

.Storm
avatar.Storm
Usuario VIP
Ver perfil de usuario
el Vie 25 Mayo 2012, 5:38 pm

Gracias por compartir.
Lo he usado en mi foro :P

avatar
Usuario
Usuario

HUNTER MAKER
Ver perfil de usuario
el Dom 17 Jun 2012, 3:25 pm

Yo tambien lo usare en mi foro. :evil:




http://hunter-maker.net/©
__________________________________________
Cuanto mas alto vueles mas dura sera la Caida.
avatar
Usuario VIP
Usuario VIP

Critus1012
avatarCritus1012
Usuario VIP
Ver perfil de usuario
el Sáb 09 Mar 2013, 2:12 pm

Se ve genial, Tal ves lo use en mi foro good



Hola Invitado, Bienvenid@ Al Foro 15-Tronos.net
Para Evitar problemas, leer las reglas:
Normas Generales 15-Tronos en 15-tronos | Diseñamos Tu Foro
©️ 15-tronos | Diseñamos Tu Foro.
Se te agradece Evitar el FLOOD, Gracias
avatar
Administrador
Administrador

fededz
avatarfededz
Administrador
Ver perfil de usuario http://www.15-tronos.net/
el Mar 26 Mar 2013, 5:16 pm

aver

avatar
Donador
Donador

FяєєWєєÐ™el Lun 29 Abr 2013, 11:30 pm

Gracias por compartir.

avatar
Usuario
Usuario

GustavoChagasel Vie 08 Nov 2013, 7:33 pm

Buenas

avatar
Usuario
Usuario

yuninho
avataryuninho
Usuario
Ver perfil de usuario
el Sáb 09 Nov 2013, 9:05 am

este codigo ya es antiguo, os pasare uno mas reciente en base de un poco css

este es el modo respuesta, en el codigo css esta los botones, luego lo envio

http://www.15-tronos.net/t1853-diseno-mejorado-del-modo-respuesta



Talento no usado, éxito desperdiciado
avatar
Usuario
Usuario

Gmtp
avatarGmtp
Usuario
Ver perfil de usuario
el Jue 14 Nov 2013, 9:06 pm

Gracias

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

 
Copyright © 2010 - 15-Tronos.net. All Rights Reserved.