Ultime recensioni

martedì 23 febbraio 2016

#3 Blog codes - I codici utili per migliorare il nostro blog!

Prima ancora di fare il post per raccogliere le domande nel prossimo askjessica, ho deciso di fare un altro post utile con la raccolta di codici e consigli che si usano per migliorare il nostro amato blog. Nel prossimo post della rubrica mi hanno già consigliato cosa fare ma sarà un post lungo e lo farò con più calma non prima di avervi proposto qualcosa di easy. Qui infatti ho deciso di raccogliere un po di cose utili che magari alcuni conoscono e altri no, facili da fare senza troppe spiegazioni dietro. Direi quindi di incominciare ;D

ELIMINARE I BORDI DELLE IMMAGINI
Nonostante quando midifichi la grafica imposti il colore su trasparente rimane comunque un bordo alle nostre immagini che magari ci da fastidio vedere. Per eliminarlo è semplicissimo basta andare su:
1 - Modello
2 - Personalizza
3 - Avanzato
4 - Aggiungi CSS
5 - Copiate questo codice:
.post-body img, .post-body .tr-caption-container, .Profile img, .Image img,
.BlogList .item-thumbnail img {
padding: none !important;
border: none !important;
background: none !important;
-moz-box-shadow: 0px 0px 0px transparent !important;
-webkit-box-shadow: 0px 0px 0px transparent !important;
box-shadow: 0px 0px 0px transparent !important;
}
6 - Adesso salvate, il gioco è fatto!

IMMAGINI DI SFONDO, I PATTERN.
Se c'è una cosa importante, è lo sfondo. Qualche volta usiamo un colore a tinta unita, altre volte ci piace avere uno sfondo carino che catturi l'attenzione. Bisogna sapere qualcosa di molto importante a proposito degli sfondi. E' molto facile facendo ricerche su internet inciampare in sfondo a pagamento, l'importante è sempre scrivere nella ricerca free così da eliminare se si può gran parte degli sfondi che non possiamo usare. Se invece di fare ricerche su internet cercate qualcosa di specifico, io vi consiglio Colourlovers. Colourlovers è una community in cui si raccolgono pattern, palette, tutti free scaricabili gratuitamente. Per salvare l'immagine scelta, ad esempio questa qua vi basterà guardare a destra e cliccare su preview. Vi si aprirà l'immagine da una nuova finestra e poi salvate e caricate sul blog. Vi consiglio dato che ho riscontrato problemi, di aprire l'immagine su paint o photoshop e salvarla di nuovo. Per vedere il pattern a sfondo intero basterà cliccare sull'immagine. Un altro posto in cui potete guardare per i vostri sfondi è Deviantart basterà mettere nel motore di ricerca pattern, andando semmai più nello specifico, ad esempio suggerite il colore o un tema, e il resto lo farà lui. Non tutti sono gratuiti quindi state attenti e leggete bene. In questo caso non sempre avrete la possibilità di poter guardarli a sfondo intero ma dovrete salvarli a stock, cioè salverete una cartella con più sfondi insieme.

USARE FONT DIVERSI DA QUELLI PREIMPOSTATI
Altra cosa per personalizzare il nostro blog sono i font ovvero i caratteri del testo. C'è infatti la possibilità di poterne usare di differenti sia all'interno dei post che nel layout del blog. Per scegliere il font dovete andare su google fonts e cercare quelli che fanno al caso vostro. Potete utilizzarne più di uno ma vi consiglio minimo tre (anche se io tendo a strafare ehehe). Vi espongo l'esempio di uno solo per farvi capire meglio. Avete scelto quello che vi interessa quindi dovete cliccare su Add to collection -> Use e vi si aprirà una nuova pagina, sotto il codice da inserire nella parte HTML:
 Aperta la pagina scorrete sotto e copiate:
Ora dobbiamo andare su blogger e più precisamente su Modello -> Modifica HTML:
Sotto la dicitura <head> incollate e salvate (è proprio davanti i vostri occhi non dovete scorrere nulla):
Quello che vedete è il mio codice voi dovete incollare il vostro.
Attenzione. Al codice manca uno slash finale che dovete aggiungere prima di salvare, ecco un esempio:
PRIMA DELLA MODIFICA
<link href='https://fonts.googleapis.com/css?family=Pacifico' rel='stylesheet' type='text/css'>
DOPO LA MODIFICA
<link href='https://fonts.googleapis.com/css?family=Pacifico' rel='stylesheet' type='text/css'/>
Per usarlo dovete usare il codice font family e impostare così:
font-family: 'Pacifico', arial;
Pacifico è il nome del carattere del testo che avete preso da Google Font. Va messo all'interno dei due '' e subito dopo aggiungere un carattere di preimpostato.
Dopo aver salvato potete usare il font sia nei post e nel layout del blog. Per vedere come utilizzarlo nei post andare in questa guida (clicca qui) mentre per quanto riguarda l'altro punto vi farò un post dettagliato a breve e poi vi metterò il link di seguito.

INSERIRE UNA FIRMA ANIMATA ALLA FINE DEL POST.
Ho giusto scoperto ieri un sito dove poter creare una gif animata che scrive il nostro nome che verrà inserito a fine post. Il sito in questione è un sito francese e si tratta di Gif Mania, a lato scrivete il nome modificando la dimensione e il carattere del testo, a destra potete inserire un'immagine carina che scriverà il vostro nome (non so come spiegare questa cosa, ma lo capirete vedendo XD) Una volta modificato cliccate su CREER, vi aprirà una nuova pagina e per salvarlo cliccate su Télécharger cette signature. Per poterlo usare caricate l'immagine su un sito di hosting come ad esempio imgur.
Come inserirlo a fine post senza doverlo aggiungere ogni volta:
Dovete andare su Impostazioni -> Post e commenti -> Modello Post
Nel riquadro aggiungete
<br><center><img class="center" alt="post signature" src="URLIMMAGINE"></center>
Potete modificare il center impostando la firma a sinistra LEFT o destra RIGHT.


Volevo solamente dirvi che ho ricontrollato i post precedenti di questa rubrica ed ho apportato delle modifiche in quanto mi sono accorta di aver fatto degli errori, ve le riporto comunque qui sotto:

Per il codice sopra ringrazio (x) mentre per il terzo un ringraziamento a Giusy di Divoratori di Libri.

post signature

7 commenti:

  1. Ciao Jessica,
    tra tutte le cose che hai detto confesso di conoscere solo l'ultima :-) è un sito che uso anch'io per la firma e lo trovo carinissimo e soprattutto semplice da usare.
    Per le altre cose ti ringrazio come sempre per mettere a disposizioni le tue conoscenze. Da impedita quali sono saranno utilissime non appena mi serviranno.

    RispondiElimina
  2. Ciao Jessica! Ma che post super utile, specialmente per il sito che ti permette di creare la firma, avevo gli occhi a cuoricino mentre guardavo *-* Bellissimo, sei stata davvero gentile e brava a condividere questi piccoli trucchetti, così le blogger meno esperte possono avere qualcuno a cui appoggiarsi e qualche dritta!
    Bravissima e continua così, ora vado a spiare un po' sul tuo blog perchè mi sembra fatto molto bene! *-*

    -Violet

    RispondiElimina
  3. Ciao Jessica! Grazie per questi consigli; era un po' che pensavo di aggiungere la firma alla fine dei post, ma ho il dubbio sulle GIF animate... Non è che si rischia di rallentare il caricamento del blog?

    RispondiElimina
    Risposte
    1. Ciao! La gif è relativamente piccola perciò non ci sono problemi di questo tipo, pensiamo a chi inserire nei post le semplici gif, non danno problemi ai post, magari i gadget a lato si, potrebbero rallentare il blog, ma questo non credo proprio (:

      Elimina
  4. Cavolo! Mi ero persa questo post! Tutto utilissimo come sempre ma non è che sia riuscita ad afferrare molto il blog code per il font. Di certo non è colpa tua se i codici fanno impazzire però suggerirei di mettere qualche immagine magari per questo tipo di spiegazioni :)

    RispondiElimina
    Risposte
    1. C'è qualcosa di preciso che non hai capito? Se c'è un passaggio preciso ti inserisco le immagini ;)
      No errore mio, pensavo di aver spiegato in maniera semplice ma se c'è qualcosa che non capite chiedete sempre!

      Elimina

Related Posts Plugin for WordPress, Blogger...