Þ•„¿ìè é @ø 9×3ÞF°`÷”X`íNYhÂGÓ $2*AlDˆ Í<×0&L sª}(1F,Z ‡‘¢¶ È/Ò-éC‚-°KÀ Tn„–)¨ ÒÞíB NeÐY6(!¹ Û'è 1@%SUy Ï"ÚrýßpcP ´ É Þ ç ð Ný (L!u!‡!!™!»!×!÷! "ƒ"£#¸#Í#_ì#"L%ðo%®`& ''+'Â4'†÷' ~(Ÿ(®(LË(2) K)X)³x)¼,*é*¹i+#->@.=/ï½/Ö­0=„1#Â2(æ2Š3Dš3ß3å3ö344…74=½5Žû5hŠ6ó7 ÷7Ù8²Þ8¢‘94:eN:’´:)G;q;†;‰;$‘;U¶<s ?¤€@%AB4B«wBB#CsfC¡ÚCm|DêDbEkEY}E×E àE îE:ûE6FOQF ¡F“¬F#@H%dH&ŠH ±H̽HŠJ“J±J.ÄJ óJþJ KK 5K/@KpK‰K£K¿K›ÒLnMWƒM ÛMtèM]NvNŒN8¥N ÞNìN$O=%O¡cO{P\P/ÞP+Q :Q'HQ0pQ¡Q²Q6ÑQUR^R-qRvŸRÌS˜ãS|T ™TºTÂTËTdÚT6?UvUŽU&¤UËU!éU# V /V;VÉWéWX˜X/¶YæYçûZã[÷[ \×\¥í\“] ¬]+º]hæ]1O^ ^&^½´^Ór_‰F`îÐ`"¿b[âc=>eG|eïÄfm´g)"i4Li“iWjmjqj„j"™j¼j¹ÖjGlØl«imooé)oÎpÂâp¥q~¿q¡>r,àr s"s $s(~ncJvY6[ix8†Eue^‹+tzq3& }XAm;…ˆZRUCVp‰>ha/M '| O?j‚Q={5D„ ]")r-F:<%$7Lk@GŠf 10`K2l,‡bW.P#4ds9N €ƒgT\IyŒwSoHB!*_ Use with caution! Checking this will automatically add the SVG class to ALL image tags containing SVG file sources in the rendered HTML via javascript and will therefore render all of your SVG files inline.
Use case scenario: When using a visual builder such as in the Divi Theme or The Divi Builder, the class is not automatically added with the "Automatically insert class?" option selected or the builder module doesn't give you the option to manually add a CSS class directly to your image. Checking this will make sure that either the default class or the custom one you set below is inserted into the style attributes of img tags when you insert SVG images. Additionally, it will remove all of the default WordPress classes. It will leave normal image types as default and only affect SVG files. Checking this will use the expanded JS file instead of the minified JS file. Useful if you want to minify this externally using a caching plugin or similar. Normally, scripts are placed in head of the HTML document. If this parameter is true, the script is placed before the closing body tag. This requires the theme to have the wp_footer() template tag in the appropriate place. Restricts SVG upload privileges to Administrators. You don't need to enable this to simply use SVG files as images. Enabling this will trigger advanced options and SVG functionality such as inline rendering.(You don't need to send me that much though, anything is appreciated!)- You will need to set your own height and width in your CSS for SVG files to display correctly.- Your uploaded image needs to be an SVG file for this plugin to replace the img tag with the inline SVG code. It will not create SVG files for you.SVG Support ForumA huge thanks in advance!A very small piece of code that helps with displaying SVGs on the frontend in some cases.About The PluginAdd your featured SVG like you would any regular featured image format.AdvancedAdvanced ModeAdvanced UsageAn online tool to optimize your SVG files.Animate SVG using CSS or JSAnimate and Optimize your SVG files using these open source projectsAnimationAt it's core, SVG Support allows you to upload SVG files and use them as you would any regular image with the added benefit of being scalable and looking great on any screen size, no matter what size it's displayed. Additionally, SVG file sizes are (more often than not) much smaller than conventional image formats.Automatically Insert Class:Automatically insert class?BTC: 1qF8r2HkTLifND7WLGfWmvxfXc9ze55DZBasic UseBefore you upload your SVG, you're going to need some classes to target inside your SVG. To do this, open your SVG file in the code editor of choice (I use Sublime Text). You will see each element within your SVG file written in XML code. Each little part of your SVG has it's own bit of code, so it's up to you which ones you want to target. It's in here that you'll place your new classes on each element you want to target.BenbodhiCSS Class To Target:CSS Class to targetCompress and Optimize Images with ShortPixelDONATIONSDonate to authorDonate using PayPalDonation Methods:DonationsETH: 0x599695Eb51aFe2e5a0DAD60aD9c89Bc8f10B54f4Enable Advanced ModeEnable Advanced Mode:Enable Advanced Mode?Enabling "Advanced Mode" displays options to give you more control over how you use SVG files on your site. It also includes extra JS on the front end, so leave this disabled unless you're actually using any of the advanced features.Even this most basic of usage is very powerful for modern websites, however, there's lots of cool stuff you can do with SVG files!Featured ImagesFirst, let's talk about using CSS or JS to target elements within your SVG.For example:For help and more information, please check the help tab (top right of your screen).For more help, visit:Force Inline SVG:Force Inline SVG?Force all SVG files to be rendered inlineGet SupportHaving Issues?I'm always happy to help out!If you like SVG Support please consider leaving aIf you like SVG Support please leave a %s★★★★★%s rating. A huge thanks in advance!If you updated SVG Support from any version prior to 2.3 and you use the inline SVG features, please If you upgrade to a paid plan, I'll receive a small commission... And that's really nice!Include multiple URL's inside single SVGInline SVG featured image supportIntroductionLTC: LUnQPJrSk6cVFmMqBMv5FAqweJbnzRUz4oLearn more about SVG Support on:Leave a ReviewLoad frontend CSS?Make sure "Advanced Mode" is enabled.My Coinbase referral link will get $10 USD worth of BTC for free when you spend $100.Need help?Need to buy some crypto to donate?Now that you've set up SVG Support on your site, it's time to look at optimizing your existing images (jpg & png).Now, embed your SVG image like a standard image with the addition of adding the class style-svg (or your custom class from above) to any IMG tags that you want this plugin to swap out with your actual SVG code.Once the screen reloads, click the new checkbox below the featured image to render your SVG inline.Output JS in Footer:Output JS in Footer?OverviewPayPal: Please Note:Publish, Save Draft, or Update the post a final time to render the SVG inline.Publish, Save Draft, or Update the post.Ratings & ReviewsRender SVG InlineRender this SVG inline (advanced)Restrict To Administrators:Restrict to Administrators onlyRestrict to Administrators?SVG SupportSVG Support (this plugin) has grown to be used by over 100,000 websites actively and is maintained solely by one person. I couldn't possibly tell you how many hours have gone into the development, maintenance and support of this plugin. If you find it useful and would like to donate to help keep it going, that would be amazing! I truly appreciate the support and how far this has come.SVG Support FeaturesSVG Support SettingsSVG Support Settings and UsageSVG Support features an "Advanced Mode" which toggles extra features, allowing you to take more control of how your SVG files are used. By rendering SVG files inline, it opens up a huge number of possibilities including animations, embedded links within the SVG, odd shaped link areas, custom CSS targeting elements within the SVG and whole lot more!SVG Support for your media librarySVG Support has grown to be installed on 300,000+ active websites. That's insane! It's developed and maintained by one person alone. If you find it useful, please consider donating to help keep it going. I truly appreciate any contribution.SVG files are actually XML code, so allowing regular users to upload them can pose serious security risks. Please leave this checked unless you really know what you're doing.Save ChangesSend Some LoveSettingsShortPixel improves website performance by reducing the size of your images. The results are no different in quality from the original, plus your originals are stored in a backup folder for you.So let's get into some more details! Simply click the tabs to the left to get more of an understanding of how powerful SVG Support is.So you want to animate your SVG?Standard UsageStyle SVG elements using CSSSupport is handled exlusively through WordPress.org by my one man team - me.Thanks for your support, please consider donating.The SettingsThe WordPress Plugin RepositoryThe default target class is style-svg. You can change it to your own class such as my-class by typing it here.
Leave blank to use the default class.The main purpose of this is to allow styling of SVG elements. Usually your styling options are restricted when using embed, object or img tags alone.The whole IMG tag element will now be dynamically replaced by the actual code of your SVG, making the inner content targetable.Then there's the option of animating the SVG file itself. There is a number of online tools to do this, or you can use the software of your choice. Once your SVG is animated and ready to go, you then upload it like any other image to your WordPress media library. When you embed it on a page/post, you will need to make sure to add the class to the IMG tag so SVG Support can render it inline. This will ensure your animations are displayed.There's a number of ways you can animate an SVG. You could use CSS or JS to target elements within your SVG or even embed the animations in the file itself. Whichever way you choose, there is always a little bit of preparation required before uploading your SVG to your media library.This allows you to set your own custom class that you will use in your SVG source IMG tags that you would like rendered inline. For example, it might be easier for you to remember to add the class "inline-svg" or something, in which case you would use your desired class name in this field to be used across your site.This allows you to target elements within your SVG using CSS.This feature is to force all SVG files that are found in your site to be rendered inline. This can help if you aren't able to set a custom class on your IMG tags for some reason, usually when used in theme options or page builder elements.This setting allows you to choose whether the SVG Support JS file is enqueued in the header or the footer of the site. Usually you would enqueue in the footer unless you need it to be loaded sooner for some reason.This setting gives you the choice of JS file that is enqueued, the full expanded version or the minified version. You would usually enqueue the minified version, but if you want to bundle the JS file using a caching or minification plugin or similar, then you might want to enqueue the expanded, non-minified version.To render your featured SVG inline:Try ShortPixel WordPress Plugin for FREEUpload SVG files to the Media Library and render SVG files inline for direct styling/animation of an SVG's internal elements using CSS/JS.Upload your SVG files and use the tools provided to animate strokes.UsageUse Expanded JS:Use Expanded JS?Use odd shapes as linksVisit The Support ForumWhen this is checked, you won't have to add the class to your SVG files during the embed process in the editor. When you pick your SVG, it will be placed in the editor with just the SVG Support class and others stripped. It does not change existing code, it's only a helper to allow you to quickly embed your SVG files and have them render inline without having to fiddle with the classes.When using SVG files like regular images just isn't enough ;)When using SVG images on your WordPress site, it can be hard to style elements within the SVG using CSS. Now you can, easily!When you enable advanced mode, this plugin not only provides SVG Support like the name says, it also allows you to easily embed your full SVG file's code using a simple IMG tag. By adding the class style-svg to your IMG elements, this plugin dynamically replaces any IMG elements containing the style-svg class with your complete SVG.YesYou can alsoYou can embed your SVG image like any standard image with the addition of adding the class style-svg (or your custom class) to any IMG tags that you want this plugin to swap out with your actual SVG code.You can simply upload SVG files to your media library like any other image. Make sure to select "Restrict to Administrators" if you only want to allow admins to upload SVG files.You can use SVG files as featured images just like any other image format, with the addition of being able to render your featured SVG inline on a per-post basis.You can't play with this.You will likely need to set your own height and width in your CSS for SVG files to display correctly.Your uploaded image needs to be an SVG file for this plugin to replace the img tag with the inline SVG code. It will not create SVG files for you.http://wordpress.org/plugins/svg-support/https://benbodhi.comorrating.PO-Revision-Date: 2021-09-28 10:00:34+0000 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Plural-Forms: nplurals=2; plural=n != 1; X-Generator: GlotPress/3.0.0-alpha.2 Language: es Project-Id-Version: Plugins - SVG Support - Stable (latest release) ¡USAR CON CUIDADO! Si se marca esto, se añadirá automáticamente la clase SVG a TODAS las etiquetas de imagen que contengan archivos SVG en el HTML procesado a través de javascript y, por lo tanto, se procesarán todos los archivos SVG integrados.
Ejemplo de uso: Cuando se utiliza un constructor visual como en el tema Divi o el constructor de Divi, la clase no se añade automáticamente con la opción «Insertar clase automáticamente» seleccionada o el módulo constructor no te da la opción de añadir manualmente una clase CSS directamente a tu imagen. Mancando esto te aseguras de que la clase por defecto o la personalizada que establezcas a continuación se inserte en los atributos de estilo de las etiquetas img cuando insertes imágenes SVG. Además, eliminará todas las clases predeterminadas de WordPress. Dejará los tipos de imagen normales como predeterminados y sólo afectará a los archivos SVG. Marcando esto se usará el archivo JS expandido en lugar del archivo JS minimizado. Útil si quieres minimizarlo externamente usando un plugin de caché o similar. Normalmente, los scripts se colocan en el head del documento HTML. Si este parámetro es true, el script se coloca antes de la etiqueta body de cierre. Esto requiere que el tema tenga la etiqueta wp_footer() en el lugar apropiado. Restringe los privilegios de subida de SVG a los administradores. No es necesario activar esta opción para utilizar archivos SVG como imágenes. Activar esto activará opciones avanzadas y funcionalidad SVG como el procesado integrado.(¡No hace falta que me envíes tanto, se aprecia cualquier cosa!)- Tendrás que establecer tu propia altura y anchura en el CSS para que los archivos SVG se muestren correctamente.- Tu imagen subida necesita ser un archivo SVG para que este plugin para reemplace la etiqueta img con el código SVG en línea. No creará archivos SVG para ti.Foro de soporte de SVG Support¡Muchas gracias de antemano!Una porción de código muy pequeña que, en algunos casos, ayuda a mostrar los SVG en la portada.Acerca del pluginAñade tu SVG destacado como lo harías con cualquier formato de imagen destacada normal.AvanzadoModo avanzadoUso avanzadoUna herramienta en línea para optimizar tus archivos SVG.Animar SVG usando CSS o JSAnima y optimiza tus archivos SVG utilizando estos proyectos de código abiertoAnimaciónEn su núcleo, el SVG Support te permite subir archivos SVG y utilizarlos como si se tratara de cualquier imagen normal, con la ventaja añadida de ser escalable y tener un aspecto excelente en cualquier tamaño de pantalla, independientemente del tamaño que se muestre. Además, los tamaños de archivo SVG son (la mayoría de las veces) mucho más pequeños que los formatos de imagen convencionales.Insertar automáticamente la clase:¿Insertar la clase automáticamente?BTC: 1qF8r2HkTLifND7WLGfWmvxfXc9ze55DZUso básicoAntes de subir tu SVG, vas a necesitar algunas clases a las que apuntar dentro de tu SVG. Para ello, abre su archivo SVG en el editor de código de tu elección (yo utilizo Sublime Text). Verás cada elemento dentro de tu archivo SVG escrito en código XML. Cada pequeña parte de su SVG tiene su propia porción de código, así que depende de a cuáles quieras dirigirte. Es aquí donde colocarás tus nuevas clases en cada elemento al que quieras dirigirte.BenbodhiClase CSS a la que dirigirse:Clase CSS objetivoComprimir y optimizar imágenes con ShortPixelDONACIONESDonar al autorDonar con PayPalMétodos de donación:DonacionesETH: 0x599695Eb51aFe2e5a0DAD60aD9c89Bc8f10B54f4Activar el modo avanzadoActivar el modo avanzado:¿Activar el modo avanzado?Al activar el «Modo avanzado» se muestran las opciones para darte más control sobre el uso de los archivos SVG en tu sitio. También incluye JS extra en la parte pública de la web, así que déjalo desactivado a menos que estés usando alguna de las funciones avanzadas.Incluso este uso más básico es muy poderoso para los sitios web modernos, sin embargo, ¡hay muchas cosas geniales que puedes hacer con los archivos SVG!Imágenes destacadasPrimero, hablemos sobre el uso de CSS o JS para dirigirse a elementos dentro de tu SVG.Por ejemplo:Para obtener ayuda y más información, consulta la pestaña de ayuda (en la parte superior derecha de la pantalla).Para más ayuda, visita:Forzar SVG integrado:¿Forzar SVG integrados?Forzar que todos los archivos SVG se procesen integradosObtener ayuda¿Tienes problemas?¡Siempre estoy encantado de ayudar!Si te gusta SVG Support, considera dejar unaSi te gusta SVG Support, por favor, deja una valoración de %s★★★★★★★%s. ¡Muchas gracias de antemano!Si ha actualizado SVG Support desde cualquier versión anterior a la 2.3 y utilizas las funciones SVG integrado, por favor Si te cambias a un plan de pago, recibiré una pequeña comisión.... ¡Y eso es muy bonito!Incluir múltiples URLs dentro de un único SVGCompatibilidad con imágenes SVG integradosIntroducciónLTC: LUnQPJrSk6cVFmMqBMv5FAqweJbnzRUz4oAprende más sobre la compatibilidad con SVG en:Deja una reseña¿Cargar el CSS de la portada?Asegúrate de que el «Modo Avanzado» está activado.Mi enlace de referido de Coinbase obtendrá $10 USD de BTC gratis cuando gastes $100.¿Necesitas ayuda?¿Necesitas comprar criptomonedas para donar?Ahora que has configurado el SVG Support en tu sitio, es el momento de optimizar tus imágenes existentes (jpg y png).Ahora, incluye tu imagen SVG como una imagen estándar añadiendo la clase style-svg (o tu clase propia definida arriba) a cualquier etiqueta IMG que quieres que se cambie por el código SVG.Una vez que la pantalla se haya recargado, haz clic en la nueva casilla de verificación debajo de la imagen destacada para renderizar tu SVG en línea.Salida JS en pie de página:¿Poner JS en el pie de página?ResumenPayPal: Ten en cuenta:Publica, guardar el borrador o actualiza la entrada por última vez para que el SVG esté en línea.Publica, guardar como borrador o actualiza la entrada.Valoraciones y reseñasMostrar SVG integradoProcesar este SVG integrado (avanzado)Restringir a administradores:Restringido a los administradores¿Restringir a los administradores?SVG SupportSVG Support (este plugin) ha crecido hasta ser utilizado por más de 100.000 sitios web activamente y es mantenido por una sola persona. No podría decirte cuántas horas he dedicado al desarrollo, mantenimiento y soporte de este plugin. Si lo encuentras útil y te gustaría donar para ayudar a mantenerlo en marcha, ¡sería increíble! Agradezco sinceramente el apoyo y lo lejos que ha llegado.Características de SVG SupportAjustes de SVG SupportAjustes y uso de SVG SupportSVG Support incluye un «Modo avanzado» que activa las funciones adicionales que te permiten tener más control sobre cómo se utilizan tus archivos SVG. Al procesar archivos SVG integrados, se abren un gran número de posibilidades, incluyendo animaciones, enlaces incrustados dentro del SVG, áreas de enlaces con formas extrañas, apuntar con CSS a elementos personalizados dentro del SVG ¡y mucho más!Compatibilidad SVG para la biblioteca de mediosSVG Support ha crecido hasta instalarse en más de 300.000 webs activas. ¡Eso es una locura! Está desarrollado y mantenido por una sola persona. Si lo encuentras útil, por favor, considera donar para ayudar a mantenerlo en marcha. Realmente aprecio cualquier contribución.Los archivos SVG son en realidad código XML, por lo que permitir a los usuarios habituales cargarlos puede suponer un grave riesgo para la seguridad. Por favor, deja esto marcado a menos que realmente sepas lo que estás haciendo.Guardar los cambiosEnvia un poco de amorAjustesShortPixel mejora el rendimiento del sitio web al reducir el tamaño de las imágenes. Los resultados no difieren en calidad del original y, además, los originales se almacenan en una carpeta de copia de seguridad.¡Así que vamos a entrar en más detalles! Simplemente haz clic en las pestañas de la izquierda para obtener más información sobre lo potente que es SVG Support.¿Quieres animar tu SVG?Uso estándarDarle estilo a los elementos SVG usando CSSEl soporte es gestionado exclusivamente a través de WordPress.org por mi equipo de un solo hombre - yo.Gracias por tu apoyo. Por favor, considera donar.Los ajustesEl repositorio de plugins de WordPressLa clase por defecto es style-svg. Puedes cambiarla por una clase propia como my-class escribiéndola aquí.
Déjalo en blanco para usar la clase por defecto.El objetivo principal es permitir darle formato a los elementos SVG. Normalmente las opciones de formato están restringidas al usar solo las etiquetas embed, object o img.Toda la etiqueta IMG se reemplaza de forma dinámica con el código del SVG haciendo que se pueda hacer referencia al contenido interior.Luego está la opción de animar el propio archivo SVG. Hay una serie de herramientas en línea para hacerlo, o puedes utilizar el software de tu elección. Una vez que tu SVG esté animado y listo para funcionar, cárgalo como cualquier otra imagen a tu biblioteca de medios de WordPress. Cuando lo incrustas en una página/entrada, tendrás que asegurarte de añadir la clase a la etiqueta IMG para que SVG Suppor pueda renderizarla en línea. Esto asegurará que tus animaciones se muestren.Hay varias formas de animar un SVG. Puedes utilizar CSS o JS para dirigirte a elementos dentro de tu SVG o incluso incrustar las animaciones en el propio archivo. Sea cual sea la forma que elijas, siempre se requiere un poco de preparación antes de subir su SVG a tu biblioteca multimedia.Esto te permite establecer tu propia clase personalizada que utilizará en las etiquetas IMG con SVG que te gustaría que se procesarán integrados. Por ejemplo, podría ser más fácil para ti recordar añadir la clase «inline-svg» o algo así, en cuyo caso usarías el nombre de clase que quieras en este campo para ser usado en todo el sitio.Esto permite hacer referencia a los elementos SVG usando CSS.Esta característica es para forzar que todos los archivos SVG que se encuentran en el sitio sean procesados integrados. Esto puede ayudar si no puedes establecer una clase personalizada en tus etiquetas IMG por alguna razón, normalmente cuando se utiliza en las opciones de tema o en los elementos de generadores de páginas.Este ajuste te permite elegir si el archivo JS de SVG Support está en cola en el encabezado o en el pie de página del sitio. Por lo general, se encolaría en el pie de página, a menos que necesites que se cargue antes por alguna razón.Este ajuste te da la opción de elegir entre encolar para el archivo JS la versión ampliada completa o la versión minimizada. Por lo general, la versión que se encola es la versión minimizada, pero si quieres agrupar el archivo JS utilizando un plugin de caché o de optimización o similar, es posible que quieras agrupar la versión expandida y no minimizada.Para procesar tu SVG destacado integrado:Prueba GRATIS el plugin de ShortPixel para WordPressSube archivos SVG a la biblioteca de medios y los muestra integrados para el estilo/animación directa de los elementos internos utilizando CSS/JS.Sube tus archivos SVG y utiliza las herramientas proporcionadas para animar los trazos.UsoUsar JS expandido:¿Usar JS expandido?Usar formas extrañas como enlacesVisita el Foro de soporteCuando esta opción está seleccionada, no tendrás que añadir la clase a sus archivos SVG durante el proceso de incrustación en el editor. Cuando elijas tu SVG, se colocará en el editor sólo con la clase de compatibilidad con SVG y se le quitarán las demás. No cambia el código existente, es sólo una ayuda que te permite incrustar rápidamente tus archivos SVG y hacer que se procesen integrados sin tener que jugar con las clases.Cuando se usan archivos SVG como imágenes normales no es suficiente ;)Al usar imágenes SVG en un sitio de WordPress es complicado darle formato a los elementos SVG usando CSS. ¡Ahora es sencillo!Cuando activas el modo avanzado, este plugin no sólo proporciona compatibilidad con SVG, como su nombre indica, sino que también te permite incrustar fácilmente el código completo de tu archivo SVG utilizando una simple etiqueta IMG. Al añadir la clase style-svg a tus elementos IMG, este plugin reemplaza dinámicamente cualquier elemento IMG que contenga la clase style-svg por tu SVG completo.SíTambién puedesPuedes incrustar tu imagen SVG como cualquier imagen estándar con la adición de añadir la clase style-svg (o tu clase personalizada) a cualquier etiqueta IMG que quieres que este plugin cambie por tu código SVG real.Puedes subir archivos SVG a tu biblioteca de medios como cualquier otra imagen. Asegúrate de seleccionar «Restringir a administradores» si sólo quieres permitir a los administradores subir archivos SVG.Puedes utilizar archivos SVG como imágenes destacadas como cualquier otro formato de imagen, con la adición de poder elegir si procesar tus archivos SVG destacados integrados por cada entrada.No puedes jugar con esto.Es probable que necesites establecer tu propia altura y anchura en tu CSS para que los archivos SVG se muestren correctamente.Tu imagen subida necesita ser un archivo SVG para que este plugin pueda reemplazar la etiqueta img por el código SVG integrado. No creará archivos SVG para ti.http://es.wordpress.org/plugins/svg-support/https://benbodhi.comovaloración.