blogger tips

Immagine del profilo circolare ~ Blogger Tips

martedì 16 dicembre 2014Elisha87

Prima di creare un post in cui spiegarvi come sfruttare PicMonkey per editare le foto, vorrei parlarvi di una cosa che mi è stata chiesta spesso:

Come faccio a rendere la mia foto del profilo "rotonda"?


Immagine del profilo circolare ~ Blogger Tips


In realtà ci sono due modi.

TRAMITE CODICE

Uno è quello decisamente più immediato ma che richiede un codice e quindi un po' di concentrazione e buona volontà.

Il codice è questo:

<img style="width: 300px; height: 300px; border-radius:999em; -moz-border-radius:999em; -webkit-border-radius:999em; -o-border-radius: 999em;"  src="INDIRIZZO IMMAGINE"/>
300 è la dimensione di larghezza (width) e altezza (height) e ovviamente potete cambiare il valore, ricordando però di mantenere lo stesso numero per entrambi, per esempio width: 80px; height: 80px.
Indirizzo immagine è invece il link della vostra immagine: se è già caricata da qualche parte (per esempio facebook o sul blog) vi basta cliccare con il tasto destro del mouse e selezionare "copia URL immagine" o "copia indirizzo immagine". Una volta copiato l'indirizzo lo incollate al posto di "INDIRIZZO IMMAGINE" e il gioco è fatto.
Pro: non bisogna modificare la foto.
Contro: l'immagine originale dev'essere quadrata (altrimenti le proporzioni non saranno giuste e l'immagine verrà tagliata).

Il codice va inserito in un gadget HTML tramite il layout.

TRAMITE PICMONKEY

Questo metodo è sicuramente più laborioso, ma vi permette di lavorare su qualsiasi tipo di immagine, sia essa quadrata che rettangolare, e di avere quindi maggiore libertà.

Andate sul sito di PicMonkey, posizionate il mouse su "Edit" e scegliete da dove reperire l'immagine che volete modificare (le possibilità sono Computer, Facebook, OneDrive, Dropbox).

Una volta scelta la foto da modificare, selezionare nel menù di sinistra l'opzione "Crop" e nel menù a tendina ("No fixed proportion") scegliere Square.
Se l'immagine è già quadrata o non volete ritagliarne un punto preciso, evitate questo passaggio.

Immagine del profilo circolare ~ Blogger Tips
(clicca per ingrandire)
Vedrete apparire sulla foto un riquadro più luminoso rispetto al resto della foto, che potete spostare per selezionare l'area che si desidera ritagliare.
Una volta deciso quale area ritagliare, cliccate sul bottoncino verde "Apply".

Ora, sempre nella colonna di sinistra, cliccate sul disegnino della cornice (quello sotto alla farfalla) e selezionate "Rounded Corners" nel menù verticale che vi apparirà a fianco.

Immagine del profilo circolare ~ Blogger Tips
(clicca per ingrandire)
Portate il pallino che trovate sotto a "Corner Radius" tutto a destra (finché raggiunge la fine), così come vedete nell'immagine e poi selezionate la casellina "Transparent corners" e cliccate sul bottoncino verde "Apply".

Se volete ridimensionare l'immagine vi basta cliccare a sinistra, sul primo disegnino (quello sopra la bacchetta magica) e, nel menu verticale che vi apparirà, selezionare "Resize" e cambiare la dimensione, inserendo le dimensioni desiderate (Change size to) e cliccare infine sul solito tastino verde "Apply".

Ora non vi resta che cliccare in alto (al centro) su Save e salvare la vostra immagine sul computer...
Ecco che avete già la vostra immagine del profilo circolare!

Se volete inserire l'immagine in un widget HTML vi basta caricarla su internet, in siti come Tinypic, e copiare l'indirizzo che trovate nella casellina "Collegamento diretto per Layout" (es: http://i62.tinypic.com/nnjolw.jpg).

Immaginavate fosse così facile?
Spero di essermi spiegata al meglio e al solito se avete qualche domanda postatela pure qui nei commenti!

You Might Also Like

16 commenti

  1. Davvero un buon contributo, me lo chiedevo spesso anche io ;)

    RispondiElimina
  2. utilizzando il secondo metodo (io carico le foto poi su photobucket) per regolare la grandezza della foto?

    RispondiElimina
    Risposte
    1. ho aggiunto come si fa!! grazie, anche perché lo volevo già fare ma me ne sono dimenticata come al solito auahahah

      Elimina
  3. Nonostante le tue spiegazioni perfette e semplici, ti assicuro che io di far queste cose non sono proprio capace. Per me è un po' come il disegno tecnico alle superiori o peggio ancora al liceo. Ho difficoltà con questo genere di cose, non riesco a capirle bene neppure in superficie figuriamoci penetrarle sul serio :(
    Prima o poi ti chiederò di vendermi un template su misura :D

    RispondiElimina
  4. Uhhhh grazie mille...mi stavo proprio domandando come si facesse!! Grazie <3

    Baci,
    Franci

    RispondiElimina
  5. mi era sfuggito il modo per fare i cerchiolini con picmonkey! grazie!! ^^

    RispondiElimina
  6. E' interessante questo post, può essere utile per dare quel tocco in più...appena ho un po' di tempo mi cimento per circolarizzarmi *_*

    RispondiElimina
  7. Fantastica come sempre!! Sei precisissima nelle spiegazioni, peccato che io sbaglio sempre qualcosa..peró ci voglio assolutamente provare!

    RispondiElimina
  8. e per le immagini rotonde tra i commenti? :)

    RispondiElimina
  9. E io che cercavo di ritagliarla con Gimp! ._______.

    RispondiElimina
  10. Tu sei la mia salvezza...ho provato milioni di volte a creare l'immagine circolare senza successo ed ora grazie ai tuoi post riesco a migliorare il mio blog come mi piace...grazie perchè sei sempre molto chiara nelle spiegazioni, io sono riuscita a creare l'immagine con il primo metodo...ora provo a creare le tendine nelle pagine...
    a presto

    RispondiElimina
  11. Grazie mille dei tuoi consigli!!

    un bacione
    Sara
    This is Sara

    RispondiElimina
  12. post molto interessante, mi chiedevo anch'io come si facesse, grazie mille :)

    RispondiElimina
  13. grazie, mi chiedevo come si dovesse fare e non avevo pensato a Picmonkey! Ho modificato subito la foto, grazie mille ^-^

    RispondiElimina
  14. E' da tempo che cercavo una soluzione. Grazie davvero
    clood

    RispondiElimina

I vostri commenti mi danno sempre enorme soddisfazione e sarò ben lieta di passare a curiosare nel vostro spazio, ma non chiedetemi sub4sub.. suvvia, non è carino così, sembra uno scambio di figurine!
E tutti i commenti contenenti link verranno considerati come SPAM e quindi cancellati.
Thanks for your comments ♥

Ultimi commenti

Disclaimer

Questo blog non rappresenta una testata giornalistica in quanto viene aggiornato senza alcuna periodicità . Non può pertanto considerarsi un prodotto editoriale ai sensi della legge n° 62 del 7.03.2001. Verranno cancellati i commenti ritenuti offensivi o lesivi dell’immagine o dell’onorabilità di terzi, di genere spam, razzisti o che contengano dati personali non conformi al rispetto delle norme sulla Privacy. Alcuni testi o immagini inseriti in questo blog sono tratti da internet, da siti che non ne riportano la fonte; qualora la loro pubblicazione violasse eventuali diritti d'autore, vi chiedo la gentilezza di comunicarmelo via email e provvederò immediatamente a citarne la provenienza o a rimuoverle. Tutti i prodotti che vedete sul sito sono acquistati da me, tranne dove diversamente specificato. Ad ogni modo non sono pagata per scrivere le mie opinioni che sono del tutto personali e trasparenti.

Ebuzzing - Top dei blog - Bellezza

Modulo di contatto