CMS WordPress

[WordPress] Añadir subíndices y superíndices en tu web

Photo by JESHOOTS.COM on Unsplash
[titulo]¿Cómo poner elevado al cuadrado, al cubo… en WordPress?[/titulo]

¿Te gustaría escribir cosas como…

Superíndice –> 20m2

Subíndice –> H2O

…pero no encuentras la manera de hacerlo? ¡Loopeando.com tiene la solución!

O mejor dicho, LAS soluciones. Puesto que vamos a contaros todos los caminos para conseguirlo, empezando por los más sencillos y rápidos hasta acabar con los métodos más permanentes y profesionales.

¿Empezamos?

[resumen]
  1. Copiar los caracteres.
  2. Símbolos especiales para ocasiones especiales
  3.  Etiquetas HTML
  4.  ¿Probamos con CSS?
  5.  Hagamos bien las cosas:  Habilitar botones en el editor de WordPress[/resumen]

 

[titulo]Copiar los caracteres[/titulo]

Tan sencillo como práctico. ¿O acaso no es lo que hemos hecho todos cada vez que teníamos que poner aquello de CopyRight ©?

Aprovecha y copia el carácter 😉

 mm³ mmmmmm9

 

[titulo]Símbolos especiales para ocasiones especiales[/titulo]

Existe un botón en el que pocas veces reparamos. Tiene forma de herradura y nos da acceso a un mapa de caracteres.

En dicho mapa podrás seleccionar algunos de los superíndices más comunes: ¹, ² y ³

 

[titulo]Etiquetas HTML[/titulo]

Si en lugar de utilizar la pestaña “Visual” del editor de WordPress nos vamos a la de “HTML”, podremos añadir estas etiquetas:

10<sub>2</sub>

Que en la parte gráfica aparecerá como:   102

10<sup>2</sup>

Que en la parte gráfica aparecerá como:   10²

 

[titulo]¿Probamos con CSS?[/titulo]

Algunos temas de WordPress no tienen definidos los estilos para subíndices ni superíndices. Así que no importa lo que hagamos, que si no los definimos nosotros, nunca se mostrarán como tales.

Para arreglarlo tenemos que añadir:

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}
sup {
    top: -0.5em;
}
sub {
    bottom: -0.25em;
}

Esto hay que ponerlo en la hoja de estilos de nuestro tema activo, del tema hijo o a través de un plugin para añadir CSS personalizado.

 

[titulo]Hagamos bien las cosas:  Habilitar botones en el editor de WordPress[/titulo]

WordPress emplea un editor llamado TinyMCE. Es muy potente y tiene muchísimas opciones, tantas que por defecto la inmensa mayoría están ocultas.

Habitualmente el editor te muestra las más comunes, pero si queremos podemos habilitar las que deseemos como, en este caso, los botones de subíndices y superíndices:

Para habilitarlos tendremos que utilizar la siguiente función, que ha de ponerse en el archivo [codigo]functions.php[/codigo], para lo cual necesitaremos accesos FTP.

Os recordamos que el archivo functions.php se encuentra en /wp-content/theme/nombre_tema_activo/ y que lo ideal es que antes de modificar ese archivo:

  1. Creemos una copia de seguridad
  2. Creemos un tema hijo

La función es:

function activar_botones_editor( $botones ) {
$botones[] = 'superscript';
$botones[] = 'subscript';
return $botones;
}
add_filter( 'mce_buttons_2', 'activar_botones_editor' );

Y si no funcionase, podemos probar con esta otra:

function my_mce_buttons_2($buttons) {	
	$buttons[] = 'sup';
	$buttons[] = 'sub';

	return $buttons;
}
add_filter('mce_buttons_2', 'my_mce_buttons_2');

 

¿Hemos conseguido ayudarte? Recuerda: Cada vez que no compartes un aporte, Dios mata un gatito.

 

Cristian Sarabia Martínez

Desde que a principios de los 90 mi padre desempolvó su Spectrum, no he dejado de probar y experimentar con la tecnología.

Enamorado del mundo web, Full Stack Developer de profesión y diseñador por devoción.

Ahora hago mis pinitos en esto del blogging para compartir con vosotros un poquito de todo lo que la comunidad me ha dado.

1 Comentario

Haz clic aquí para dejar tu comentario

Responder a Juan Cancelar Respuesta

  • Sensacional contenido Cristian.
    Una cosilla Cristian por favor, cómo podríamos poner una letra o un símbolo.
    Por ejemplo el logo de Amazon (la a con la sonrisa debajo y la flecha).
    Muchas gracias.

Flickr

  • bolet à voilette
  • bolet à voilette
  • l'oignon
  • Uberleben
  • Anja
  • Reader
  • très près
  • brève
  • dans un filet

About Author

ThemeForest

Collaboratively harness market-driven processes whereas resource-leveling internal or "organic" sources. Competently formulate.

Calendar

septiembre 2025
L M X J V S D
1234567
891011121314
15161718192021
22232425262728
2930  

RSS Meks Blog

  • How Adding Slack Bot Boosted Our Culture of Appreciation 3 julio, 2024
    Sweet Kudos is a Slack bot that enhances employee recognition, rewards, and celebrations within your team. It empowers team members to express gratitude and appreciation effortlessly by giving virtual Kudos. The post How Adding Slack Bot Boosted Our Culture of Appreciation appeared first on Meks.
    Dusan Milovanovic
  • 10 Best Knowledge Base & Wiki WordPress Themes 2021 15 septiembre, 2021
    Running a successful online business requires an exceptional WordPress knowledge base theme that organizes documentation and helps customers. Customization options, intuitive navigation, unique layouts, and fast responsiveness are just some of the features you need. The following 10 WordPress wiki themes represent the best options for 2021 and beyond. Explore the full range to determine […]
    Dusan Milovanovic
  • How to increase WordPress Memory Limit (quick fixes) 16 junio, 2021
    Here is a post about how to increase the memory limit in WordPress. Allowed memory size exhausted error message showed up in your WordPress installation? No worries – this is one of the most common errors in WordPress. You can apply an easy fix by increasing the memory limit in your PHP. Table of Contents […]
    Dusan Milovanovic
  • How to use (and why) WordPress sitemap plugin 1 marzo, 2021
    Did you know that by knowing how to use the WordPress sitemap plugin you can significantly improve your site’s visibility and traffic? Although it isn’t mandatory to have a sitemap on your site, having one significantly improves the site’s quality, crawlability and indexing. All this is important for better optimization, which is why we wanted […]
    Ivana Cirkovic
  • 22 free and premium podcast software for your show [2021 edition] 18 enero, 2021
    You’re determined to start or improve your podcast but don’t know which podcast software to use to really make it stand out? We’ve got you! #podcasting Top 22 free and premium podcast software for your show #WordPressTips #podcasting The post 22 free and premium podcast software for your show [2021 edition] appeared first on Meks.
    Ivana Cirkovic
  • Digital storytelling with WordPress – an all-in-one guide to make your web stories pop! 23 noviembre, 2020
    Wondering how to improve digital storytelling with WordPress and build more awareness and exposure of your business? Let our guide lead the way. The post Digital storytelling with WordPress – an all-in-one guide to make your web stories pop! appeared first on Meks.
    Ivana Cirkovic
  • How to use WordPress autoposting plugin to improve your visibility and SEO? 10 septiembre, 2020
    Did you know you can use the WordPress autoposting plugin for your content efforts and improve not only your time management but your business and visibility as well? The post How to use WordPress autoposting plugin to improve your visibility and SEO? appeared first on Meks.
    Ivana Cirkovic
  • How to create a personal branding site? Step-by-step DIY guide 15 agosto, 2020
    Looking for ways and means to create a personal branding site? Well, look no further ’cause we’re giving away all the how-to’s to do it yourselves! The post How to create a personal branding site? Step-by-step DIY guide appeared first on Meks.
    Ivana Cirkovic
  • Top 15 WordPress content plugins and tools to improve your visibility and rankings 16 julio, 2020
    Let’s take a look at some of the must-have WordPress content plugins and tools to use to improve both your UX and rankings. The post Top 15 WordPress content plugins and tools to improve your visibility and rankings appeared first on Meks.
    Ivana Cirkovic
  • WCEU 2020 recap – key takeaways from the biggest online WordPress conference 9 junio, 2020
    Missed WCEU 2020 and all the exciting stuff from there? Here are all the key takeaways and main points to remember so, take notes! The post WCEU 2020 recap – key takeaways from the biggest online WordPress conference appeared first on Meks.
    Ivana Cirkovic

Text

Distinctively utilize long-term high-impact total linkage whereas high-payoff experiences. Appropriately communicate 24/365.

Archives