Deprecated: str_replace(): Passing null to parameter #3 ($subject) of type array|string is deprecated in /var/www/mybb-es.com/html/inc/class_language.php on line 201
[Tutorial] Colorpicker
Páginas (2): 1 2   
eNvy   8 Dec, 2013, 8:04 pm
#1
Nunca me puse a buscar realmente cómo añadir ésto, y tampoco tengo idea... así que empecemos por lo básico:

Créditos a MyBBoard.PL por este magnífico tutorial.

Comencemos entonces...

INFORMACIÓN

¿Qué es colorpicker?

Es esa famosa paleta de colores que te permite elegir el color que más te guste y utilizarlo en tu web/foro, sin perder la configuración de color.

TUTORIAL DE INTEGRACIÓN A MYBB

PASO 1:

Descarga el siguiente RAR, y coloca la carpeta "picker" en la raíz de tu foro.

PASO 2:

Ingresas en tu panel de administración, luego vas a Estilos y Plantillas, luego a plantillas, ingresas en el theme o template que estes utilizando, vas a Plantillas sin grupo, e ingresas a Headerinclude.

Dentro de Headerinclude, copias y pegas el siguiente código:

Código:
<script type="text/javascript" src="{$mybb->settings['bburl']}/picker/js/jquery.min.js"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/picker/js/colorpicker.js"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/picker/js/skin.js"></script>
<script type="text/javascript" src="{$mybb->settings['bburl']}/picker/js/cookie.js"></script>
<link type="text/css" rel="stylesheet" href="{$mybb->settings['bburl']}/picker/css/style.css" />
<link type="text/css" rel="stylesheet" href="{$mybb->settings['bburl']}/picker/colorpicker.css" />

PASO 3:

Busca la plantilla donde quieras añadir el botón que te permitirá mostrar la paleta del colorpicker. Luego copia y pega el siguiente código:

Código:
<span class='custom_theme'><input type='text' id='colorpicker' /></span>

PASO 4:

Ésta es la parte quizás más pesada o compleja... En tu propio diseño, o en el de 3ros, busca las clases e ID's que quieres modificar con el colorpicker y anotalas.

Una ves que tengas las clases anotadas, ve a la carpeta picker (La cual debería estar en la raíz de tu foro, ya que se obtiene en el PASO 1), ingresa a la carpeta js, y luego abre el archivo skin.js.

Dentro de skin.js, busca la siguiente línea:

Código:
var customElements = "

Dentro de las comillas dobles, deberás añadir cada clase o ID's que quieras colorear con el colorpicker, separadas por coma, y deberás incluir los símbolos de ambos (un punto para las clases, y un numeral para los ID's).

Un ejemplo sería:

var customElements = ".pepe, .juan, .carlos, #header, #footer, #main"

También puedes elegir el color del texto, simplemente debes editar la variable que le sigue, la cual es "customText", y también funciona de la misma forma (Debes añadir las clases e ID's con su respectivo símbolo y aclarar también si deseas colorear un tag en particular como A, H1/2/3, etc).

Guardas los cambios en el archivo y listo! todo debería funcionar de 10.

Si desean obtener el color default de MyBB, luego de "customText", añaden debajo:

Código:
else{
        $(customElements).css("background-color","#3a85ba");
        $(customText).css("color","#3a85ba");
    }

Eso hará que tanto los elementos como el texto tengan el color default de MyBB.

Espero les sirva, sé que a más de uno NO LE VA A GUSTAR que yo haya posteado ésto, pero va siendo hora de que se comparta la información a todos (y vuelvo a aclarar que yo hice de traductor, ya que ésto lo hizo otra persona).

Fuente original: https://forum.mybboard.pl/wiki.php?dodan...belek.html

Saludos!
Eloy   24 Dec, 2013, 2:25 am
#2
Lo usare para una pagina en html que ando haciendo con el DW8

Aprendiendo cada vez mas
Cluster   28 Dec, 2013, 12:06 pm
#3
gracias por el tutorial, es lo que actualmente se utiliza en MyBB-Es

:)
Jaizu   28 Dec, 2013, 3:51 pm
#4
Sinceramente me gusta tener un estilo claro(ayuda a tener un diseño más sólido), pero esto nunca está de más la verdad.
Te dejo Rep~
storm   17 Feb, 2014, 5:59 am
#5
Alguna demo o imagen?¿
Ax5 Jersito   8 Apr, 2014, 2:40 pm
#6
Me Confundo en el paso 3 para arriba explicamelo mas mejor por favor no seas malo se ve interesante
Ax5 Jersito   2 Jul, 2014, 3:24 pm
#7
alguien me puede ayudar tengo el theme fortress 2.0
no entiendo este paso en que plantilla precisamente puedo pegar esto Ejemplo


Cita:PASO 3:

Busca la plantilla donde quieras añadir el botón que te permitirá mostrar la paleta del colorpicker. Luego copia y pega el siguiente código:

Código:
<span class='custom_theme'><input type='text' id='colorpicker' /></span>
BitLiberal   2 Jul, 2014, 7:17 pm
#8
(2 Jul, 2014, 3:24 pm)Ax5 Jersito escribió: alguien me puede ayudar tengo el theme fortress 2.0
no entiendo este paso en que plantilla precisamente puedo pegar esto Ejemplo


Cita:PASO 3:

Busca la plantilla donde quieras añadir el botón que te permitirá mostrar la paleta del colorpicker. Luego copia y pega el siguiente código:

Código:
<span class='custom_theme'><input type='text' id='colorpicker' /></span>

En la plantilla de la zona donde quieres que se muestre.
Cabecera en el header, pie de pagina en el footer, etc.

  • Temas personalizados (HTML5, flat, responsive, SEO Friendly, etc)
  • Plugins y sistemas personalizados (Galería de imagenes, Bolsa de Trabajo, etc)
DarkFinder   5 Jul, 2014, 10:29 pm
#9
Aquí encontraran los archivos del desarrollador que son los mismos que se usan aquí en MyBB-Es

ColorPicker - jQuery plugin
AndresXZ09   28 Apr, 2015, 4:26 pm
#10
¿Funciona en MyBB 1.6? ¿Alguien sabe?
Páginas (2): 1 2   
  
Powered By MyBB, © 2002-2024 MyBB Group.
Made with by Curves UI.