Blogging Tips & Tricks #2
12:00 AM
Here are some more tips I've gathered over the past few months.
1. Search Bar:
See the pretty search bar on the top right hand corner of my page? I just learned how to do this the other day and here is the code so you can add one to your page.
1. Layout-->Add Gadget-->HTML/Java Script
2. Copy & Paste the code below.
3. Change the color of your search bar. For example, To change the color of the search box I used #35BABA the teal color of my blog.
4. Save
<form id="searchthis" action="/search" style="display:inline;" method="get">
<input id="search-box" name="q" size="25" type="text" style="background: #FFFFFF; border: 2px solid #000000"/><input id="search-btn" value="Search" type="submit" style="background: #35BABA; border: 2px outset #000000; color: #ffffff; font-weight: bold;"/></form>
<input id="search-box" name="q" size="25" type="text" style="background: #FFFFFF; border: 2px solid #000000"/><input id="search-btn" value="Search" type="submit" style="background: #35BABA; border: 2px outset #000000; color: #ffffff; font-weight: bold;"/></form>
This blogger teaches you how to make these Named Attribute Jumps. It took me forever to understand how to do this though because her directions are a little tricky. So here's my extra advice.
1. Copy and Paste the link below to the top of your review archive. (Blogger is stupid and will mess up the code so every time you go to update your archive you have to make sure you open it when it's in HTML format already. It sucks, but the end result is worth it.
<span style="font-size: large;"><a href="#A">A</a> <a href="#B">B</a> <a href="#C">C</a> <a href="#D">D</a> <a href="#E">E</a> <a href="#F">F</a> <a href="#G">G</a> <a href="#H">H</a> <a href="#I">I</a> <a href="#J">J</a> <a href="#K">K</a> <a href="#L">L</a> <a href="#M">M</a> <a href="#N">N</a> <a href="#O">O</a> <a href="#P">P</a> <a href="#Q">Q</a> <a href="#R">R</a> <a href="#S">S</a> <a href="#T">T</a> <a href="#U">U</a> <a href="#V">V</a> <a href="#W">W</a> <a href="#X">X</a> <a href="#Y">Y</a> <a href="#Z">Z</a> <a href="##">#</a></span></div>
2. Where you want the link to take you put this code:
<a name="C">C</a>
Do this for all the letters. So for example, you'd put that code above the authors or covers that start with C.
3. DO NOT click compose. Save it in the HTML format or all your hard work will be messed up.
The tutorial I linked to shows you how to do this with other things besides letters. here's an example of my read-along page where I have links so you can jump to the different events I participated in.
3. Blog Lovin' Button:
This I learned from Kimba! She's amazing and you should follow her tips and tricks. She taught me how to make the bloglovin follow button code so that it opens in a new browser when someone clicks on it. I took it a step further on my blog and made the button smaller because it was GINORMOUS!
<div style="margin-left:auto; margin-right:auto; text-align: center;"><a title="Follow Harley Bear Book Blog on Bloglovin" href="http://www.bloglovin.com/en/blog/4993461"target='_blank'><img height="50" width="120" alt="Follow on Bloglovin" src="http://www.bloglovin.com/widget/bilder/en/widget.gif?id=4027339" border="0" /></a></div></center>
The red parts are where you can change how big you want the button to be. The blue is where you would change it to your blog's bloglovin' page.
4. Polls
Do you like the poll on the right hand side bar? I like this site the best for creating easy and simple polls. You customize it and then copy paste the code into HTML/Java Script gadget in layout.
2 comments