11291

Currently Reading

The Mirror and the Light
Hilary Mantel, Ben Miles
Progress: 4 %
Fortunes of War: The Balkan Trilogy
Rachel Cusk, Olivia Manning
The Inner Life of Cats: The Science and Secrets of Our Mysterious Feline Companions
Thomas McNamee, Bob Reed
The Inner Life of Cats: The Science and Secrets of Our Mysterious Feline Companions
Thomas McNamee
Merlin Trilogy
Mary Stewart
Progress: 612/928 pages
The Mirror and the Light
Hilary Mantel

Recently Added

Memoir and Poems of Phillis Wheatley, a Native African and a Slave - Phillis Wheatley, Melissa Summers
The Diaries of Adam and Eve - Walter Cronkite, Betty Buckley, Mandy Patinkin, Mark Twain
Quidditch Through the Ages - Full Cast, Andrew Lincoln, J.K. Rowling
"You only live once, but if you do it right, once is enough." ― Mae West


"The man who does not read has no advantage over the man who cannot read." ― Mark Twain


"Women and cats will do as they please, and men and dogs should relax and get used to the idea." ― Robert A. Heinlein


"Always be a first rate version of yourself and not a second rate version of someone else." ― Judy Garland
Find me elsewhere:
My Leafmarks Profile
Project Hamlet

Your book counter - make it fun and pretty! (Reblogged from Anna)

One thing I was jealous of in a wooden theme was a book counter. And since I couldn't get over it, I made my own:

 

 

 

First we need to create our background picture, but if you don't want to do it, and like the one I use, here's a link (and skip to the part II of this tutorial):

http://24.media.tumblr.com/bfe31175fd6790cb85817cb6620b8ea0/tumblr_mtwj80XpoV1sakj51o1_250.png

 

For the rest of you that want to know how to make your own picture, stick around.

 

 

PART I

 

1

 

You'll need a program to cut out your image. I use PhotoFilter 7 (because it's free and I don't want to go to jail)

 

 

 

2

 

You need an image (I claim no copyrights. Don't sue me):

 

 

3

 

Open it in your image editor and remove all the unwanted stuff.

 

 

Start with duplicating layers (right click on a background layer and then click duplicate):

 

 

4

 

Switch to a background layer (an active layer is highlighted with orange) Just click on a background one, and you'll get this:

 

 

5

 

Then on your right side change settings:

 

 

So that you get this:

 

 

 

6

 

Now switch back to a  layer1. You can use an eraser (or any preferred tool) to get rid of the white.

 

* A tip - if you click somewhere with an eraser tool, and then hold the shift key and click in other place, it will clear a straight line between those two points. You can just hold shift and click around your edges.

 

 

 

7

If it'll make you see better, create another new layer. Fill it with black, place it under layer1 you're working on, to see better if you're erasing properly (get accustomed with tools on your own. Leading you step by step would take forever. Unless I knew how to make a video... Which I don't).

 

 

 

See? Now I can crop my image much better. I like to do it near the end to see what did I miss. Or turn the visibility of black layer on and off. I find working with it constantly visible underneath annoying in a long run. I much prefer a chequered background.

 

You could also make it gray

 

 

 8

 

Keep working until you're satisfied.

 

 There. Much better

 

 

 

9

 

Remove unnecessary layers:

 

 

 

10

 

 Now let's crop our image to the right size:

 

 

 

Adjust the size of a selection, then right click, crop:

 

 

11

 

Now resize a whole image to what you want to use on your page (remember that size! You'll need it later!)

 

 

 

 12

 

And now it's time to save. Don't worry about background, just keep it hidden.

 

Save as png file That's the key part!

 

 

It will spit at you:

 

Just say yes.

 

 

 

 

 

 

 

YES! OUR BACKGROUND IS DONE! MUAHAHAHAHAHAHAHA

 

(Don't you dare bitching about it! Making this tutorial took me forever. Making a book counter took me less than 20 minutes)

 

Upload it to some site to get an url  to it (pintrest, tumbrl... whatever you like)

 

 

PART II

 

 

1

 

Now a much easier part. Go to

 

settings-> blog -> customize -> edit HTML

 

and find this part

 

 

Use a search engine, I don't want to hear that you can't find the code. If you don't...  )

 

 

 

 

 

 

 

2

 

 

 Let's make some merry changes!

 

 

 

 

3

 

It worked but it needs customizing. The code in quotation marks will be:

 

background-image: url (http://24.media.tumblr.com/bfe31175fd6790cb85817cb6620b8ea0/tumblr_mtwj80XpoV1sakj51o1_250.png);

width: 220px;

height: 112px;

 

 

 4

 

Now it would be nice to change font colour and the size of the number of books:

 

That's a line of code in question:

 

Let's add:

 

style="font-size: 40pt; color: DarkSlateGray; padding-top: 7px; "

 

*padding -> an inner margin. It moved the number and the text down my image a bit, so it wouldn't touch the top border of book in my background.

 

*As always, you can put in a name of a colour or it's code number.

 

 

 

 

 

5

 

It's too crowded around my counter, so I'll add some empty spaces:

 

 

 

 

 

 Much better.

 

 

 

As always don't forget to save.

 

 

THE END

 

 

 

If you want to further mess with code, please do. You can get rid of the word "BOOKS" or do anything you want.

 

Any questions? Please ask.

 

 

 

Source: http://anhec.booklikes.com/post/481197/your-book-counter-make-it-fun-and-pretty-
Reblogged from AnHeC (I'm too fucking busy and vice versa)