SOS WP
  • Blog
  • Risorse
  • Chi siamo
  • Corsi
  • Servizi
    • Creazione Siti Web & Supporto WP
    • Consulenze Professionali
    • Formazione via Skype
    • Richiedi Subito un Preventivo
  • Assistenza WordPress
  • Menu

Apri l'indice dei contenuti

  • Strumenti per creare icone personalizzate per il tuo sito web in WordPress
    • 1) IconMonstr
    • 2) Fontastic
    • 3) WP SVG Icons
    • 4) Menu Icons
    • Conclusione

Categorie:

  • Ispirazione
  • Usare WordPress
  • Dominio e Hosting
  • Creare blog
  • Creare siti web
  • eCommerce
  • Temi
  • Plugin
  • SEO
  • Tutte

  • Creare siti multlingua
  • Copywriting
  • Dove trovare immagini
  • Email marketing
  • Guadagnare online
  • Varie

CATEGORIE

  • Ispirazione
  • Usare WordPress
  • Dominio e Hosting
  • Creare blog
  • Creare siti web
  • eCommerce
  • Temi
  • Plugin
  • SEO
  • Creare siti mulitlingua
  • Copywriting
  • Dove trovare immagini
  • Email marketing
  • Guadagnare online
  • Varie

Comincia qui per avere la soluzione al tuo problema

Background Icons
Come creare icone personalizzate per il tuo sito
Sei qui:
  • Home /
  • Blog /
  • Dove trovare immagini

Come creare icone personalizzate per il tuo sito

Andrea Di Rocco 15 Novembre 2017
8

Apri l'indice dei contenuti

  • Strumenti per creare icone personalizzate per il tuo sito web in WordPress
    • 1) IconMonstr
    • 2) Fontastic
    • 3) WP SVG Icons
    • 4) Menu Icons
    • Conclusione

Nella guida di oggi vediamo come realizzare icone personalizzate per il proprio sito web o blog in WordPress.

Non c’è ombra di dubbio: per quanto riguarda il web design, le icone stanno diventando sempre più importanti e, talvolta, vengono usate non solo per supportare, ma anche per sostituire il testo scritto.

Spesso puoi trovare delle icone nel menu di un sito web, ma anche in diverse aree della pagina.

Per esempio, se ti trovi su un sito web e vedi un’icona a forma di sacchetto, su quale pagina pensi che sarai rediretto cliccandoci sopra? Semplice: alla pagina Carrello.

Ancora più intuitivo è il collegamento tra icone e piattaforme social. È ormai rarissimo vedere link testuali ai social network. Nella grande maggioranza dei casi, sono usate le icone ufficiali Facebook, Twitter, Google+, Pinterest, eccetera.

Aggiungere le icone social è molto semplice: ci sono tanti plugin che permettono di inserire i link di condivisione (trovi la selezione di quelli più validi su questa guida), mentre la maggior parte dei temi hanno ormai una funzionalità integrata per inserire i collegamenti alle proprie pagine e profili.

Le icone che puoi usare sul tuo sito non si limitano però solo a quelle social. Infatti, puoi crearne pressoché di infinite!

Trattandosi di un elemento grafico, è inoltre molto importante che le icone:

  • siano in linea con lo stile del tema che hai installato sul tuo sito
  • abbiano tutte uno stesso stile (questo può risultare difficile da ottenere se usi vari plugin per aggiungere icone).

In questa guida, vedremo quindi come creare icone personalizzate per il tuo sito, usando strumenti online e plugin gratuiti ed estremamente validi.

Creare icone personalizzate è sicuramente un accortezza principalmente estetica, che però contribuisce a dare un aspetto più professionale al tuo sito.

Strumenti per creare icone personalizzate per il tuo sito web in WordPress

1) IconMonstr

Questo sito ha icone rappresentanti pressoché qualunque cosa. Senza bisogno di registrarsi, permette di scegliere un’icona, regolarne la dimensione (da 256px a 16px), se si desidera, posizionarla su uno sfondo tondo o quadrato ed impostarne il colore con il color picker.

Le icone possono quindi essere scaricate in formato .png o .svg e sono pronte per essere caricate all’interno della Libreria Media del tuo sito WordPress.

Per vedere tutta la raccolta di icone disponibili su IconMonstr, clicca qui. Si tratta di una collezione di quasi 4000 icone. Sicuramente troverai quella che fa al caso tuo, tra tutte quelle disponibili.

Nota! La favicon dei siti web (cioè, la piccola immagine che appare nella tab del browser) è di misura standard 16px x 16px. Potresti quindi usare IconMonstr per creare una favicon personalizzata.

2) Fontastic

Il secondo strumento che ti voglio presentare è Fontastic. Questo sito web è molto interessante e risulterà particolarmente utile ai web designer che devono creare e “coordinare” le icone su diverse pagine web, piattaforme, eccetera.

Fontastic ha una libreria di oltre 9000 icone. Effettuato il login, si possono modificare le icone anche usando codici CSS. Le opzioni di personalizzazione sono, quindi, infinite.

Le icone create vengono quindi salvate sul repository Amazon S3 di Fontastic. La stessa icona, può quindi essere usata su molteplici piattaforme. Ogni volta che viene fatta una modifica, l’icona verrà aggiornata automaticamente su tutti i siti web su cui è presente. Questo è particolarmente utile in quanto permette di saltare il passaggio Scarica Immagine > Carica Immagine su ogni singolo sito.

Se però preferisci scaricare l’icona come file, Fontastic offre la funzionalità download in formato .svg.

3) WP SVG Icons

wp svg icons

Mentre le due risorse descritte nei paragrafi precedenti sono siti web, WP SVG Icons è un vero e proprio plugin.

Installato il plugin, potrai scegliere fra oltre 490 icone.

Lo strumento funziona in questo modo: all’interno della Bacheca, troverai una nuova voce chiamata “WP SVG Icons”. Cliccando su “Default icons set”, potrai selezionare l’icona da usare ed anche di quale grandezza questa deve essere (h1, h2, h3, eccetera).

In questo modo, genererai uno shortcode che potrai poi incollare all’interno delle tue pagine.

Il numero di icone disponibili non è vasto quanto altri strumenti (per esempio, IconMonstr) però è un ottimo punto di partenza.

Inoltre, WP SVG Icons permette anche di caricare un Icon Pack (cioè, un pacchetto di icone esterno) personalizzato.

4) Menu Icons

Menu Icons plugin

Infine, l’ultimo strumento che guarderemo in questa guida su come creare icone personalizzate per il tuo sito è Menu Icons.

Talvolta, può essere veramente molto utile usare icone nel menu. Sono però ancora pochi i temi WordPress che includono questa funzionalità.

Se l’idea ti piace, puoi installare il plugin Menu Icons.

Anche questo strumento è molto interessante: una volta installato, attivato e configurato (trovi la sezione “Settings” all’interno di Aspetto > Menu) potrai, per ogni voce del menu, selezionare un’icona tra le moltissime disponibili.

Le icone incluse sono tratte da ottime risorse, tra cui Dashicons (queste sono le icone ufficiali WordPress), Font Awesome, Genericons e altre.

Vuoi sapere come modificare la favicon del tuo sito? Leggi la nostra guida.

Leggi la guida!

Per implementare queste icone Genericons sul tuo sito WordPress, puoi usare codice HTML di base (se vuoi inserire in temi e funzioni) oppure degli shortcode (per includerle in post o widget).

Puoi cambiare il colore delle icone, ruotarle e modificarne la dimensione tramite css o, se le hai implementatetramite shortcode, l’attributo per la dimensione (size).

Servizi web e sviluppo tecnico

Conclusione

Siamo giunti alla fine di questa carrellata su alcune delle risorse disponibili per creare icone personalizzate per il tuo sito.

Come vedi, tutti questi strumenti sono facili e veloci da usare. Ti aiuteranno ad avere un sito dall’aspetto più professionale.

Che strumento usi per creare le icone del tuo sito?

Come sempre, ti invito a condividere la tua opione (o qualunque domanda tu abbia), nella sezione commenti qui sotto.

Alla prossima guida!

Tags: Creare iconeCreare LogoCreare sito webCreare un blogdesign-sitoGrafica
Lascia un Commento

Andrea Di Rocco

Fondatore di SOS WP, Autore

First Badge Item Second Badge Item Third Badge Item
La mia passione per WordPress mi ha portato negli ultimi 10 anni a voler aiutare sempre più persone a creare blog e siti web in WordPress in completa autonomia. Spero che troverai utili le oltre 650 guide su WordPress e sulla SEO che ho pubblicato su questo blog e se ne hai voglia ti invito a leggere la mia storia cliccando sul pulsante qui sotto.
Leggi la mia storia
Corso WordPress di SOS WP
Ti potrebbe interessare:
I migliori temi WordPress per creare un blog di cucina
I migliori temi WordPress per creare un blog di cucina01 December 2017
Come diventare blogger
Come diventare blogger22 April 2018
Scegliere il nome giusto per il tuo blog
Scegliere il nome giusto per il tuo blog11 January 2019
Come creare un blog di viaggi di successo
Come creare un travel blog di successo24 September 2019
Stylemix temi WordPress
Stylemix: i migliori temi per WordPress06 March 2019
Guida CSS completa per un sito WordPress
Guida CSS completa e ideale per chi ha un sito WordPress19 February 2018
8 commenti

Lascia un commento
  1. jenni
    jenni dice:
    22 Aprile 2020 alle 10:38 am

    Buongiorno, premetto che non sono proprio esperta.
    Utilizzo WordPress-Enfold.
    Mi chiedevo se esiste un plug-in o un modo semplice per aggiungere sopra alle immagini/slide un elenco di icone linkabili a pagine o email o contatti. Come fosse un menù laterale con icone…non so se mi spiego. Grazie!

    Rispondi
    • SOS WP Team
      SOS WP Team dice:
      23 Aprile 2020 alle 10:15 am

      Ciao Jenni, ti consiglio di chiedere direttamente a Enfold, hanno un eccellente supporto http://www.kriesi.at/support/forum/enfold/. Non crediamo vi sia la necessità di aggiungere plugin, in ogni caso.

      Rispondi
  2. Roby
    Roby dice:
    16 Novembre 2017 alle 4:14 pm

    Qualcuno conosce ed usa anche fontello.com?

    Rispondi
    • Team
      Team dice:
      17 Novembre 2017 alle 9:54 am

      Ciao Roby, sì. Si tratta di una ottima repository per icone.

      Rispondi
  3. Paolo
    Paolo dice:
    6 Novembre 2016 alle 10:27 pm

    Ciao! Da premettere che uso un tema professionale WP (Bridge by QODE)..
    Font Awesome è già integrato ma la mia esigenza è particolare: vorrei poter inserire nel progetto web delle icone svg, attraverso Font Awesome, ma personalizzate.
    In pratica creo prima gli svg con un programma di grafica vettoriale e poi vorrei poterli aggiungere nella lista di Font Awesome in modo da poterli richiamare all’interno dei widget del tema stesso.
    Scusa se la mia richiesta è confusa, spero tanto tu possa aiutarmi.
    Grazie!

    Rispondi
    • Team
      Team dice:
      7 Novembre 2016 alle 10:12 am

      Ciao Paolo, prova a seguire queste indicazioni https://stackoverflow.com/questions/11426172/add-custom-icons-to-font-awesome, oppure contatta direttamente il supporto del plugin. Un saluto!

      Rispondi
  4. richard
    richard dice:
    16 Giugno 2016 alle 6:11 am

    Una domanda secca. Non mi dire di rivolgermi ai professionisti perché già l’ho fatto. Perso una montagna di soldi per poi farmi il sito da solo!! oltre a riparare quello che era rotto e sostituire quello che mancava.
    Conosci un metodo per aumentare l’afflusso sul sito che non sia quello di pagare adwords? Cosa già fatta. Con risultati pessimi.
    Non mi parlare delle Ota perché anche quello già è stato fatto.

    Rispondi
    • Team
      Team dice:
      16 Giugno 2016 alle 9:53 am

      Ciao Richard,
      non posso rispondere seccamente alla tua domanda, perché i modi per aumentare il traffico ad un sito web, e migliorarne l’indicizzazione, sono vari e differenti tra loro. Credo più che altro in una strategia che li rappresenti tutti. Hai già dato una occhiata alle nostre guide, come questa https://sos-wp.it/come-aumentare-visite-sito/? Prenota una call gratis con il nostro Egidio, il responsabile per SOS della ottimizzazione dei siti web: https://sos-wp.it/consulenza-seo/. Un saluto!

      Rispondi

Domande? Lascia un commento!

Il team di SOS WP risponde tutti i giorni. Unisciti anche tu alla conversazione…

Lascia un commento Annulla risposta

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

Andrea Di Rocco - Autore di SOS WP

Benvenuto!

Sono Andrea Di Rocco, autore di SOS WP, il blog italiano su WordPress che contiene oltre 650 guide su come creare blog e come creare siti web che generano traffico, contatti e vendite! Oltre al blog, forniamo:

Assistenza WordPressAssistenza WordPress

Creazione siti webCreazione siti web

Corso WordPressCorso WordPress

Servizi

  • Creazione blog professionali
  • Realizzazione siti web
  • Messa a norma GDPR
  • Consulenza SEO
  • Formazione WordPress
  • Chiedi un preventivo

LINK RAPIDI

  • Scopri TUTTO SEO™
  • Entra in Area Corsi
  • Gruppi Facebook
  • Testimonianze
  • Contattaci
  • Lavora con noi

Vuoi creare un blog? Non sai come muoverti nel mondo di WordPress? Desideri essere primo su Google con il tuo sito web?

Richiedi Preventivo

  • Safe Payment IconPagamenti sicuri con:
    Maestro IconVisa IconMastercard IconPaypal Icon e altri…
  • Support IconSupporto continuo dal Lunedì al Venerdì 08:30 – 18:30
SOS WP
  • Chi Siamo
  • Chi è Andrea Di Rocco
  • TUTTO SEO™
  • TrustPilot
  • Privacy e Cookie Policy
  • Facebook
  • Youtube
  • Linkedin
 

© Copyright 2012-2021 | SOS WP™ Metro Effort Limited. Tutti i diritti sono riservati.

 
Scorrere verso l’alto
SOS WP utilizza i cookie per migliorare la tua esperienza: ACCETTOImpostazioni
Privacy & Cookies Policy

Panoramica sulla privacy

Quando si visita qualsiasi sito web, questo può memorizzare o recuperare informazioni sul tuo browser, in gran parte sotto forma di cookie. Queste informazioni potrebbero essere su di te, le tue preferenze o il tuo dispositivo e sono utilizzate in gran parte per far funzionare il sito come te lo aspetteresti. Le informazioni di solito non ti identificano direttamente, ma possono fornire un'esperienza web più personalizzata. Poiché rispettiamo il tuo diritto alla privacy, puoi scegliere di non consentire alcuni tipi di cookie. Clicca sulle intestazioni delle diverse categorie per scoprire di più e modificare le impostazioni predefinite. Tuttavia, il bloccaggio di alcuni tipi di cookie può avere impatto sulla tua esperienza del sito e dei servizi che siamo in grado di offrire.
Maggiori informazioni
Cookie di terze parti
Salva e accetta