For Blogspot Bloggers, there are two installation options: the Easy Way, and the Customizable Way.
For Wordpress Bloggers, at the moment, you'll need to install the button similar to the last step (add page element) in the Customizable Way.
------------------
*UPDATE*
Due to several requests, I've made the button on this blog (left side, says "Visit a Gluten Free Blog") available to add as a Widget without any copying, pasting, or template modifications.
Click the following button to install yours:
*That's all - you now have a browser friendly, gluten free blog hopping button!*
The following steps are for those who prefer to style their widget via css.
--------------------------------
Here's how you can add one yourself, and style it too!
The first step is probably the most daring, as it requires you to enter your Layout (Dashboard - Layout) and click the Edit HTML tab.
Once you're at the Edit HTML page, make sure to backup your template by clicking "Download Full Template".
The purpose of entering your template is to add styling to the button so that you can change colors and event font sizes/types from your Fonts and Colors tabs.
You'll want to create Variable names for the styles you'd like to edit from within your Font and Colors tab. Here are the four variables I created for this button:
<Variable name="randomblogbkgcolor" description="Random Blog Background Color" type="color" default="#c60" value="#5d7588">
<Variable name="randomblogbordercolor" description="Random Blog Border Color" type="color" default="#c60" value="#9cb088">
<Variable name="randomblogbkghovercolor" description="Random Blog Background Hover Color" type="color" default="#c60" value="#9db189">
<Variable name="randomblogborderhovercolor" description="Random Blog Border Hover Color" type="color" default="#c60" value="#718fa6">
These lines should be pasted near the top of your template, between the <head> and </head> tags. If you have meta tags, these variable name tags are commonly placed after the meta tags.
The next step is to paste the following lines just before the line that contains: >]]></b:skin> in your template:
/* Random Blog Styling */
input.randomblog {
background-color: $randomblogbkgcolor;
border: 2px outset $randomblogbordercolor;
width: 100%;
text-align:center;
font-style:bold;
color: #fff;
padding: 1px;
margin: 1px;
}
input.randomblog:hover {
background-color: $randomblogbkghovercolor;
border: 2px outset $randomblogborderhovercolor;
width: 100%;
text-align:center;
font-style:bold;
color: #fff;
padding: 1px;
margin: 1px;
}
Once you've completed this step (including backing up your template), click Save Template.
To add the button, you'll need to go to your Page Elements section under Layout. Once there, select "Add a Page Element" and choose HTML/Javascript. Copy and paste the following code into the new window:
<script style="" src="http://randomblog.googlecode.com/files/randomblogsourceclass.js"></script>
*note* this is the script Wordpress bloggers will want to refer to when adding this widget
------------------
Select "Save" and you'll now have your own Visit a Random GF Blogger widget. To change the colors of the background, border, and hovered-over background a border, go to your Fonts and Colors tab under Layout and change the colors of the four variables that start with "Random Blog" i.e. Random Blog Background Color.
That's all! If you would like to be included in this random gf blog visitor, simply leave a comment here and let us know.
This is really neat. I'll have my nephew add this to my site. He has it set up a little different so some things I'm not allowed to touch on it.
ReplyDeleteGood job.
Hi Lea,
ReplyDeleteGlad you like it! If you have any trouble, let me know.
I visited your site and am quite impressed! Soothing, pleasant to the eye, and easy to navigate. One of my new favorite designs. I'm also glad to see you're participating in the dining card giveaway. We'll likely be making our post in the near future.
Jon
AWESOME! I just added this to my page, what a great idea!
ReplyDeleteHi Jill - glad you like this little widget as much as we do! Let me know if you've any problems or suggestions :)
ReplyDeleteThanks for stopping by,
Jon
This is a really fantastic gadget!
ReplyDeleteI'd love to put it on my blog - but would really like to be added to the gluten free blog hop as well!
let me know when I'm added and I can start a-hoping!
Thanks!
Dana, from glutenfreeincleveland
Hi Dana!
ReplyDeleteGlad you like the idea here -- has turned out to be quite addictive for both Cindy and myself!
I've gone ahead and added your blog to the widget list for version 1.02. The form button will work as always, except now it refers to the new version.
Thanks - hope you enjoy :)
Jon
I'd love to be included! I write Gluten-Free DFW.
ReplyDeletehttp://gfdfw.blogspot.com
Hi Jen,
ReplyDeleteI'll gladly add you to the list. You're blog is now included in version 1.03. Installation is the same as always.
If you'd like to update your blog without clicking the button above, you'll have to edit your Page Element. Blogger makes this straight forward. At the edit Page Element window, you'll see:
"...
http://randomblog.googlecode.com/files/simpleinstallrandomblog_v1.02.js ..."
Then all you have to do is change the "v1.02" to "v1.03" and save.
Glad you like the widget!
Jon
Just wanted to let you know that there is another company that sells and awsome gluten free pasta. Vintage Farmer retro market they are on ETSY.com. they have many flavors that are ground up straight from the garden or local producers and put into the pasta. Tomato Garlic being my fav. and also the Chocolate and Apple pie. There are also soup mixes that are wonderful Taco and Chicken soup. Check them out and give it a try for a wonderful noodle experience!!
ReplyDelete