Cdigos WordPress

Cdigos rápidos

Copie los siguientes códigos y péguelos en la página de WordPress. En caso de presentar inconveniente péguelo en la pestaña HTML de WordPress:


Botón completo con Clases

El externado en los medios

Copie el siguiente código desde la pestaña HTML:

See the Pen
Código1
by katyavillo (@katyavillo08)
on CodePen.


Botón redondo con Clases

Inscríbase aquí

Copie el siguiente código desde la pestaña HTML:

See the Pen
Botón redondo
by katyavillo (@katyavillo08)
on CodePen.


Icono

Copie el siguiente código desde la pestaña HTML:

See the Pen
Icono UEC
by katyavillo (@katyavillo08)
on CodePen.


Icono redes sociales

Copie el siguiente código desde la pestaña HTML:

See the Pen
Botón redes
by katyavillo (@katyavillo08)
on CodePen.


Botón con vínculo e icono

Copie el siguiente código desde la pestaña HTML:

See the Pen
Boton icono UEC
by katyavillo (@katyavillo08)
on CodePen.


Tooltip con icono

Copie el siguiente código desde la pestaña HTML:

See the Pen
Tooltip UEC
by katyavillo (@katyavillo08)
on CodePen.


Carrusel de programas (17 programas)

Encuentre su programa

Copie el siguiente código desde la pestaña HTML:

See the Pen
Carrusel de programas
by katyavillo (@katyavillo08)
on CodePen.


Carrusel de programas

Título del carrusel

Copie el siguiente código desde la pestaña HTML:

See the Pen
Carrusel programas
by katyavillo (@katyavillo08)
on CodePen.

Contador

Días para el evento

  1. Copie el siguiente código, guárdelo en un html y súbalo al portal desde «medios».
  2. Posteriormente añádalo en la página como un iframe.

See the Pen
Contador Jornadas de Derecho Penal
by katyavillo (@katyavillo08)
on CodePen.

Altura de textarea

[contact-form-7 id=»512296″ title=»Convocatoria concurso estudiantil Legal Strategy Lab»]

  1. Copie el siguiente código, y peguelo en el campo CSS Adicional.

See the Pen
Height textarea
by katyavillo (@katyavillo08)
on CodePen.

Shortcodes

Los shortcodes se utilizan en el modo de edición visual y sirven para insertar elementos complejos sin necesidad de código HTML. Algunos de los códigos de la parte superior los incluyen; a continuación se presentan otros shortcodes implementados en el Portal Institucional.


Grupo de 3 tabs

Copie el siguiente código en la pestaña «Visual»:

See the Pen
Shortcode tabs
by José Luis Quintero (@jotaeleq)
on CodePen.

Grupo de más de 3 tabs

Copie el siguiente código en la pestaña «Visual»:

See the Pen
Tabs 3+
by José Luis Quintero (@jotaeleq)
on CodePen.

Grupo de tabs verticales

[vertical-tabs-container activeTab=2]
[vertical-tab title=»Título del tab 1″]

Text 1

Text 1 – Vivamus neque lectus, consequat at quam ac, pellentesque bibendum metus. Cras non lacus vehicula, ullamcorper diam sit amet, hendrerit arcu. In congue lorem sed ultrices pulvinar. Ut tincidunt augue in nunc consequat, et imperdiet diam venenatis. In sollicitudin libero in nisl elementum fermentum. Sed ante felis, lacinia eget justo sed, egestas hendrerit mauris. Fusce consequat eros odio, vitae porttitor nunc venenatis a. Vestibulum quis dictum nisl. Donec sagittis condimentum lectus nec rhoncus. Curabitur consectetur rutrum rutrum. Phasellus lobortis massa a bibendum egestas.

[/vertical-tab]
[vertical-tab title=»Título del tab 2″]

Text 2

Text 2 – Nunc quis nisi elit. Quisque vel libero porta, viverra leo placerat, pellentesque arcu. Integer faucibus metus at dolor fringilla, sit amet auctor elit auctor. Fusce tempor maximus justo, eget bibendum dolor ullamcorper vitae. Integer turpis neque, fringilla in pellentesque ut, pellentesque congue lacus. Quisque et urna erat. Curabitur ut ex ut nisi rutrum congue. Morbi mollis tortor metus, eget imperdiet justo condimentum elementum. Praesent sed feugiat diam. Cras quis pharetra lorem, in dignissim metus. Integer tempus tortor non felis bibendum egestas. Cras velit nulla, ultricies ut volutpat quis, pharetra eu neque. Duis consequat malesuada pretium.

[/vertical-tab]
[vertical-tab title=»Título del tab 3″]

Text 3

Text 3 -Vivamus neque lectus, consequat at quam ac, pellentesque bibendum metus. Cras non lacus vehicula, ullamcorper diam sit amet, hendrerit arcu. In congue lorem sed ultrices pulvinar. Ut tincidunt augue in nunc consequat, et imperdiet diam venenatis. In sollicitudin libero in nisl elementum fermentum. Sed ante felis, lacinia eget justo sed, egestas hendrerit mauris. Fusce consequat eros odio, vitae porttitor nunc venenatis a. Vestibulum quis dictum nisl. Donec sagittis condimentum lectus nec rhoncus. Curabitur consectetur rutrum rutrum. Phasellus lobortis massa a bibendum egestas.

[/vertical-tab]
[vertical-tab title=»Título del tab 4″]

Text 4

Text 4 – ivamus neque lectus, consequat at quam ac, pellentesque bibendum metus. Cras non lacus vehicula, ullamcorper diam sit amet, hendrerit arcu. In congue lorem sed ultrices pulvinar. Ut tincidunt augue in nunc consequat, et imperdiet diam venenatis. In sollicitudin libero in nisl elementum fermentum. Sed ante felis, lacinia eget justo sed, egestas

[/vertical-tab]
[vertical-tab title=»Título del tab 5″]

Text 5

Text 5 – Vivamus neque lectus, consequat at quam ac, pellentesque bibendum metus. Cras non lacus vehicula, ullamcorper diam sit amet, hendrerit arcu. In congue lorem sed ultrices pulvinar. Ut tincidunt augue in nunc consequat, et imperdiet diam venenatis. In sollicitudin libero in nisl elementum fermentum. Sed ante felis, lacinia eget justo sed, egestas hendrerit mauris. Fusce consequat eros odio, vitae porttitor nunc venenatis a. Vestibulum quis dictum nisl. Donec sagittis condimentum lectus nec rhoncus. Curabitur consectetur rutrum rutrum. Phasellus lobortis massa a bibendum egestas.

Nunc quis nisi elit. Quisque vel libero porta, viverra leo placerat, pellentesque arcu. Integer faucibus metus at dolor fringilla, sit amet auctor elit auctor. Fusce tempor maximus justo, eget bibendum dolor ullamcorper vitae. Integer turpis neque, fringilla in pellentesque ut, pellentesque congue lacus. Quisque et urna erat. Curabitur ut ex ut nisi rutrum congue. Morbi mollis tortor metus, eget imperdiet justo condimentum elementum. Praesent sed feugiat diam. Cras quis pharetra lorem, in dignissim metus. Integer tempus tortor non felis bibendum egestas. Cras velit nulla, ultricies ut volutpat quis, pharetra eu neque. Duis consequat malesuada pretium.

[/vertical-tab]
[/vertical-tabs-container]

Copie el siguiente código en la pestaña «Visual»:

See the Pen
Vertical tabs
by José Luis Quintero (@jotaeleq)
on CodePen.

Acordeón4>

Copie este código en la pestaña «Visual»:

See the Pen
Accordion
by José Luis Quintero (@jotaeleq)
on CodePen.