Next and Previous button images

This is a follow up post to the Remove Next / Previous links and replace them with images that seems to be popular on this site. As there are limited buttons available for this function I thought I would share with everyone the small collection of buttons that I have available. I have found these buttons on the Internet so they are not ones I have made myself, nor can I claim them as my own. Some of the button sets also have additional buttons to the set. Below each set are the code for each button - feel free to use them on your own blog or website.

PREVIOUS BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZAG2W-WXNyLeo8P-xrkiROqoMEicx-kevJl6AeeP3ZrwEUGiPXREbAWr9P-LKInB4XnMbcydwqoDS-giH_jGEdZ-CXtriRdJbUwd8xiyh95PP9yG1paREB2XIvVBNaoWJNafYrtLYT_8/s48/arrow_left_48.png' />

NEXT BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqxGbuGtPylQuHVkc9M-pmc1nKUe2L7VNhJg_jHPE1n9ub2hWf1gadzeT_TPraSmTD1ZvYwhwMwy0Orm2Ba7OZf6N4z9o-66_ftnXq6efYgkUUCjB5K8hnZCktj0evG_zIxet4OKMdmEA/s48/arrow_right_48.png' />

PREVIOUS BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMqvxI-JNBuzznwspMsEbFCrtnLKcMUVkocyrotf_UIyJDa8fNDKiyb_1Gbxb57PgGS0U3EluJwB6DBFcpcm5kS2VO56hQKuq5YAj1C7AIX_3WiKP2Nk-0b0nCiOKAFncqwdZfIgyVSRM/s48/b_back.gif' />

MORE STORIES BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyP_vXxjY3RmrxhG0CM4aZpX2L4x2qwz_c3or9M_BaDkq1jvvEdGL7Hb_DpzzhIsEi1ZC5q3WtVshAZEd_IfiXLGGN4xP-5_JNWoWLnYVPwZ9aOtssJOzCqIUDejPrGmncde7rL3wiYm8/s112/b_end.gif' />

NEXT BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiSDdcGZjKZpgKVWSF7teIEZXe-9Xo9PtvD3Co5I165fI8YCgANTvRUAOzWhj4YY5ipaHae8w5_C9rcDiKBYpB1olpR7s4jVHZkkgpUw224HKFfen0R5PaVAksz1PlqQlv1Lpd1tiitbE/s48/b_next.gif' />

RED PREVIOUS BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1mIn3LTRJ6M1R_9XbkMsR_Tyt1kIyPISn3mfTe5FKWmqfx5Nyeq9uR-hrBuXqvPWPT0EOGzbgxp9vES56ebfo5JadRrxych2RVZXSy4YVAmsxZZ226u951d5AjYYxbpkfvq6HmFfDu6w/s184/Back%252520Button%252520%2528norcastle%252520red%2529.png' width='100px'  />

BLUE NEXT BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijQuupYN3bsNwQGT-aA5mc69Bu84Reg5xhEmOs1FdCOZKy9BHncEquI2XQSI1gOQVTIzrYUsay26IAS_hyphenhyphenKJ9QXNRzrU3bazM3Xs3ZWAX1q4juC1mW4VASQ79s0Yj1tv6edlzI7WMkQ8I/s147/imagesCAPYHR3G.jpg' width='100px' />

PREVIOUS BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyuOQOaieuiriutJ-qS9631NHnxgHn2k8nB8Iq1E_hikFa5nC7Iil8NOPtDrNk7t9GKQjVpSD9JxjA4mBAm77szzGfVpCjpPtFP6X99rLrzc_NNM6O3Be82ZxTgzXiuFAt2bSMgMc0YCc/s150/back_button.gif' />

NEXT BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhC70gSB-ncF59g59lTr9WWSrs5laHJANMQ8a5XZicrhVLCfXpauAhvNatkrxvdnBs0rkmCH_CupN2yinIiDcJeBiEp1an048jEqPSMw9vlpIwvGhABEDK8gBm36ZgKgGvYHvJ_98CsrjM/s150/imagesCA13IC60.jpg' />

PREVIOUS BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhm1SXwjxmsObIV_PMH33bDsK6OwlX04_3__WQ9jx4Wn8Q6BlljmnJraceByNMINZZrklKu3OAjRjawz5fOsAsVZuVQzb-fKk-ZFypWqEwIv6ceA2WDrzz9nMj5NlVQPLVaM-5aqwZ8nUs/s43/back_button_selected.gif' />

NEXT BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPsDnBRybyeOPEJcrIJIsWDBuqSAcC2XBY5f6NB3o568VLI_FHOHWDhbI5iXrj1jpVsdANPJXaL-1DkWwxBuZj2TZEyI8cpn_3Nx-YTfmW8i9xat7nAUWxB-M9m31slEXxHetFfmOWgxo/s43/next_button.gif' />

PREVIOUS BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbpgQasvb8u_8-857lMfGjJZvrPVL3SFmsPFJOCvaF4j2JEBC-m4FlsAiS_tY43YQnMjwLR3_VIq3pIy64QBLXzM669EbV3g96I2qe6HhrUuCGKDLERHAfOlu67i7n3RzqqUFuYy1k8Ag/s205/Backbutton.gif' width='80px' />

HOME BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCMrGaB4JygNLsRvtRlv9A5oOsV4aaoCFUE9SAlS_OhCHNYapu_KHEWuxVzaQqzwhldpGpHzdhk__GFxiX28D663fSZ04jhlr3JTwWSk1FkcCEcS2AEROUiFhLZ_QpwUIEYe1G4Q9rs8c/s169/mainpagebuttom.jpg' width='80px' />

NEXT BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibV0vqf_hW04z9w0t8IViYF6rfWMg2BMLf0WoXg0Lw9cAwsb_nr1siCbIZX0AD3Ud5EKG1TjuNboCBqsnCUy04huoAp7dTB8ebrLormbgwme6AZOzSU6osAIPd7tCcPkp8gZfmSRt5LpE/s163/imagesCA6O90S8.jpg' width='80px' />

PREVIOUS BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjk9t4T6IiBc1RbLb2CiFdxff-RxYZRIOToVWAkyIKIVanhpyIQlJuakDMWdqtm_OMX6vqfxHWRSDnoYDbNP2dOrCIZPu0TR_dnH9n0XCOAaP_7s4FKUEb5uhyphenhyphenpgl6RnNlQXlZ8G2JRvsU/s105/previous___.png' />

HOME BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEifuqZl1oeVfN0I3dcvuHylwxX1FSFWQ0K3PHGmU4mr9J9ZLsK2huP05SBHE01oWtPEq5xErZpjLg0WTu8umx64zlPde_pmYWmTFowhgPG6Rb-1kiQvpr5e971SrOl0c4bCcy7zV50Pi6Q/s146/backtohome.png' />

NEXT BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDaPfPpRXrmG80U5PwiAZhPugLWB6-YJnUJ5TK_wuEUZrSfAYft-T_JYhzhJoC8MiqKLKEhO9K3lnxmeeTWODTUVfcJguvG2aBSN9ovc6u-_AJafHX-XShkklF1-LCjAxXQNG2YAFzpLI/s71/next___.png' />

BACK TO TOP BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-BECuwF6mTu46kEwIHOm0YuPDChZM3yq7bEXZ5xhORtaDTuOMQi0GagxA4MrjdsniBwkSgAJfg6l_VC5t-YsoAOUIS6D7oiIUuomWst-zKCoGuAvRk_kS1-15HzaZqjiooZOAVThvm-Y/s167/2000Post.png' />

PREVIOUS BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhW3kOr4pLcnEzexq2RYUsVHUXaXxFYFKrpU2Kjt1YktSHjboIFVVfbbolz-GH-TPdL_sqx3R7f8TjccLfP3RgDV_d5lyjFg5rDJCUCMVb2PXyZeSmbt4PflGsmo64ym0DSWyG94HuSpGY/s48/back_buttons.gif' />

NEXT BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDcO08f8oh9AJeaM5wmCzvgOLDjoFUY1-lLMynVpe46lWGjO_0LRJo7FWrhzeLt3QTnplHiShNpCo0tGMFHhl2lFnzvC5Y_67M4IGpWFlcjcU1f8FuAFgL5ouTbQC2dLk0BW19GtIqweY/s48/next_buttons.gif' />

PREVIOUS BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0XN8etlBeF0iW2R9hVggkMLEsS8pviKVhBD5rN9_LAQRwVJCCl16Hj8M-3l6NLVRHGBf0bxzRdVkGJUjhwkyYbZrTTsrDu-Zw7PSBBM07LWXXWBDEUHJ7WxqHOs8PNbE16Y1zTPBIXl8/s56/buttonBack%255B1%255D.gif' />

NEXT BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1dRQyB8-22d_nFGDfC6elF9nPPQeQ5ml-cKyqjN9zJfm8khWpWRaS_SScxMTCki08m_qjGz-s6oDzpRujTFdsMFxHeZs_Jvh4ZqgTJyG_R0kTXCVjg3vc_CFeWhursW2aWZ8XZORBtaI/s56/imagesCAJ9SHO0.jpg' />

 

PREVIOUS BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTqoAjFenHrG8unjvq3tsQCeQRIZlM-NhDWu5CrdpE-whmqKwJXWQ_dnmDUvsxowqSLM3dFdeJdRyB61AKJad0bKFR-RqocTpcvC7zbau1OizlKX1j6o5oy6KFOX3UZQQrkRNF0FZuaSg/s54/PREV.jpg' />

NEXT BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkjgArvR8fNqdgHoA9tKg2roBfL-OrxxPc6DStm6XZhabTMikXK_GaIOwuVgOC8o0ONLD3PCgJgnrtPw6nN4ZTWeG0WImy3HYWo218B_mB1dHdtWY_yKYJR_6ZnDaVdvVQ0nLUdcTuogo/s54/NEXT.jpg' />

 

PREVIOUS BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnaV-WMRza2FrFAcqYFUElsVn6gxBOjxFRqCIE7vmV7Dn6Prn8q5UmzxzS4dTfN0u_YRA5gRLLgetFlcvEBZvQIKTS0qxQdYumfHr1cAkIIT6X0jFb4pL3MoWcnArgX6LFwonM2rk6d8Y/s79/previous-red.png' />

NEXT BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMJ2oyJnxvjfoQwi0rSnFC9q1vkbOP-Nj_nWxZhjI6F659FtJGjNO6TB7kMXX1qnHHFCsn1QolXfvXjxn6pJZpRfZB7mIAsV_lnn0p1Tjq_dx7TyiSUVPlW_SXepY_JY3CnHtaOkGB9Pc/s79/next-red.png' />

 

PREVIOUS BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKh10lMMjCGw7cllc6hQX2NZF6_uVlVnBkrNjZVeoegGLV901472L4V-zLHG7pgX3v735y_4wJObDbIcc7WyLSIFwHfK35C0d5mKwm9MTUogFdJYwrKAZ0k26XBrxLb28SGrPRlS5updw/s62/sm-previous-red.png' /> 

NEXT BUTTON: <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZNzuCHeBDG34c98kXlidQDGCwJ-FDKuhB3VdvfHVTILxxFzPbBbyN1JoKOVU3acEnMp6Z-OpM5YQ3vQY0aJJrlRmhWXCLoqtkjlGRy_fzNcNuca0UHJrVgn_u3uFSUZgaozQmvVAWTbY/s62/sm-next-red.png' />

>> About half of these buttons are best placed on sites with a white background.

5 things to use marquees for on your blog

Commonly known as scrolling text, marquees can literally be used for almost anything. Today I will list 5 things which you can use marquees for that have been in use on blogs and websites.

1.  SITE UPDATES AND WELCOME TO MY BLOG INFORMATION
Adding important information that your visitors will hopefully read, I've noticed, needs to be eye catching and uniquely styled. If you just put a normal marquee with normal text on your blog your messages will probably be overlooked by everyone.

These days people tend to pay more attention to visual aides. By adding visually appealing content to marquees will help your visitors to look at it. Your information not only has to be unique that you add to a marquee, if you are bored with looking at it, the chances are other people will be too. Make the content of your marquee/s so YOU want to keep looking at it, as if it is hypnotic. How to achieve that result depends on your ability to be creative. Below is an example of a boring looking marquee and content.

WELCOME TO BLOGGER TUTORIALS FOR EVERYONE! Enjoy reading through the tutorials.

2. ADVERTISING LINKS OR POSTS
A lot of people like to use a marquee for displaing specific posts on their blog, which can be a good thing as marquees catch your eye over content that does not move. So supplying visual moving links on your blog has a much better chance of attracting visitors to click on the links rather than on, say, a recent posts link. Below is an example of blog post links added to a marquee with a pause on mouseover function added to it.

My blog post link 1    My blog post link 2    My blog post link 3    My blog post link 4

3. USING MARQUEES FOR DISPLAYING CLICKABLE IMAGES
Clickable images are great but not so great using a marquee because of the jerky scroll behaviour. It is very off putting to say the least. However, just one example for clickable images could be for displaying your Photo albums on your blog. Below is an example of some of my Picasa Web albums as I don't have any Photo Albums for this blog. All images are clickable in this example.

    

4. TO GRAB PEOPLE'S ATTENTION TO SOMETHING SPECIFIC
I've noticed on some websites that specifically advertise something to sell there are these and similiar marquees to grab your attention. As annoying as they are, they do grab your attention but generally are not clicked on. It depends upon what people are trying to sell you as to whether they will be clicked on or make the people more curious about the content. Here is one example that I made below:



STOP | | |GET IT NOW| | |STOP

5. MAKING A STATEMENT
If you truly want to do something different with your blog then you can simply make a series of marquees where you can voice your own opinion about something that you believe in.

Because I am so passionate about nature I created this image below using 4 marquees and 3 images I found on the internet. It is just one way to use marquees to voice your opinion or to express your deepest concerns. If you decide that this has a lot of potential, then I'd love to hear your thoughts.
RESTORE NATURE BY GROWING NATIVE PLANTS IN YOUR GARDEN.

There are probably many other things you could use marquees for but these are just a few. If you have any ideas for using marquees that I didn't mention in this post, feel free to leave a comment.

How to align a header image in other web browsers using Internet Explorer 7

This tutorial does not include the solution for fixing the alignment of the header image in Firefox. That was a separate issue when I made this tutorial but it has since been solved. The solution for Firefox is at the very bottom of this blog post, which I discovered the next day. Please still follow all the instructions to this tutorial of the written version below, and then after that add the extra line of code to your template to position the header to the left in Firefox.

This tutorial is about, firstly, using your own header image that you made yourself which already has your blog's title on it as well as a brief description of what your blog is about. Secondly, your web browser is Internet Explorer 7. And thirdly, you want your blog to look the same in Google Chrome and Firefox as it does in IE7. This tutorial solves the problem of a misaligned header image in Google Chrome and Firefox web browsers without affecting the look of your blog in IE7.

I am no web developer genius, in fact my knowledge of most css/javascript/html codes are still pretty limited. But I am driven to learn how to fix certain problems when they arise, and that is where I get my knowledge from. That, and the desire to solve each problem as it surfaces.

This tutorial displays my lack of understanding about css/javascript/and html codes but it also displays my ability to learn and I eventually solve the problem at hand. I am only human after all but I have a keen sense of ambition! I do not quit easily on problems.

Here is the solution below:

Firstly, you have to find the code that refers to the .header-inner in your template's code.  It will be near the top of the template's code, usually right after the " .body { " code. You simply add the following line of code to that section:

text-align: center;

What a wonderful bit of code that is! If you do not have a .header-inner { section in your template's code, simply add this code to your template in the css header section:

.header-inner .Header .titlewrapper {
padding: 22px;
}
.header-inner .Header .descriptionwrapper {
padding: 0;
}

Then add the text-align: center; line of code between the two brackets, on a separate line, and click on "save template". Not sure what to add? It will look exactly like this:

.header-inner .Header .titlewrapper {  
text-align: center; 
padding: 22px;
}
.header-inner .Header .descriptionwrapper {  
padding: 0;
}

After that, go to the "Page Elements" section and click on the edit link that is on your "HEADER". Leave your header image where it is - do not remove it. Change the title of your blog to a word or two that will match the original title.

Basically, with your header background image you add the title of your blog to it, and then when you add a new name for your blog in the edit section of your header, you carry on with the blog's title by putting a word or two at the end of it. The end result will be the header image title and the original blog title will make a complete sentence.

But, don't save the changes just yet. The next thing you have to do is delete the blog description altogether. Yes, DELETE IT. Then set your header image to "BEHIND THE TITLE AND DESCRIPTION". Once you have done that you can now click on "save" and the header image is aligned perfectly in all three web browsers. That's all there is to it really.

10th March 2011: UNFORTUNATELY, this tutorial above only fixed the problem with Google Chrome. The header was still aligned to the right in Firefox when I checked it out the next day. I finally fixed the problem for Firefox, so here is the solution for that problem:

On top of what you've done above, add the following line of code to your .header-outer { section to fix the problem in the Firefox web browser:  

border: 5px solid #000000;

Of course, you can choose any colour for the border that you like. In the line above "#000000" = black. For some reason by adding a border to the header image, in Firefox, the header background image is realigned to the far left instead of positioned to the right of your blog. All I know is it works!

How many post pages can you have on Blogger?

I done some calculations, and they were very rough, as I did not take into consideration leap years, but I done some math on how many post pages one can have on Blogger. Every single day it is possible to add 86,400 new pages to your blog regardless of it being a leap year or not. You'd be spamming, of course, but the option for that many posts daily is there. That is 60 pages per minute multiplied by 60 minutes per hour multiplied by 24 hours per day. That's a lot of pages. To multiply 86,400 by 365 days you get 31,536,000 post pages for one year. That is just for one year, mind you.

Now considering you can predate posts all the way back to 1st January 1970 - to 12PM (or noon/midday) well, multiply 31,536,000 by 41 and you get a super massive total of 1,292,976,000. That's over one billion pages for your blog, minus leap years and half a day for January 1st 1970. See conclusion at bottom for further notes. How many people could possibly even imagine that amount of blog pages on their blog?

A lot of people on Blogger complain there are not enough pages for them to use, but if you do the math, and understand you can add a new post every minute, those minutes add up to over one billion post pages. And this does not take into consideration of the fact you can have 2 or more published posts with the same date and time but have different titles.

Okay, so people want more static pages (currently only 20 are available to use) than post pages. What is so wrong with post pages that people don't want to use them? Static pages look no differently to normal post pages and they don't show up in your blog's archive widget or on your home page. So what! If you get rid of your blog archive widget altogether your posts won't be displayed either. It's simply a matter of reorganising your blog to link the main pages together so your blog becomes searchable.

So what does a blog with over one billion post pages actually look like? Imagine something like Facebook but smaller. Facebook has a huge amount of active users, it's into the millions but closer to the billions, and even more visitors per day. Can you make your blog have as many pages as Facebook's? I challenge you to try it, just by using your blog post pages alone.

Conclusion: You can have roughly 1,292,976,000 pages. That's from 1st January 1970 (12 PM) to 1st January 2011 (12 PM) minus 86,400 pages for every leap year between those two dates then add 86,400 for every day that has passed since the 1st January 2011 until present. Still not happy with the amount of pages you can use on Blogger? Then there must be something wrong with the way you think.