Custom Scrapbook Blog Designs

Showing posts with label Tutorials. Show all posts

Wednesday, November 2, 2011

Tutorial Tuesday: Re-sizing Buttons

Have you wanted to post a particular button linking back to a site you liked, but their button wasn't the size that you preferred? Or perhaps their button was too big/too small to fit in your sidebar?

Here's how you can easily re-size buttons so they fit perfectly in your sidebar.

If you don't know how to post buttons in your sidebar, click here to see my tutorial that can show you how to do so in a very easy way!
Your code should look something like the following (the link/image will obviously be different):

3. Now to change the size, you add the following code that I have highlighted in the code in the color purple:

to this:

Basically, it went from a 125 px X 125 px to a 150 px X 150 px.

Did you find this tutorial helpful? Share my button!

Looking for a particular tutorial? Let me know!

Thursday, October 6, 2011

Tutorial Thursday: Displaying Popular Posts

Blogger now lets your display your most popular posts (most visited) very easily.

Here's how you can display your most popular posts in your sidebar:

Go to the Design tab in your blog (top right corner if you are on your blog's main page).
Scroll down a bit and click Add a Gadget wherever you want to add the tag cloud (sidebar on the left or right, or at the bottom, etc.)
A pop up screen with pop up which says Basics. Scroll down until you see Popular Posts (it should be the second one). You'll see a + button in a blue square right next to it -- Click that.
Once you click it, another screen will pop up (that says Configure Popular Posts). Configure the settings to your liking.
Don't forget to save!

Did you find this tutorial helpful? Share my button!

Looking for a particular tutorial? Let me know!

Tuesday, September 20, 2011

Tutorial Tuesday: Leaving a Sidebar Gadget Untitled

Sometimes you just don't want or need to put a title in each one of your sidebar gadgets, right? It always annoyed me when I would get the "Required field must not be blank" message and I had to write something.

Thankfully, not soon after I figured out a way around it :)

Here's you can leave the Title portion of a gadget in your sidebar empty in Blogger:

In the Title portion, just enter the following code.

That was easy, wasn't it?

Did you find this tutorial helpful? Share my button!

Looking for a particular tutorial? Let me know!

Tuesday, August 16, 2011

Tutorial Tuesday: Making All of your Link Open in a New Window

If you link to a lot of outside blogs or websites, it is a good idea to have the links open in a new window so your original page isn't lost in the mess.

Here's an easy way you can do this in Blogger:

Under Design, click Edit HTML.
Find the code <head>
Copy and paste the following under it:

Don't forget to save!

Did you find this tutorial helpful? Share my button!

Looking for a particular tutorial? Let me know!

Thursday, July 28, 2011

Tutorial Thursday: Share Buttons

Blogger now lets you "share" your blog posts through email, blogger, Twitter , Facebook and Google buzz buttons. You no longer have to embed HTML coding to do it and it's so much easier!

Here's how to add it to your own blog:

Login to Your Blogger Dashboard
Click on Design and then the Page Elements (if you aren't already on there).
Scroll down a little and click on the Edit Button near the Blog Posts (in the big rectangle) and then under Post Page Options, add a check next to the Show Share Buttons.
If you want, you can Drag and Drop the Share buttons and place it where you want at the bottom of that screen under Arrange Items.

Now if everything went right, then you should be able to see the Share buttons on your Blog. If not then read on because it is likely that you have a modded template.

Under Design, click Edit HTML.
Check the “Expand Widget Templates” option and locate (use the ctrl button and f to "find"

Or if that is not there then find

Or if that is not there then find

<data:post.body/>

and place the following code just below whichever of the above was present in your template:

<b:include data='post' name='shareButtons'/>

</div>

Don't forget to Save your template.

Did you find this tutorial helpful? Share my button!

Looking for a particular tutorial? Let me know!

Tuesday, July 12, 2011

Tutorial Tuesday: Expandable Posts

Want to make your blog posts seem less cluttered? Or show only summaries? Blogger now lets you have expandable posts to they appear in condensed form on your main page, but allows readers to "read more" if they want. It's a great way for readers to easily find the content they are looking for without having to scroll through long articles.

Here's how:

Open up a New Post in Blogger.
Write out your blog post as you normally would. But where you want the summary (or whatever part of the blog post you want to appear on the main page) to end, Click Insert jump break from the toolbar.
Publish post as you normally would.

If this method works for you, great. If it doesn't, no worries - it just means you have a customized template. Follow the following steps

Under Design, click Edit HTML.
Check the “Expand Widget Templates” option and locate (use the ctrl button and f to "find" the following HTML code: <data:post.body/>
Right underneath that, paste the following code:

<b:if cond='data:post.hasJumpLink'>

</div>

</b:if>

4. Click on Save Template.

Did that work for you?

Did you find this tutorial helpful? Share my button!

Looking for a particular tutorial? Let me know!

Tuesday, June 28, 2011

Tutorial Tuesday: Changing the Color of Your Navigation Bar

You see that blue navigation bar running across the top of your screen in Blogger blogs? Did you know that you can change the color of that navigation bar?

Here's how to to change the color in Blogger:

Go to your Design page (top right corner if you are currently at your blog's home page).
Under Add and Arrange Page Elements, find the thin blue element that says "Navbar" in the center. It is right above your header element, if that makes it easier to find for you.
Click on Edit and choose which ever option you like most. I personally like the transparent one!

Did you find this tutorial helpful? Share my button!

Looking for a particular tutorial? Let me know!

Thursday, June 9, 2011

Tutorial Thursday: Exporting or Backing up Posts

Whether its because you are transferring platforms, want to have a back-up of all of your blogs posts on your blog currently, or whatever your reason is.... exporting your blog posts is quite easy to do.

Here's how you can export all of your posts in Blogger to back them up:

Click Design (top right corner from the main screen of your blog).
Click Settings. It should be the one right before Design which is the screen you are currently in.
Under the heading Basic (where is where you are now), you'll see in bold terms it says Blog Tools. On the right of it, you have three options: import blog, export blog, and delete blog. Click Export Blog.
You should now be in a screen called Export your Blog. Click Download Blog. This should save your a file on your computer with all of your current blog posts.

Did you find this tutorial helpful? Share my button!

Looking for a particular tutorial? Let me know!

Tuesday, May 24, 2011

Tutorial Tuesday: Creating a Label Cloud

Tag Clouds are an easy and uncluttered way to display to your readers what you write about. Blogger now let's you implement one in your blog very easily!

Here's how:

Go to the Design tab in your blog (top right corner if you are on your blog's main page).
Scroll down a bit and click Add a Gadget wherever you want to add the tag cloud (sidebar on the left or right, or at the bottom, etc.)
A pop up screen with pop up which says Basics. Scroll down until you see Labels (it should be the sixth one from the bottom). You'll see a + button in a blue square right next to it -- Click that.
Once you click it, another screen will pop up (that says Configure Labels). You'll see four things you can configure in this screen (Title, Show, Sorting, and Display). Under Display, to display as a cloud.

Did you find this tutorial helpful? Share my button!

Looking for a particular tutorial? Let me know!

Thursday, May 5, 2011

Tutorial Thursday: How to Post Buttons in your Sidebar

Have you wanted to post a button on your blog but didn't know how to? It's really simple to add one! You can add your own or ones you get from other blogs and/or websites.

Here's how you can post buttons on your Blogger blog:

Go to the Design tab in your blog (top right corner if you are on your blog's main page).
Scroll down and find where it says HTML/JavaScript. Click the + sign (in a blue box) on its right.
A pop up window that is titled HTML/JavaScript will pop open.
Under content, paste the code for the button(s) you wish to display on your blog.
Don't forget to click Save (in the orange rectangle) when you are done.

For example, if you wanted to paste my button on your blog, you would copy and paste the following in the content section:

and it would appear as:

Did you find this tutorial helpful? Share my button!

Looking for a particular tutorial? Let me know!

Tuesday, April 26, 2011

Tutorial Tuesday: Links in Comments

Following my tutorial on including a link above the comment section of your blog, several people asked me whether it was possible to leave a link in a comment in Blogger.

Here's how you can include a link in a Blogger comment:

In the comment box, copy paste the following code:

2. Replace the words YOURURLHERE in the above code with your URL. Don't remove the quotation marks!

3. Replace the words WHAT YOU WANT YOUR LINK TO SAY in the above code with whatever you want your link to say. :)

Note: You can write before and after the code in your comment as your normally would.

For example, if I wrote:
Come visit <a href="http://customized-designs.blogspot.com/">Custom Scrapbook Blog Designs</a>!

that would appear as the following comment after I posted it:
Come visit Custom Scrapbook Blog Designs!

Did you find this tutorial helpful? Share my button!

Looking for a particular tutorial? Let me know!

Tuesday, April 19, 2011

Tutorial Tuesday: Centering Images

Centering your images is so easy, but a lot of people don't know how to do it. I'm sure you've seen blog posts where the photos were left and right and just made the blog (post) seem all over the place.

Here's how to center your images in Blogger:

While in the screen where you write your blog posts, click Edit HTML.
Right before the code for the image enter the the code <center> and right after the code for the image ends, write the code </center>.

Did you find this tutorial helpful? Share my button!
Looking for a particular tutorial? Let me know!

Thursday, April 14, 2011

Tutorial Thursday: Adding a Link in Your Comment Form Message

In response to my tutorial on customizing the content of your comment box on Blogger, someone asked a great question about whether you can add HTML to the comment box (right above where visitors leave comments) or is it limited to styling for that comment box. The answer is yes, you can add HTML!

Here's how you can do it:

Click on Design (at the top right corner).
Click on Settings in the navigation bar running across the top of your screen.
Then click on Comments and scroll about half way down until you see Comments Form Message. In that box, write out the text that you want to appear above the comment box.
If you want to add a link, copy and paste the following:

YOUR TEXT BEFORE LINK GOES HERE <a href="YOUR LINK GOES HERE">WHAT YOU WANT THE LINK TO SAY GOES HERE</a>.

Don't forget to scroll down and click on Save Settings.

If the above seems familiar, it is because it's mostly the same steps I discussed in the tutorial that showed you how to customize the content of your comment box. This just goes an additional step.

So for example, for mine I have the following typed into the box:

Thanks for visiting <a href="http://customized-designs.blogspot.com">Custom Scrapbook Blog Designs</a>.

Which is displayed as the following under where it says 'Post a Comment':

Thanks for visiting Custom Scrapbook Blog Designs.

Did you find this tutorial helpful? Share my button!

Looking for a particular tutorial? Let me know!

Tuesday, April 12, 2011

Tutorial Tuesday: LinkWithin

No, I didn't forget the space in between the words -- that's the name of a pretty cool blog widget that you can use in Blogger. LinkWithin appears at the bottom of each of your blog posts and it links to similar blog posts you have written previously.

It's a great way to increase your blog traffic, isn't it?

Click here and see how you can add it to your own blog.

Did you find this tutorial helpful? Share my button!

Looking for a particular tutorial? Let me know!

Thursday, April 7, 2011

Tutorial Thursday: Customizing Your Comment Box

Did you know you can customize the text that appears above your comment box in Blogger?

Here's how:

Click on Design (at the top right corner).
Click on Settings in the navigation bar running across the top of your screen.
Then click on Comments and scroll about half way down until you see Comments Form Message. In that box, write out the text that you want to appear above the comment box.
Scroll down and click on Save Settings.

Did you find this tutorial helpful? Share my button!

Looking for a particular tutorial? Let me know!

Tuesday, April 5, 2011

Tutorial Tuesday: How to Schedule Posts

Want your posts to be published at a certain time or date in Blogger? Blogger lets you schedule in advance when you want your post(s) to be published on your blog (at a certain date and time) instead of having to go in and post it manually.

Here's how you can do that easily in Blogger:

After you have created a post, click on Post Options below (right above the Publish Post button in orange).
Under Post date and time on the right side, choose Scheduled at (it should currently be on Automatic).
Right below it, there should now be two boxes. In the top box, enter the date you want your post to be published on. In the second box, type in the time you want your blog post published.
Click Publish Post. Your post will now be published at the time and date you chose.

Did you find this tutorial helpful? Share my button!

Looking for a particular tutorial? Let me know!

Thursday, March 31, 2011

Tutorial Thursday: Paragraph Breaks

Lately a lot of people have been having trouble with separating their paragraphs in Blogger for some reason. While I have not encountered this problem, here is an easy way to separate your paragraphs when Blogger won't let you do so.

Where ever you want the paragraphs to separate, enter the following code:

Was that helpful?

Did you find this tutorial helpful? Share my button!

Looking for a particular tutorial? Let me know!

Tuesday, March 29, 2011

Tutorial Tuesday: Follow by Email

Did you know that Blogger now lets you add an "follow by email" gadget that allows your readers to easily subscribe to your blog posts?

Here's how you can add this feature to your blog in Blogger:

Click Design at the top right corner from the main screen of your blog.
Scroll down a little bit, and choose where you want this gadget to be placed (in your sidebar, footer, running across your screen under the header, etc.). In that location, click Add a Gadget.
A pop up screen should appear and you should be under the Basics tab. Find where it says "Follow by Email" (it should be the first one or near the top at least). You'll see a + button in a blue square right next to it -- Click that.
A pop up screen titled Configure Follow by Email will appear. If you want to change what this gadget will be titled on your blog, go ahead and change that. Don't change what's listed in the Feedburner URL.
Click Save.

Did you find this tutorial helpful? Share my button!

Looking for a particular tutorial? Let me know!

Thursday, March 24, 2011

Tutoral Thursday: Hiding Blogger's Navigation Bar

Don't like the Blogger navigation bar running across the the top of your screen?

Want to give your blog a more professional look? No problem! It's very simple to get rid of. I also have an earlier tutorial that helps you change the navigation bar's color or make it transparent.

Here's how you can remove the navigation bar from your blog in Blogger:

Go to your Design page (top right corner if you are currently at your blog's home page).
Click Edit HTML.
Find in your code where it says: /* Variable definitions (should be pretty close to the top)
Right before that code, copy and paste the following code:

#navbar-iframe { display: none !important;}

Don't forget to Save. I would recommend previewing how it's going to look first just to make sure you didn't make an error.

Did you find this tutorial helpful? Share my button!

Looking for a particular tutorial? Let me know!

Friday, March 18, 2011

Tutorial Thursday: How to Add Pages to Your Blog

Want to add a stand-alone page to your blog?

It's a great way to add a "contact me" or an "about me" page, for example, on your blog. As of now, I believe you can create ten stand-alone pages onto each one of your blogs.

Here's how you can add pages to your blog in Blogger:

From the main page of your blog's screen, click Design at the top right corner.
Click the Posting tab.
Then click Edit Pages.
From this screen you can add new pages by clicking New Pages (in the blue rectangle) and/or edit your existing pages once you have created them (by clicking Edit Pages).
Don't forget to click Save and Publish.

One of the features I really like about the stand-alone pages is that you can choose whether you want to turn on/off comments to these individual pages.

You can also choose to display them as a navigation either running across your screen or in your sidebar. If you want to do neither and link them your own way like I have you can choose no gadget.

FYI, yes, I know it's Friday. I just forgot to publish the post last night when I was typing it out.

Did you find this tutorial helpful? Share my button!

Looking for a particular tutorial? Let me know!

Wednesday, November 2, 2011

Thursday, October 6, 2011

Tuesday, September 20, 2011

Tuesday, August 16, 2011

Thursday, July 28, 2011

Tuesday, July 12, 2011

Tuesday, June 28, 2011

Thursday, June 9, 2011

Tuesday, May 24, 2011

Thursday, May 5, 2011

Tuesday, April 26, 2011

Tuesday, April 19, 2011

Thursday, April 14, 2011

Tuesday, April 12, 2011

Thursday, April 7, 2011

Tuesday, April 5, 2011

Thursday, March 31, 2011

Tuesday, March 29, 2011

Thursday, March 24, 2011

Friday, March 18, 2011

News

Subscribe

Advertise

Search

Follow us

Check out the fonts at: