Tutorials, tips and tricks about Blogger

Blogger, like almost every Bloggin platform, uses a visual editor (wysiwyg), and a HTML editor for posting. These editors are pretty usefull and simple to use, but often have some drawbacks and problems.

Then we show you a list of 10 recommendations that can help improve your experience when you type in Blogger:

  1. Use the HTML editor.


    If you know the basics of HTML, use this editor, wich creates less chaos in code, is more effective using spell checker, makes your articles less heavy and is easier to read by search engines and feed readers.

    blogger-html-editor

  2. Use the spell checker.

    If you have bad spelling, Blogger’s spell checker can avoid many errors (or horrors). If you write a long article, divide it in two or three parts, so you have no problem using the spell ckecker, or use an external software to check it.

  3. Don’t use the line break.

    By default, whe you hit "Enter" in the editor, it generates a
    label to make a line break, which can cause major problems when we introduce javascript, the code of a video or other application. To disable the line break, go to Settings > Formatting, and select "No" in the "Convert line breaks" box. Now the line breaks will be done with the <p> and </p> labels, wich are more appropriate and less trouble maker. 

    line-break

  4. Don’t align images on upload, but until they’re on the editor.

    This way you avoid "fighting" with the image-text alignment and you can change it any time from the editor.

  5. Don’t use large images if it’s not necessary.

    When uploading a picture on Blogger use "Image Size: Medium" to avoid warpping your template and keep a good image size and quality.

  6. Save drafts continuously.

    Even when Blogger automatically saves drafts, it’s better not to rely. The safest way is to be clicking the "Save Now" button every major breakthrough.

    save-draft

  7. Avoid changing edit mode repeatedly.

    Changing between "Compose" and "Edit HTML" repeatedly brings chaos in the code of the article, so try to work in a single mode.

    html-visual-editor

  8. Use preview.

    Before posting an entry, use the preview to read and detect errors in spelling or grammar, and finding the best location for the images. Read your article as many times as you need to find it coherent and understandable.

    preview-post

  9. Use a Post Template

    If you repeat any code in all your posts, for example, to use the hack for "read more" or to put a message at the end of them, use the Post Template. Go to Settings > Formatting and you’ll find it at the end. You’ll save valuable time in each entry.

  10. Use shortcuts.
    • Ctrl + B = bold
    • Ctrl + I = italic
    • Ctrl + L = blockquote (HTML mode only)
    • Ctrl + Z = undo
    • Ctrl + Y = re
    • Ctrl + Shift + A = link
    • Ctrl + Shift + P = Preview
    • Ctrl + D = save draft
    • Ctrl + S = publish entry

    Blogger has some commands to make faster to publish and format, these are:

These recommendations have saved me some problems on blogger but are just that, recommendations. If you have one, feel free to leave it in the comments.

Read this article in spanish.

In this article we’ll show you how to create a widget (code segment) so that your visitors only have to press a button to add a link to your blog on their own.

  1. Go to "Layout" tab.

    page-elements

  2. Add a "HTML/Javascript" element in the section you wanna have the button.
  3. Set the title as "Add us", or any text you want for the button. You can leave it blank too, it will add some default text.
  4. Paste the following code in the "Content" field:
    <form action="http://beta.blogger.com/add-widget" method="post" target="_blank">
    <input value="" name="widget.title" type="hidden" />
    <textarea style="display: none;" name="widget.content">
    <!-- Link's code -->
    <a href="http://YOURBLOG.blogspot.com">TU BLOG</a>
    
    </textarea>
    <input value="Add YOURBLOG to your Blogroll" name="go" type="submit">
    <input type="hidden" name="infoUrl" value="http://blog.btemplates.com/create-a-widget-to-add-a-link-to-your-blog/"/>
    </form>

    Here you have to make some changes:

    http://YOURBLOG.blogspot.com – Your blog’s address.

    YOUR BLOG – Your blog’s name or an image’s code. It willl be shown in the Blogroll of the one who’s adding you.

    Add YOURBLOG to the Blogroll – The message you wanna show on the button.

    This code work for another CMS or webs, but it only can be added by Blogger’s users.

  5. Save the changes an it’s done.

Lee este artículo en español.

By default, Blogger places a link at the end of the page, so users can susbcribe to Posts. If you don’t wanna show this link, here we teach you how to delete it. It’s pretty much like hidding the date on Blogger’s comments.

  1. Go to “Layout” tab, and then to “Edit HTML”.
  2. Search for the following code:
  3. ]]></b:skin>
  4. Just before, write the following:
  5. .feed-links {
    display: none;
    visibility: hiden;
    }
  6. Save the changes, and that’s it.

It’s good to keep the link, because it’s the only way users can suscribe our feed, but sometimes it’s better not to show it. By the way, if you wanna subscribe our feed, just click here.

Lee este artículo en español: Ocultar el link a suscribirse en las entradas (atom) en Blogger.

opera-blogger

There’s a very recurrent issue in Blogger, which happens while trying to upload a template, or while saving changes in a template with expanded gadgets, which leads to the Blogger’ Screen of Death. Another issue is that it makes the links to add new gadgets to disappear and even the editable areas to be not visible. As we mentioned another time, this issue is temporary and there are some alternatives to avoid it. One of those is using a different browser.

So far, the browser which we hadn’t had that issue is Opera, there I’ve been working in a blog even in that point, when Firefox, Chrome and Internet Explorer had the issue. So, ¿Is Opera the best browser to use Blogger? If you use add-ons or features exclusive to another browser then not so much, but I reckon it would be convenient to have it installed if an alternative to solve the problem is required. What’s your experience with Blogger and your browser? ¿Is there an ideal one?

Note: Needless to say, if you have Internet Explorer 6, any other browser is a better option, not only for Blogger.

One of the features of the new blogger is the state box included in every label that tell us the label we are in, and give us the option to see all the posts. But if we have a small blog, or we show all the post in every label, this box will become obsolete, so we will show you how to hide it.

  1. Enter on “Layout” tab, or “Design” from de Desktop, and the go to “Edit HTML”.
  2. Layout Blogger

  3. Search for the following code:
  4. ]]></b:skin>

    And just before we write this code:

    .status-msg-wrap {display:none;}

This should be enough to get the box hidden.

Tutorials, tips and tricks about Blogger