Tutorial: [Yellow Pencil] ¡Aprovecha el bug! Tutorial Usuario Premium

elasticgirl

VIP
Delta
Verificación en dos pasos activada
¡Ha verificado su Paypal!
Desde
23 May 2019
Mensajes
601
¡Hola a todos! Hoy le traigo un tuto para usar Yellow Pencil en modo Premium. Esto es un bug que tiene el plugin, así que se instalan la aplicación desde el mismo Wordpress.




PASO 1:

Inciar sesión en Wordpress

1-Installing-NoFollow.png

PASO 2

Descargamos el plugin AQUÍ y luego lo subimos a Wordpress (sino lo buscan directamente desde allí)

2-Installing-Yellow-Pencil-1024x576.jpg


PASO 3

Activar el plugin una vez instalado


¿Cómo usar Yellow Pencil?

Una vez activo el plugin, van a ver una pantalla de bienvenida y un nuevo menú a la izquierda llamado "Yellow Pencil". Se va a ver así:

3-Using-Yellow-Pencil-1024x721.jpg


Como pueden notar, vamos a poder modificar los estilos, agregar animaciones y mucho más!


¡Y ahora comienza lo mágico!

Para comenzar a utilizar el plugin, vamos a abrir nuestra página web (siempre estando logueado) en otra pestaña y vamos a dar click en "Editar con Yellow Pencil" que se encuentra en la parte superior de la pantalla:

Editing-a-page-with-Visual-Pencil-visual-CSS-editor-1024x129.png

Cuando ya se cargue el plugin, van a ver lo siguiente:

5-Using-Yellow-Pencil-768x608.jpg


Ah! Antes de que se cargue el plugin se va a abrir un pop up en donde les pregunta qué es lo que quieren modificar:

Global Customize: las modificaciones que se hagan van a ser aplicadas en toda la web. Es ideal para modificar por ejemplo, el pie de página, el menú o cualquier elemento de navegación.

Customize One Page: sólo se realizarán cambios en una página específica (la que ustedes elijan)

Customize Template: sólo se harán cambios en plantilla. (la verdad mucho no entiendo esta opción)

Bueno, del lado izquierdo van a tener muchas opciones para modificar.


7-Using-Yellow-Pencil.png

Para nosotros el más importante es el "LIVE CSS EDITOR"

¿Por qué? Porque todas las modificaciones que hagamos las veremos allí Y ESO ES LO QUE VAMOS A RECOLECTAR

Una vez que editamos la web a nuestro gusto, vamos a LIVE CSS EDITOR en donde allí nos mostrarán los códigos css, o sea los cambios que le hicimos a nuestra página, LO RECORTAMOS Y LO PEGAMOS EN "CSS ADICIONAL" DE NUESTRO TEMPLATE.

Y listo!!!

Si quieren primero practicar, les recomiendo que visiten este
DEMO

Espero les haya servido el tuto. Perdon si doy medio bestia en explicar. Saludos!

Imágenes recolectadas de : https://solvid.co.uk/yellow-pencil/
 

renton

Baneado
Delta
Verificación en dos pasos desactivada
Desde
5 Feb 2014
Mensajes
633
¿Y cuando el Theme lance una actualización? ¿Qué pasará?
 

YessyCo

VIP
Épsilon
Influencer
Verificación en dos pasos desactivada
Verificado por Whatsapp
Desde
4 Feb 2020
Mensajes
831
Buen aporte, probare a ver como os va
 

dalex

VIP
Gamma
Verificación en dos pasos desactivada
Verificado por Whatsapp
Desde
5 Jun 2017
Mensajes
166
Muchas gracias buenísimo el aporte .
 

Arriba