Blogger Improves its Template HTML Editor

Whether you’re a web developer who builds blog templates for a living, or a web-savvy blog owner who prefers to make changes to your template using HTML, CSS or JavaScript, you may be interested in some enhancements that we made to Blogger’s Template HTML Editor.
Your blog’s HTML template is the source code that controls the appearance of your blog. This template can be customized to appear however you’d like. The improved HTML template editor now supports line numbering, syntax highlighting, auto-indentation and code folding to make editing your template much easier.
Suppose we wanted to move the date of a blog post underneath the post title, similar to the Blogger Buzz blog. To do this, follow these steps:

Click the “Template” tab on the Blogger dashboard, then the “Edit HTML” button, to see the new template HTML editor:

Locate the “Blog1” widget quickly using the new “Jump to widget” drop down:

This widget controls how your blog posts are displayed. The code inside the widget is folded by default. Clicking the new fold markers ‘►’ next to the line numbers expands the widget and reveals a set of “includable” tags:

Inside the “main” includable is the block of code that renders the post date:

Cut the post date code section and move it to where we want it, in this case, under the post title in the “post” includable:

To check our changes, click the new “Preview template” button to see the updates:

The post date is exactly where we want it, so tab back to “Edit template”, hit “Save template” and we’re done!
Finally, we’ve added a “Format template” button that automatically cleans up the indentation of the template, and made it possible to search for text by pressing “Ctrl+F” once you’ve clicked into the editor. To find and replace text occurrences one by one, use “Ctrl+Shift+F” or to find and replace all occurrences at once, use “Ctrl+Shift+R”.

Read More

Socialize your Blog with these 10 tips

When it comes to building an audience and driving traffic, bloggers are turning to social media with record results. Instead of relying on organic search or (gasp) IRL friends, successful bloggers know they have to develop a following on key social networks as a way to promote their brands and ultimately get more clicks.

Twitter, Facebook, StumbleUpon and now Pinterest provide the savvy blogger with plenty of opportunities to attract new readers and engage with regulars, but it can be overwhelming if you’re new to social media or if you only use it for fun. 

Here are 10 tips to help bloggers navigate the increasingly complex world of social media — while still making time to write content.

---

1. Display your social media icons prominently toward the top of your website.

---

Make it as simple as possible for your blog readers to connect with you on various social media platforms. They shouldn’t have to hunt around to find your Twitter handle, but should be able to click on a button and be taken right to your profile. Bonus points if your social media icons reflect the overall design or feel of your blog.

---

2. Every blog should have its own Facebook Page.

---

Even with Facebook’s new subscription feature, there’s still merit to giving your blog its own space on Facebook. It’s nice to be able to post a link every time you publish something new, and not have to worry about annoying your friends. Plus, readers who don’t your name but know the name of your blog can search for it on Facebook. Show your fans some love on your blog by using the Facebook social plugin, which makes it easy to convert readers to fans.

---

3. Generate traffic with StumbleUpon.

---

This “recommendation engine” serves as an alternate browser where users click through pages that their SU friends and SU itself have recommended. You can submit your own blog posts into the system, but it works best if you also share them with your SU friends and accept their shares back. Like most social platforms, you need to have a strong following to get good results. While people are still trying to figure out what makes SU content go viral, many bloggers have seen terrific, albeit fleeting, traffic spikes through the service.

---

4. Import your RSS feed onto your LinkedIn profile using its Blog Link application.

---

As long as your blog somewhat pertains to your professional goals, you should be showcasing it on LinkedIn. List it as one of your three websites in your profile, where it will be labeled “Blog.” However, by using the Blog Link application, your most recent posts will display right on your profile.

---

5. Pinterest is the hot new frontier for bloggers.

---

Pinterest is the cool new kid, and all of the bloggers are scrambling to establish a presence there. Pin your best photos onto themed boards with links to a relevant blog post. Blogs with strong visual content, like fashion, food, design, crafts and travel, are a natural fit. Infographics will also do quite well. Don’t forget to add a Pinterest plugin (like the Pinterest “Pin It” Button for WordPress users) to make it easy for your readers to share your content on their Pinterest boards.

---

6. Use link shorteners even when you don’t have to.

---

Twitter will now shorten your link for you, and the length of your link doesn’t matter on Facebook and Google+. But by using a link shortener like bit.ly, you will gain access to metrics, so you’ll know how many people clicked and at what time. With this essential data, you can experiment with different ways to tease your content and different times to post it.

---

7. Use your blog name as your username whenever possible.

---

Promote your personal brand by consistently using your blog’s name for your Twitter handle, StumbleUpon name, Pinterest name and so on. Then, people don’t have to wonder about your blog’s name — it’s right there. Also, people will remember you easily across platforms, which is key as you develop up your online community.

---

8. Join blogger groups on Facebook.

---

There are some very active groups on Facebook that are terrific resources for any blogging issues you encounter. Look for groups like “Travel Bloggers” or “Global Bloggers Network.” WordPress geeks have “Advanced WordPress” and Central Florida residents have “Central Florida Bloggers.” Not only are blogger groups good for problem-solving, but it’s well-known that bloggers like to read other blogs. Do some searching and find a bloggers group that’s suited to you, or start your own!

---

9. Be generous with other bloggers.

---

Promote other bloggers’ content, and hopefully they’ll return the favor. You can’t simply blast your own content anyway — you need some variety in every social media stream. So why not check out what your fellow bloggers are posting and give them a retweet, a share or a repin whenever you can. And don’t forget to reciprocate and share content from bloggers who share yours.

---

10. Be on social media — even when it’s not driving traffic.

---

It can be frustrating when you feel that you’re doing everything right (posting good content on the appropriate platforms in the best way possible) and you’re still not getting many clicks. But console yourself by thinking about all of the links that you see throughout the day that you don’t click on. Just spending time on social media platforms is great way to forge relationships, keep up on industry news and find inspiration for that next blog post.

Read More

Add Facebook Comments to Your Blogger's Blog

Facebook comment box is one of the useful tool for bloggers to increase conversations. So here in this post I will teach you how to add/integrate Facebook comment box to blogger in simple steps. Before getting into the process I recommend you to back up your template and previous comments in blogger wont be visible if you use Facebook commenting system.

Hide Existing Comments - The best way to start off is by hiding the comments made from the Blogger System. To do that, go to Settings > Posts and Comments and set the Show Comments option to Hide and Save the Settings

1. Create a Facebook Application
To use Facebook comments on your website, create a new comment application for your website on the Facebook Application page. This step is required, whether you add Facebook comments manually using a third-party plugin or with the official Facebook plugin.

Simply click on the “+ Create New App” button on the Facebook Application page, and enter a unique name for your application in the “App Display Name” field. The “App Namespace” field doesn’t have to be filled in for Facebook comments (it’s used with the Facebook Open Graph Protocol).

2. You will then be provided with an “App ID/API key” and an “App secret key.” Copy the App ID.

In the App Domain Field give blogspot.com (If you are using a custom domain give that) Give your Blog Address in the Site URL field under “Website” and Save The Changes. Copy the Application ID from the screen

3. Add Application and Moderator Meta Tags

Modify the below code with the application id copied in step 2.

<meta content='YOUR_FACEBOOK_APPLICATION_ID'   property='fb:app_id'/>


e.g. - <meta content='221595294600904'   property='fb:app_id'/>

Go to Template/Design > Edit HTML and paste the above code just below

<head><meta content='221595294600904'   property='fb:app_id'/>
You should create the Facebook Application and the above fb:app_id meta tag should be added to your Blog. Otherwise you won’t be able to manage/moderate your Comments from a single Place(you will have to go to posts one my one and moderate and that too is possible only if you have added the fb:admins open graph meta tag).

4. Add FB Comments - Now you have to add the Facebook Comment Form to your Blog Template. To do that Go to Template/Design > Edit HTML and click on the “Expand Widget Templates” check-box.

Find the following code in your template(Use the keyboard shortcut Ctrl + F), and immediately below that paste the following code:

<div class='post-footer-line post-footer-line-3'>

If you can’t find this, then find

<p class='post-footer-line post-footer-line-3'>
If you cant find that as well, then find

<data:post.body/>

Paste the following code just below the line that you just found out

<b:if cond='data:blog.pageType == "item">
<div id="fb-root"></div>
<script>(function(d){
 var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
 js = d.createElement('script'); js.id = id; js.async = true;
 js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
 d.getElementsByTagName('head')[0].appendChild(js);
}(document));</script>
<fb:comments width='450' colorscheme='light' expr:title='data:post.title'
 expr:href='data:post.url' expr:xid='data:post.id'/>
</b:if>


5.FB Namespace Declaration - Next you have to add the fb namespace to your template tag.Your template should have the specification for the fb tag that you have used. The following XML namespace declaration will take care of that. To declare the namespace, find

<html
and change it to
<html xmlns:fb="https://www.facebook.com/2008/fbml"

(there is a space after the 2008/fbml” )The following screenshot will help you out.

Save the Template. This namespace declaration is necessary for all FBML widgets using the fb tag. So if you have already added the namespace declaration while adding some other FB plugin, then you can skip this.

You are Done !!!!

Managing Your Comments
When you are logged in to your Facebook account, the Facebook comment plugin will detect that you are the admin(it will detect you if you have added the fb:app_id or fb:admins meta tags). You will be able to manage the Settings and moderate the comments from there.
 

Read More