Follow Me on Pinterest

Followers

Click to view my photography blog

Click to view my photography blog
Cliccare per vedere il mio blog di fotografia

IMPORTANT ---- DOWNLOADS

To download my FREE printables from 4 Shared you must either have a 4Shared account or register on the site (this is free) . This is the only way you can download my freebies saved in 4 Shared.


Per scaricare GRATIS i miei progetti salvati su 4Shared dovete avere un account con 4 Shared o registrare sul sito,( questo si fa gratis) . Questo è l'unico modo per scaricare i miei Freebies.

Thursday 16 April 2009

Make your own Custom Designed Blog Background.

A few days ago I promised I would explain how to make your own blog background so here I am.

First thing... you must have a photo editing programme like Photoshop or some other programme that will permit you to create an image ... I use Arcsoft Photostudio 2000 which is a very simple graphic programme and if anyone is interested can download a free trial from Internet.

First step:
Open your graphic programme -> Go to File ->New.


Enter in:

Width 18"
Height 11"

Resolution 100


Browse for the background paper of your choice( you will find many samples on the web which you can save). Once you have decided whether to use a textured background a photograph or just a plain colour, select it and click "commit" or using the bucket tool, flood fill with colour. I used lilac in my example above.
Next you have to add the middle section where your blog posts will go... choose a pale colour to contrast, I chose white here in my example and if you like you can add elements to the sides, like flowers , bows or ribbons. You can drop a shadow too if you like. Use your imagination and your graphic tools.You will have two side borders that should measure 2 inches wide each




Once you have completed your background you must save it as JPEG so go to:

File->Save as->JPEG. Click Save.

Now all you have to do is put it on your blog. To do this you need to upload your image to an image hosting site, I use Photobucket.

So log in to Photobucket , now before you browse to choose your image file make sure to change the size in 17" screen then upload your file.




Now comes the difficult part.
Log in to Blogger, you need to change your template to Minima if it is not already set so.

Go to-> Layout->Pick New Template. Select "MINIMA" template.
Now you will have to edit your HTML Code.
To do this you must go to Layout->Edit HTML.



Now you will see a box with a bunch of codes, do not let this scare you... you 'll see how easy it is... scroll down to where you will see this code:



body {

background:$bgcolor;

margin:0; color:$textcolor; font:x-small Georgia Serif; font-size/* */:/**/small; font-size: /**/small; text-

align: center;

DELETE THAT PART AND REPLACE IT WITH THIS:


body {

background:$bgcolor;background-image:url(direct link);background-position: center; background-repeat:no-

repeat; background-attachment: fixed;

margin:0; color:$textcolor; font:x-small Georgia Serif; font-size/* */:/**/small; font-size: /**/small; text-

align: center;


Now, take the Direct Link of your saved background image from Photobucket,and enter it (copy and paste) in the brackets in the above code where it says direct link. Once you have entered the code in the brackets you should be finished.

To make sure that your background looks right click on the PREVIEW button, if you see it looks good then go ahead and save it.

You now have your own custom designed blog background!

If you would like some ready made backgounds to use on your blogs you can choose from my newly made creations which you can find here. To see a larger image you must click on the backgounds.All you have to do is choose a background of your choice and follow the instructions above where it says to delete code and replace with new code using the direct link of the chosen background as explained. I hope this is easy to follow.

If you have any questions, I will be happy to help if I can. I hope to see some of your new backgrounds very soon.

************************************

Alcuni giorni fa vi ho promesso che avrei pubblicato come creare i vostri sfondi personali per i vostri blogs. Eccomi finalmente.

Per cominciare dovete avere un programma di applicazione grafica come Photoshop , io uso Arcsoft Photostudio 2000 che trovo molto semplice e che potete scaricare una prova gratis da Internet.

Aprite il programma, andate su File -> Nuovo.

Scegliete le dimensioni

Larghezza 18 pollici

Altezza 11 pollici

Resoluzione 100.

Scegliete un disegno per lo sfondo, una foto o un colore a vostra scelta, dopo la selezione cliccate "applica" o " riempi" secondo i termini usati sul vostro programma. Io ho usato il colore lilla nel esempio sopra.

Adesso dovete scegliere la parte centrale dove metterete i vostri posts, usate un colore più chiaro per questa sezione... potete aggiungere dei fiori sui bordi o dei fiocchi e se vi piace aggiungere l'ombra... qui usate la vostra fantasia e i " tools" che si trovano sul vostro programma. I bordi laterali dovrebbero misurare circa 2 pollici in largehzza ciascuno.

Quando avete finito salvate il file in formato JPEG. Andate su File-> Salva come JPEG.

Per mettere lo sfondo sul vostro blog dovete salvare il file in Photobucket. Fate il login a Photobucket ma prima di fare l'upload dovrete cambiare la dimensione del file scegliendo tra l'opzioni, scegliete schermo di 17 pollici come si vede qui sotto:

Scelta l'opzione fate l'upload del file.

Adesso viene la parte più difficile.

Fate il login a Blogger ... scegliete Minima per template.

Andate a Layout -> New Template. Selezionare MINIMA. Adesso dovete cambiare il code HTML, adesso andate a Layout -> Edit HTML

Fatto questo vedrete un sacco di codici strani non spaventatevi.. vedrete che non sarà difficile...andate giù finche vedete questo codice:

body {

background:$bgcolor;

margin:0; color:$textcolor; font:x-small Georgia Serif; font-size/* */:/**/small; font-size: /**/small; text-

align: center;

Cancellate questo sopra e al suo posto mettete questo (fate copia, incolla):

body {

background:$bgcolor;background-image:url(direct link);background-position: center; background-repeat:no-

repeat; background-attachment: fixed;

margin:0; color:$textcolor; font:x-small Georgia Serif; font-size/* */:/**/small; font-size: /**/small; text-

align: center;

Adesso copiate il Direct Link del vostro sfondo salvato in Photobucket

e inseritelo (fate copia, incolla) tra le parentesi nel codice sopra dove c'è scritto :direct link. una volta fatto questo avete inserito il vostro sfondo sul vostro blog. Per vedere come sta cliccate su Preview (Anteprima) se vedete che vi piace salvatelo cliccando su Save.

Se volete potete anche scegliere tra questi nuovi sfondi che ho creato recentemente. Per vedere un immagine più grande di ogni sfondo cliccateci sopra . Per usare questi sfondi dovete soltanto scegliere quello che vi piace e poi seguire le indicazioni che ho dato sopra dove spiego come si cambia il vecchio codice con quello nuovo e inserendo il Direct link dello sfondo scelto. Spero che avete capito qual cosa.

Se avete domande non esitate a farle, sarò felice di aiutarvi se posso. Spero di vedere i vostri nuovi sfondi molto presto.


8 comments:

Merybi said...

Ma ... ma sembra complicatissimo ... non si rischiano danni permanenti se si sbaglia qualche cosa??? Domani stampo tutto il tuo post e vado avanti passo passo .... Grazie Sue ... hai postato le foto anche i vari passaggi ... eh no una non può essere così tonta da sbagliare, vero??
Grazie tesoro.
Lilia

Sue said...

Si, Forse come ho spiegato io sembra complicato ma se leggi ogni passaggio con calma e lavori in tranquillità non dovresti sbagliare, Importante non salvare i cambiamenti finche non sei sicura di essere riuscita.
Sue.

Doreen said...

WOW Sue, what a great tutorial, I must say you did a wonderful job, wish I was a little more adventurous but maybe one day I will sit down quietly and try it out. I really love all the backgrounds you have created...thank you so much for sharing them with us.
Hugs & Blessings,
Your sister,
Doreen : )

Sue said...

Hi Doreen,
Thanks for your comment, I had searched far and wide through many web sites to find and save all the info possible that is how I finally managed to put up this tut. I do not totally deserve the credit but found many hints around on the web, putting this and that together ... voilà!
I am happy you like the backgrounds I made but I am sure that if you'd try, you'd make some lovely ones too.
Hugs,
Sue.

Daisy Soap Girl said...

Thanks for the wondering info and instructions. I will try to do it one day when my schedule is not so hectic. Do you think that it will work on other web pages also?

Sue said...

Hi Daisy Soap girl,
I have only tried it on Blogger Minima template so I don't know if it will work on other web pages, I can assure you it works on Minima as I have changed my background several times since I found out how to do it.
Sue.

Joy said...

That is a great tutorial. I plan to do my own backgrounds one day, so thanks for the instructions. I will be back to find this post when I am ready to try this.

Anonymous said...

well.. it's like I knew!

LinkWithin

Related Posts with Thumbnails