Title: Widget CSS Classes Author: Jory Hogeveen Published: 16 Luglio 2012 Last modified: 12 Novembre 2024 --- Ricerca i plugin ![](https://ps.w.org/widget-css-classes/assets/banner-772x250.jpg?rev=1130650) ![](https://ps.w.org/widget-css-classes/assets/icon-256x256.jpg?rev=1130657) # Widget CSS Classes Di [Jory Hogeveen](https://profiles.wordpress.org/keraweb/) [Scarica](https://downloads.wordpress.org/plugin/widget-css-classes.1.5.4.1.zip) * [Dettagli](https://it.wordpress.org/plugins/widget-css-classes/#description) * [Recensioni](https://it.wordpress.org/plugins/widget-css-classes/#reviews) * [Installazione](https://it.wordpress.org/plugins/widget-css-classes/#installation) * [Sviluppo](https://it.wordpress.org/plugins/widget-css-classes/#developers) [Supporto](https://wordpress.org/support/plugin/widget-css-classes/) ## Descrizione ### Widget CSS Classes gives you the ability to add custom classes and ids to your WordPress widgets _Please note that this plugin doesn’t enable you to enter custom CSS. You’ll need to edit your theme’s style.css or add another plugin that allows you to input custom CSS. **This plugin also adds additional classes to widgets to help you style them easier:** * widget-first: aggiunto al primo widget in una barra laterale * widget-last: aggiunto all’ultimo widget in una barra laterale * widget-odd: added to odd numbered widgets in a sidebar * widget-even: added to even numbered widgets in a sidebar * widget-#: aggiunto a ogni widget, come widget-1, widget-2 #### Caratteristiche * Aggiunge un campo di testo a un widget per definire una classe * Puoi specificare più classi inserendo uno spazio tra di loro * Aggiunge facoltativamente caselle di controllo con classi predefinite * Optionally adds a text field to add an id to a widget * Adds first and last classes to the first and last widget instances in a sidebar * Aggiunge classi pari/dispari ai widget * Aggiunge classi numeriche ai widget * Completamente traducibile * Compatibile con multisito * Compatibile con i plugin Widget Logic, Widget Context e WP Page Widget * Dispone di filtri e hook per personalizzare l’output, inclusi i nomi delle classi [Sito web del plugin](https://github.com/JoryHogeveen/widget-css-classes/wiki) ### Riconoscimenti * [Adding Custom CSS Classes to WordPress Widgets](http://ednailor.com/2011/01/24/adding-custom-css-classes-to-sidebar-widgets/) * [Add .first & .last CSS Class Automatically To WordPress Widgets](http://wpshock.com/add-first-last-css-class-automatically-to-wordpress-widgets/) * Widget Context compatibility fix provided by [Joan Piedra](http://joanpiedra.com/) * Traduzione slovacca di Branco [WebHostingGeeks.com](http://webhostinggeeks.com/user-reviews/) * Traduzione polacca aggiunta, file di traduzione slovacca rinominati da [Tomasz Wesołowski](https://github.com/ittw) * Traduzione spagnola di [Maria Ramos at WebHostingHub](http://www.webhostinghub.com/) * Traduzione serbo-croata di [Borisa Djuraskovic at WebHostingHub](http://www.webhostinghub.com/) * Traduzione olandese e correzione alle classi predefinite da [Jory Hogeveen at Keraweb](https://www.keraweb.nl/) * Traduzione in russo di Наталия Завьялова * Traduzione in svedese di [Olle Gustafsson](http://www.ollegustafsson.com/) * Correzione all’avviso sugli id di [Ricardo Lüders](http://www.luders.com.br/) * Brazilian Portuguese translation by [Jonathan Xavier at Mealfan](https://mealfan.com/) [Translation Contributors](https://translate.wordpress.org/projects/wp-plugins/widget-css-classes/contributors/) [GitHub Contributors](https://github.com/JoryHogeveen/widget-css-classes/graphs/contributors) ## Screenshot * [[ * Widget di base * [[ * Widget con campo ID e scelte predefinite * [[ * Pagina Impostazioni * [[ * HTML generato ## Installazione 1. Upload the folder _/widget-css-classes/_ to the _/wp-content/plugins/_ directory 2. Attiva il plugin tramite il menu **Plugin** in WordPress 3. Configura le impostazioni in **Impostazioni > Widget CSS Classes** 4. Visita **Aspetto > Widget** per aggiungere o modificare le classi e gli ID personalizzati per un widget. 5. Espandi il widget appropriato nella barra laterale desiderata. 6. Vedrai un campo denominato **Classe CSS**. A seconda delle tue impostazioni, questo sarà un campo di testo e/o caselle di controllo. 7. Se stai utilizzando il campo di testo, puoi inserire più nomi di classe separandoli con uno spazio. 8. Se hai abilitato il campo ID, vedrai un campo di testo chiamato **ID CSS**. ## FAQ ### Perché le classi non vengono visualizzate nel mio widget? You need to make sure you have an HTML element defined for `before_widget` and ` after_widget` in your active theme’s `register_sidebar` functions, usually located in your theme’s functions.php (_/wp-content/themes/yourtheme/functions.php_). Questo elemento HTML deve avere attributi class e id. Questo plugin non funzionerà se `before_widget` e `after_widget` sono vuoti. Esempio: `register_sidebar( array( 'name' => 'Sidebar', 'before_widget' => '
', 'after_widget' => '
', 'before_title' => '

', 'after_title' => '

' ) ); ### Come aggiungo il CSS per la mia classe personalizzata? Ci sono due modi: 1. Edit your theme’s style.css file (usually located in _/wp-content/themes/yourtheme/_). 2. Usa un plugin come [Simple Custom CSS](https://wordpress.org/plugins/simple-custom-css/). ### Come esporto le Impostazioni? You can export the Settings from **Settings > Widget CSS Classes > Import/Export**. ### Cosa devo fare se trovo un bug? Compila un [bug report su GitHub](https://github.com/JoryHogeveen/widget-css-classes/issues/new). ## Recensioni ![](https://secure.gravatar.com/avatar/90ba5995d8eb6dc8041417f0a189a1a275d2f2df3c7348083604c74ddafc0493? s=60&d=retro&r=g) ### 󠀁[Not working on WordPress 5.8](https://wordpress.org/support/topic/not-working-on-wordpress-5-8/)󠁿 [Pouria Amjadzadeh](https://profiles.wordpress.org/pamjad/) 10 Agosto 2021 1 risposta Wordpress released new style of widget management. this lovely plugin not working on new version 🙁 ![](https://secure.gravatar.com/avatar/616de50077ab7cb718d024f7398ca217a88c44c9e28e485e43d740fdd150593c? s=60&d=retro&r=g) ### 󠀁[Good](https://wordpress.org/support/topic/good-6318/)󠁿 [Kasp](https://profiles.wordpress.org/kasp/) 27 Marzo 2021 works ![](https://secure.gravatar.com/avatar/d51b00d993a2463b733547d6dc1be46abe2c5f03ff2ebcb41db235452be93565? s=60&d=retro&r=g) ### 󠀁[Invaluable!](https://wordpress.org/support/topic/invaluable-63/)󠁿 [andiszek](https://profiles.wordpress.org/andiszek/) 10 Marzo 2021 This is a great and invaluable help for us frontend developers! the plugin lets you easily add your classes to any widget. thank you for developing it! ![](https://secure.gravatar.com/avatar/eea8e8b36980f791f34dc4ec92fbab8311a1010ec35e89bf63695f91785a4b6c? s=60&d=retro&r=g) ### 󠀁[Superb!](https://wordpress.org/support/topic/superb-721/)󠁿 [Damiaan van Vliet](https://profiles.wordpress.org/damnsharp/) 2 Aprile 2020 1 risposta A very useful plug-in for me as a front-end developer. It’s very easy now to address directly a widget with CSS code instead of all kind of different classes to use. Thanks very, very much! ![](https://secure.gravatar.com/avatar/d3462a8239b704c5bd2d76f66f54e820910c550b6aef028307ec75833bfb72cc? s=60&d=retro&r=g) ### 󠀁[Great! 🙂](https://wordpress.org/support/topic/great-10883/)󠁿 [xszejdi](https://profiles.wordpress.org/xszejdi/) 17 Febbraio 2020 Great! 🙂 ![](https://secure.gravatar.com/avatar/9ad8028c0e84e4e321488590012ffcca9662da86a0b25eeb4bbe86f9ec1f63e7? s=60&d=retro&r=g) ### 󠀁[Works, simply and well…](https://wordpress.org/support/topic/works-simply-and-well/)󠁿 [crzyhrse](https://profiles.wordpress.org/crzyhrse/) 5 Dicembre 2019 Works, simply and well… [ Leggi tutte le recensioni di 74 ](https://wordpress.org/support/plugin/widget-css-classes/reviews/) ## Contributi e sviluppo “Widget CSS Classes” è un software open source. Le persone che hanno contribuito allo sviluppo di questo plugin sono indicate di seguito. Collaboratori * [ Jory Hogeveen ](https://profiles.wordpress.org/keraweb/) * [ Cindy Kendrick ](https://profiles.wordpress.org/elusivelight/) “Widget CSS Classes” è stato tradotto in 17 lingue. Grazie a [chi traduce](https://translate.wordpress.org/projects/wp-plugins/widget-css-classes/contributors) per il contributo. [Traduci “Widget CSS Classes” nella tua lingua.](https://translate.wordpress.org/projects/wp-plugins/widget-css-classes) ### Ti interessa lo sviluppo? [Esplora il codice](https://plugins.trac.wordpress.org/browser/widget-css-classes/) segui il [repository SVN](https://plugins.svn.wordpress.org/widget-css-classes/), segui il [log delle modifiche](https://plugins.trac.wordpress.org/log/widget-css-classes/) tramite [RSS](https://plugins.trac.wordpress.org/log/widget-css-classes/?limit=100&mode=stop_on_copy&format=rss). ## Changelog #### 1.5.4.1 * Tested with WP 5.5. * Update plugin owner. #### 1.5.4 * **Compatibility:** Fix for old single widgets (remove notice). [#37](https://github.com/cleverness/widget-css-classes/issues/37)( props @westonruter) * Tested with WP 5.2. #### 1.5.3 * **Compatibility:** dFactory Responsive Lightbox widget option. [#33](https://github.com/cleverness/widget-css-classes/issues/33) * Tested with WP 5.0. #### 1.5.2.1 * **i18n:** Remove sv_SE translation from the plugin directory. It’s 95% on translate. wordpress.org and accepted as the better version. [#23](https://github.com/cleverness/widget-css-classes/issues/23) * **Documentation:** Readme & Wiki. [#31](https://github.com/cleverness/widget-css-classes/issues/31) * **Compatibility:** Tested with WordPress 4.9 Detailed info: [PR on GitHub](https://github.com/cleverness/widget-css-classes/pull/32) #### 1.5.2 * **Enhancement:** Make translations of core widget classes optional instead of default. [#29](https://github.com/cleverness/widget-css-classes/issues/29) * **Enhancement:** Allow vertical resize of defined classes box for CSS3 compatible browsers. Detailed info: [PR on GitHub](https://github.com/cleverness/widget-css-classes/pull/30) #### 1.5.1 * **Fix:** Widget Logic `widget_content` filter compatibility. [#27](https://github.com/cleverness/widget-css-classes/issues/27) * **Enhancement:** Make uninstall script compatible with network installations. #### 1.5.0 * **Feature:** Option to try and fix the widget parameters if they are invalid. [#24](https://github.com/cleverness/widget-css-classes/issues/24) * **Feature:** Option to remove duplicate classes. [#25](https://github.com/cleverness/widget-css-classes/issues/25) * **Enhancement:** Sort classes based on the predefined classes on the frontend by default. [#19](https://github.com/cleverness/widget-css-classes/issues/19) * **Enhancement:** Classes filter for frontend (for sorting or modifications). [#19](https://github.com/cleverness/widget-css-classes/issues/19) - `widget_css_classes`: modify all classes added by this plugin. - `widget_css_classes_custom`: modify custom input classes. * **Enhancement:** Plugin settings filter (`widget_css_classes_set_settings`), overwrites user settings. [#16](https://github.com/cleverness/widget-css-classes/issues/16) * **Enhancement:** Plugin default settings filter (`widget_css_classes_default_settings`). [#4](https://github.com/cleverness/widget-css-classes/issues/4) * **Enhancement:** Capability filters for form fields. [#21](https://github.com/cleverness/widget-css-classes/issues/21) - `widget_css_classes_id_input_capability`: ID input - `widget_css_classes_class_input_capability`: classes input - `widget_css_classes_class_select_capability`: predefined classes select (also hides classes input if invalid) * **Compatibility:** WP External Links. [#17](https://github.com/cleverness/widget-css-classes/issues/17), thanks to Victor [@freelancephp](https://profiles.wordpress.org/freelancephp) * **Fix:** Form wrapper div style. [#18](https://github.com/cleverness/widget-css-classes/issues/18), thanks to Chuck Reynolds [@ryno267](https://profiles.wordpress.org/ryno267) * **Fix:** Enable sortable input selection (IE-11 fix). [#20](https://github.com/cleverness/widget-css-classes/issues/20) * **UI:** Enhance setting page JavaScript and remove relCopy library dependency. * **i18n:** Remove Dutch and Russian languages from plugin distribution (available on [translate.wordpress.org](https://translate.wordpress.org/projects/wp-plugins/widget-css-classes)). [#23](https://github.com/cleverness/widget-css-classes/issues/23) * Started using TravisCI and CodeClimate. [#15](https://github.com/cleverness/widget-css-classes/issues/15) Detailed info: [PR on GitHub](https://github.com/cleverness/widget-css-classes/pull/22) #### 1.4.0 * Caratteristica: Ordina classi predefinite (grazie Jory Hogeveen) * Sicurezza: impedisce l’importazione non autenticata delle impostazioni * Fix: Notice message when classes is empty (thanks Jory Hogeveen) #### 1.3.0 * Feature: Change dropdown to checkboxes for multiple class selection * Feature: Option to use both predefined and text input classes * Feature: Migrate classes when predefined classes are available * Improvement: Do not show previously defined classes that are removed in the settings page when a widget is not updated yet * Fix: Only show stored classes if the field-type in the setting page is correct * Fix: When predefined is selected, show previous text input classes if they are defined * Fix: Ids index notice * i18n: Added Dutch translation by [Jory Hogeveen at Keraweb](https://www.keraweb.nl/) * i18n: Added Russian translation by Наталия Завьялова * i18n: Added Swedish translation by [Olle Gustafsson](http://www.ollegustafsson.com/) #### 1.2.9 * Changed h2 to h1 on settings page * Changed plus/minus icons on settings page to dashicons #### 1.2.8 * Added text domain to plugin header in preparation for automatic language translations #### 1.2.7 * Changed class and ID fields to full-width * Added missing escaping from settings page * Enqueue admin scripts on correct hook * Fixed undefined notice when option was not found #### 1.2.6 * Fixed error notice #### 1.2.5 * Fixed notice #### 1.2.4 * Added Serbo-Croatian translation by [Borisa Djuraskovic at WebHostingHub](http://www.webhostinghub.com/) * Added support for WP Page Widget #### 1.2.3 * Added Polish translation, Slovak translation files renamed by [Tomasz Wesołowski](https://github.com/ittw) * Added Spanish translation by [Maria Ramos at WebHostingHub](http://www.webhostinghub.com/) #### 1.2.2 * Fix for notice on line 103 when using Widget Logic * Tested with WordPress 3.7 beta 1 #### 1.2.1 * Added Slovak translation by Branco [WebHostingGeeks.com](http://webhostinggeeks.com/user-reviews/) * Updated Widget Context compatibility fix plus notice fix by [Joan Piedra](http://joanpiedra.com/) * Changed jQuery live to on for 1.9 compatibility #### 1.2 * Replace ID with custom ID rather than appending to existing ID * Added settings to not show numbered widget classes, first/last classes, and even/ odd classes #### 1.1 * Added support for Widget Context plugin * Fixed notices appearing when Widget Logic plugin was enabled but filter was disabled * Added Hide option for the Class Field Type in Settings * Don’t show any previously added IDs in front end if Show Additional Field for ID is set to No * Don’t show any previously added classes in front end if Class Field Type is set to Hide #### 1.0 * First version ## Meta * Versione **1.5.4.1** * Ultimo aggiornamento **1 anno fa** * Installazioni attive **90.000+** * Versione WordPress ** 3.3 o superiore ** * Testato fino alla versione **6.7.5** * Versione PHP ** 5.2.4 o superiore ** * Lingue * [Danish](https://da.wordpress.org/plugins/widget-css-classes/), [Dutch](https://nl.wordpress.org/plugins/widget-css-classes/), [Dutch (Belgium)](https://nl-be.wordpress.org/plugins/widget-css-classes/), [English (Australia)](https://en-au.wordpress.org/plugins/widget-css-classes/), [English (Canada)](https://en-ca.wordpress.org/plugins/widget-css-classes/), [English (New Zealand)](https://en-nz.wordpress.org/plugins/widget-css-classes/), [English (UK)](https://en-gb.wordpress.org/plugins/widget-css-classes/), [English (US)](https://wordpress.org/plugins/widget-css-classes/), [French (France)](https://fr.wordpress.org/plugins/widget-css-classes/), [Galician](https://gl.wordpress.org/plugins/widget-css-classes/), [German](https://de.wordpress.org/plugins/widget-css-classes/), [Korean](https://ko.wordpress.org/plugins/widget-css-classes/), [Portuguese (Brazil)](https://br.wordpress.org/plugins/widget-css-classes/), [Russian](https://ru.wordpress.org/plugins/widget-css-classes/), [Spanish (Chile)](https://cl.wordpress.org/plugins/widget-css-classes/), [Spanish (Spain)](https://es.wordpress.org/plugins/widget-css-classes/), [Spanish (Venezuela)](https://ve.wordpress.org/plugins/widget-css-classes/), e [Swedish](https://sv.wordpress.org/plugins/widget-css-classes/). * [Traduci nella tua lingua](https://translate.wordpress.org/projects/wp-plugins/widget-css-classes) * Tag * [classes](https://it.wordpress.org/plugins/tags/classes/)[css](https://it.wordpress.org/plugins/tags/css/) [widget classes](https://it.wordpress.org/plugins/tags/widget-classes/)[widget css](https://it.wordpress.org/plugins/tags/widget-css/) [widgets](https://it.wordpress.org/plugins/tags/widgets/) * [Visualizzazione avanzata](https://it.wordpress.org/plugins/widget-css-classes/advanced/) ## Valutazioni 4.9 su 5 stelle. * [ 70 recensioni a 5-stelle ](https://wordpress.org/support/plugin/widget-css-classes/reviews/?filter=5) * [ 3 recensioni a 4-stelle ](https://wordpress.org/support/plugin/widget-css-classes/reviews/?filter=4) * [ 0 recensioni a 3-stelle ](https://wordpress.org/support/plugin/widget-css-classes/reviews/?filter=3) * [ 1 2- recensioni a stelle ](https://wordpress.org/support/plugin/widget-css-classes/reviews/?filter=2) * [ 0 recensioni a 1-stelle ](https://wordpress.org/support/plugin/widget-css-classes/reviews/?filter=1) [Your review](https://wordpress.org/support/plugin/widget-css-classes/reviews/#new-post) [Vedi tutte le recensioni](https://wordpress.org/support/plugin/widget-css-classes/reviews/) ## Collaboratori * [ Jory Hogeveen ](https://profiles.wordpress.org/keraweb/) * [ Cindy Kendrick ](https://profiles.wordpress.org/elusivelight/) ## Supporto Hai qualcosa da dire? Ti serve aiuto? [Chiedi nel forum di supporto](https://wordpress.org/support/plugin/widget-css-classes/) ## Donazioni Vuoi sostenere le versioni future? [ Fai una donazione per lo sviluppo ](https://www.keraweb.nl/donate.php?for=widget-css-classes)