2014-01-13

How to post from Facebook to Twitter directly?

You can post to any social network through a medium. However, you can only post to one social network from another social network directly when they have a mutual agreement, such as that between Facebook and Twitter. How to post from Facebook to Twitter directly without use a medium? Here is the "how":

1. Use one browser to open two pages. One paged for you to log into Facebook and another to log into Twitter.

2. Then click https://www.facebook.com/twitter/ here to open third page. You will see all your Facebook pages appear. Simply click Link to Twitter will do.

In page https://www.facebook.com/twitter/, you can also manage your old posting authorizations.

2014-01-12

Find out your YouTube channel RSS feed URL

The YouTube's channel RSS feed URL is as follows:

http://gdata.youtube.com/feeds/api/users/eyeholesBLOG/uploads

Change "eyeholesBLOG" in above URL to your YouTube channel name.

If you want customized RSS, try following page:

https://gdata.youtube.com/demo/index.html

2014-01-11

How to remove Navbar in Blogger

In some old style Blogger templates, Blogger won't allow you to edit the Navbar. Here is the solution:

1. Go to Dashboard > Template > Edit HTML.

2. Move mouse to HTML code and click anywhere, then press Ctrl and F in your keyboard to search.

3. Copy "]]></b:skin>" (only contents in quote signs) to Search box, press Enter.

4. Just before line of "]]></b:skin>", place following words: "#navbar { height: 0px; visibility: hidden; display: none; }" (only contents in quote signs).

5. Save template and Back.

2014-01-08

Twitterfeed v Dlvr.it

Both are great services. Recently, we had a close look to see really how good they are.

Twitterfeed.com

PRO

- Free plan are available.
- Unlimited number of sources and destinations for free plan.
- Update is fast and updating frequency is much more than scheduled.

CON

- No control of what really passed to Facebook.
- When original link URL are same, it will be flagged as "no new feed", and won't be able to pass to both Twitter and Facebook.
- When prefix or suffix contains shortened URL, which would be regarded as same URL, it won't be able to pass to Facebook.

Dlvr.it

PRO
- Free plan are available.
- Able to choose as Shared Link, Status or Note with Facebook. 
- Able to attach fixed thumbnail image, or let Facebook to use Open Graph image.

CON
- Only allows 5 sources and 2 destinations for free plan.
- Update is much slow than scheduled.

Conclusion:

If you want a better control, use dlvr.it, especially for Facebook. If you have too many RSS sources, or want a fast update, use Twitterfeed. Overall, dlvr.it is much better.

Best 3rd party tools to manage Twitter followers

To manage Twitter's follow and unfollow functions, you may wish to use third party's tools. This is because Twitter themselves do not provide such tools. When we talking about the tools, we mean online tools. Here is the best free services to help you manage follower and unfollowers:

1. unfollowers.me

2. manageflitter.com

3. www.easyunfollow.com

4. whounfollowedme.org

They all do not need you to sign-in or provide email address.

2014-01-06

Design your own gadgets

Did you have seen some icons at top right corner of this page? They would lead you to various internal and external links, such as QR Code of this website, associated social networks, etc. Do you like your owns? Following is the codes. You can copy it to your own HTML/Javascript gadget.

1. Go to Dashborad > Layout. Click Add a Gadget.

2. Select HTML/Javascript.

3. Copy following codes to Content of HTML/Javascript window:

<div class="addthis_toolbox addthis_default_style addthis_32x32_style" align="left">
<a class="addthis_button_compact"></a><script type="text/javascript">var addthis_config = {"data_track_addressbar":true};</script><script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-52c0884a25c4f8db"></script>
<a href="https://twitter.com/SurfOnBlogger" target="_blank" title="twitter.com/SurfOnBlogger"><img border="0" height="31" width="31" style="padding:0px 1px 3px 1px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWfr4hP405Cj_EMaAnr1zHShPWoEgNmGTVf4PrYdfmeSqF9mBlJ3b9JfrKEg60lAX7O1OvXlswKH1H2NOooUdYcORLRsY2T4aM79qj4OIOPHGqz48T6TypJuDNID9OVcoY27xJUJPNsh0/s1600/Twitter-icon.png" /></a>
<a href="https://www.facebook.com/SurfOnBlogger" target="_blank" title="facebook.com/SurfOnBlogger"><img border="0" height="31" width="31" style="padding:0px 1px 3px 2px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlmDmDNykqt2FVKqHPJTzNcgPvBSKENF4jF2Fva9cBmCKBHfdla06S92kae_LgnqVKMea2tGa0Rl6L9VwwvvSLUEacVsBRnNeSSkT_2iEiG5OpZgCnCzTtNnkZZhjYLcb3CJjfKY2Q0iU/s1600/Facebook_icon.png" /></a>
<a href="https://google.com/+SurfOnBloggerBlogspotCom" target="_blank" title="google.com/+SurfOnBloggerBlogspotCom"><img border="0" height="31" width="31" style="padding:0px 1px 3px 2px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-QMcp_QecFOEFB2FDcqOOBB8znXuya9EElvaNSSFox7HFcv5D3oslb0lx8EalMjgWLDOPVFNygt6QSqJQ_sgOGjiIx93wLD8xq815q0Shjv1PDmZmgXzzzWAhUpRsL9tcX71Xdom7NgI/s1600/G+icon.png" /></a>
<a href="http://feedburner.google.com/fb/a/mailverify?uri=SurfOnBlogger&amp;loc=en_US" target="_blank" title="Email Subscription"><img border="0" height="31" width="31" style="padding:0px 1px 3px 2px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQPljpcks3MvYYHOdA0Vn7-yW58JxewqsrMYQhvZSLgMjbRyGn67XQ2AGfs07w3tnh5Uatp-XXheNVf_Am-pN3Y15tSOzVVirPRvTSAgOo44LPYW5iSq4DxibJjkXVOQe370g6_gUiHHk/s1600/Email-icon.png" /></a>
<a href="http://surfonblogger.blogspot.com/feeds/posts/default" target="_blank" title="RSS Feed"><img border="0" height="31" width="31" style="padding:0px 1px 3px 2px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3ppjSXVCNUUk8mNK71r5TO6ZXnXofp2-hAV4G0K5-ea3Y_BSXBk5jKJl7JWQRmdkCemaji7TApcTL0cnDE-y8Ai97Krb6sddts7vipsvP_4vnwNpxt96QfcGPI4e0ewvfEO54ZRt0reQ/s1600/RSS-icon.png" /></a>
<a href="http://surfonblogger.blogspot.com/p/qrcode.html" target="_self" title="QR Code"><img border="0" height="31" width="31" style="padding:0px 1px 3px 2px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtNQmqx86LKytvmIDsFELO4GUkSFeRir7_SuT145mkMqQUo7zohhBBNEmRGKR2AsGOqHFMFUt5Ao4qn9ViDfcKANeSl6hHL7DmxyPOt6CsdnjV7dZtgWhT6Tupym_2pp4tegn7xnxIXPs/s1600/QR_Code_Icon.png" /></a>
<a href="http://surfonblogger.blogspot.com/p/search.html" target="_self" title="Labels & search SurfOnBlogger"><img border="0" height="31" width="31" style="padding:0px 1px 3px 2px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8GiH70L657ioR5xuWkvDIyzRPt1pMtZq-TmI0TNnFbqEp9uOPynMmnchx18D_JLALRHWOMSLRhHC1fvTjZfjx7CYBaWPhRU0lrmt3y2DrrIS8_MwnqiUVTNHlNGkrGsORnXPWqy7Rwjft/s1600/search-icon_100.png" /></a>
</div>

Please remember, red colored parts need to be replaced by your own contents.

4. Save it.

2014-01-04

How to tell Facebook which image you want it to display?

We are here talking about the automatic RSS feed from Blogger to Facebook, through a medium. If you do manually post a link, you can always select which image to display.

Basically, when a Facebook recieve a feed, it would first check the "<img " tags. However, Facebook only accepts images over 200x200 pixels. If there is no avail, Facebook then would to go to webpage to search for the images, according to links provided in the feed. For video, Facebook does the same procedure.

So, if you want a image to be displayed in your Facebook timeline, place that image at the first position, followed by other images. Make sure the size of that image is large enough.

Next, place following HTML codes to you blogger, via:

1. Go to Dashboard > Template > Edit HTML.

2. Move mouse to HTML code and click anywhere, then press Ctrl and F in your keyboard to search "</head>".

3. Add following lines just before words "</head>":

<meta property="og:title" content="Surf On Blogger" />
<meta property="og:type" content="website" />
<meta property="og:url" content="http://surfonblogger.blogspot.com/" />
<meta property="og:image" content="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAWinnR65A2l2juYIp7zkEC2sKZk4s67YodsuvYCkKonpdjAVEPWfoyFEWQA8ZT-pXaqmpeAOqLj9xAK29orAl3ar4QOvZACJyCcftQex-Rpo6_6IetB2umdNYqnUJ1mdp76N6Tjyo8yg/s1600/SurfOn_logo_230.jpg" />
<meta property="og:description" content="Sharing experience of surfing on blogspot" />
<link rel="icon" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAWinnR65A2l2juYIp7zkEC2sKZk4s67YodsuvYCkKonpdjAVEPWfoyFEWQA8ZT-pXaqmpeAOqLj9xAK29orAl3ar4QOvZACJyCcftQex-Rpo6_6IetB2umdNYqnUJ1mdp76N6Tjyo8yg/s1600/SurfOn_logo_230.jpg"></link>
<link rel="image_src" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAWinnR65A2l2juYIp7zkEC2sKZk4s67YodsuvYCkKonpdjAVEPWfoyFEWQA8ZT-pXaqmpeAOqLj9xAK29orAl3ar4QOvZACJyCcftQex-Rpo6_6IetB2umdNYqnUJ1mdp76N6Tjyo8yg/s1600/SurfOn_logo_230.jpg" type="image/jpg"></link>

Please replace SurfOnBlogger's information with your blog's information.

4. Save template and Back.

Set these metadata into your blogger's HTML <head>. It would just tell Facebook when no valid image is available, goes to get this pre-set image. This image can be your blog header image or an invisible image. How to upload an invisible image? Click here for the answer. Very important: make sure this image is over 200x200px in size.

What about if you want an invisible image to be didplayed by Facebook for a particular post/page only? There is no way to set with Facebook.

Follow link provided by Facebook let you know if your setting is correct: https://developers.facebook.com/tools/debug/. If you see an error message: "Provided og:image is not big enough. Please use an image that's at least 200x200 px. Image '...' will be used instead." while your image indeed is larger than this, it means you are bad luck. This is a bug and Facebook seems having no plan to fix it. This bug is related to cache issue. Facebook uses akamaihd.net as third party cloud computing services, who hosts your images. While you may believe your image is directly extracted from original feed, actually you image has been resized to 144x144 and had been stored with akamaihd.net. Somehow, they can not process your request on time. That is why you see this bug. How long it would take for Facebook to update your new image? It may take days.

In addition, you should make sure all warnings are fixed.

If your RSS feed is through dlvr.it as medium, you have any even better control. See their page: http://support.dlvr.it/hc/en-us/articles/200401854-How-do-I-control-which-image-photo-is-posted-to-Facebook- .

How to upload an invisible image?

You want to upload an image to Blogger, but has no place to display it; what you want actually is just that image's URL. Is that right? Here is the solution:

1. Go to Dashborad > New post.

2. Upload the image.

3. Click HTML button to record the image's src.

4. Click Close that editing page.

5. Discard that draft.

Now you can use that image's URL anywhere.

2014-01-03

The best medium to feed your social networks from blogger

The idea is simple. You post new article on your blogger, the medium automatically post the notification on your social networks' timelines to attract traffic to your blogger. Which medium are the best for this purpose? Let us look at one by one.

First, let us remember the posts feed RSS from blogger is http://surfonblogger.blogspot.com/feeds/posts/default?alt=rss and the comments feed RSS URL is http://surfonblogger.blogspot.com/feeds/comments/default?alt=rss. You will need to change to your blog name.

Twitter

We will analyze three most popular media here, twitterfeed.com, dlvr.it and hootsuite.com. It is clearly the best option for Twitter is twitterfeed.com. dlvr.it does change some links if your post contains two links and one of them is of Youtube's or image's link. However, recently twitterfeed.com does not post if the link URLs are the same, the case where comments feed is. The solution? Use dlvr.it for blogger comments feed. While Twitterfeed has much fast frequency to update your feed, sometime you still need to use dlvr.it, simply because Twitterfeed has some design flaw.

Facebook

Unlike Twitter, Facebook can show image and video on the post. dlvr.it does it best to extract the image and video links and directly post them. So, generally, the best medium for Facebook is dlvr.it. However, if the feed does not come from your bloggers, but from their party, while dlvr.it extract the image or video link, it would erase the rest links. In this case, the best option is using Twitter's built-in function to post to Facebook from Twitter's timeline.

Google Plus

Currently, the only free service to post to G+ is Hootsuite. So, if you want to use free service, this is the only option. Hootsuite's free plan only allows 2 feeds. That is why you should not use it for Twitter and Facebook. Actually, you can set your blogger directly post to G+, but it excludes the comments and those posted through email. Hootsuite's free plan is still the only option.

2014-01-02

Best social networks to drive traffic

The big three are Twitter, Facebook and Google Plus. It is suggested you should have all of these three. Do you know what are the ranks among them?

Since the purpose for your blog is the traffic driven by social network, it does really depend on the followers of your social network. In this sense, Twitter is the best, because you can easily gain followers. Both G+ page and Facebook page are really hard to gain the Likes or Followers.

If you do not have enough resources to explore three of them, then concentrate on the Twitter.

2013-12-30

How to change Facebook Page's vanity URL or web address

Well, there are so many videos and posts around the Internet tell you how to change your Facebook fan Page's vanity URL or web address. But they all do not work for you, aren't they?

Here is the truth. First, you need to know the difference between username and web address, or called vanity URL. They are different and they do not not related. For instance, you can insert space between words in your username, but you cannot do this for your web URL. Indeed, you can have them completely unrelated. Change username is easy, just going to Edit Page will do.

However, change web address is bit hard. That is where so many people complained about. They said Facebook does not care about their business, they said Facebook disabled this function... The truth is, yes, you can change your web URL, simple go to https://www.facebook.com/username to do it.

The problems are:

1. If you failed, Facebook won't tell you why you failed, but just simple states: xxx is not available. That is where the rumours come from.

2. You can only change it once in life time. So, don't misspell it.

3. You should have more than 24 Likes. That is where people usually fails. You might have had Likes over 24 before, but you still need to make sure when you attempt to change the web URL, your Likes need to be at least 25.

Good luck. 

2013-12-28

How to quickly get friends in Facebook

Social network is still one of the bests way to gain traffic. Although Facebook is not as fast as Twitter to gain followers, it is till worthy to try your best to get as many Friends as possible in Facebook. However, if you add too many Friends without knowing they or without get approval from them, you might be banned from Facebook. While many people are openly willing to be your friend, you need to know where are they.

Here is the solution:

Page https://facebook.com/100Accept is designed to list people who will be "100% Accept Your Friend Request". Like it, post your link and add as your friends of these who publicly expressed willingness to be your friend.

How to secure a web address or vanity URL in Facebook

Facebook requires 25 Likes before the user can get the vanity URL, or web address, such as https://facebook.com/SurfOnBlogger. How to quickly get 25 likes from others? Here is the solution:

1. Invited all your Facebook friends to Like your page. Usually, you would get around 5% response for these who are not so Closed Friends.

2. Like page https://facebook.com/25likes, which is specially design to help user quick gain 25 Likes.



3. Post your page on  https://facebook.com/25likes.

4. Like 25 previous posted Pages, and post a note that you have Liked them to let mangers of these pages know. You should not post more than 25 your page links in one day. Else, you might get warning from Facebook that your way is violate their rules. Do the same next day to Like another 25 pages.

5. Wait, you will get what you need within 30 hours, usually.

6. If these do not work, like pages appeared on your Timeline, then leave a note and link to let people know you need them to like back. Of course, you would need as many Friends as possible.

2013-12-27

Place all labels on one post page

Well, so far there is no way to place label gadget in a post or a page, as I know. However, you can dedicate one page that and only that allows the label gadget to be shown. The Blogger's built-in label gadget will not be shown on rest posts or pages. Here is how to do it:

1. In Blogger > Layout, click Add a Gadget.

2. Find Labels gadget and place it at bottom of Blog Posts, and save it. It is suggested to disallow the comment for that page.

3. Go to Dashboard > Template > Edit HTML.

4. Move mouse to HTML code and click anywhere, then press Ctrl and F in your keyboard to search the label gadget. If you have not change its name, it should be called "Labels".

5. Find codes "<b:includable id='main'>".

6. Place codes just below it: "<b:if cond='data:blog.url == "URL of the page"'>" (Contents in blankets only). Please the URL of the page you want to labels to be shown.

7. In same section, find codes "</b:includable>".

8. Place codes just abovt it: "</b:if>" (Contents in blankets only). After that, it would be looked like:
<b:widget id='Label2' locked='false' title='Labels' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == "URL of the page"'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
...
<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>

9. Save template.

2013-12-25

Free Gadget Icons

Following icons are free to use. Copy these HTML codes to your blog. What you need to change are:

1. Place your target link URL into the blankets just after the "a href=".

2. These codes are to open a new window. If you wants to open window replace the current one, replace "_self" with "_blank" in HTML codes, which is located just after "target=".

<a href="" target="_blank"><img height="30" width="30" src=
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNobVb2Rztn7_CUTR0NAKixveqmxNO6ulUlRl2Ldr23Amb5AoAcUkKuTAXg_1T50LtLTC2zWjxhFKMN1P8AE31NiD5WsvV_bKjgSQ6j-xcGWXzQu9cqZ7EyQ96sX917X9ac7SAf0Jr_TM/s1600/Blogger-icon.png"
/></a>
<a href="" target="_blank"><img height="30" width="30" src=
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWfr4hP405Cj_EMaAnr1zHShPWoEgNmGTVf4PrYdfmeSqF9mBlJ3b9JfrKEg60lAX7O1OvXlswKH1H2NOooUdYcORLRsY2T4aM79qj4OIOPHGqz48T6TypJuDNID9OVcoY27xJUJPNsh0/s1600/Twitter-icon.png"
/></a>
<a href="" target="_blank"><img height="30" width="30" src=
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlmDmDNykqt2FVKqHPJTzNcgPvBSKENF4jF2Fva9cBmCKBHfdla06S92kae_LgnqVKMea2tGa0Rl6L9VwwvvSLUEacVsBRnNeSSkT_2iEiG5OpZgCnCzTtNnkZZhjYLcb3CJjfKY2Q0iU/s1600/Facebook_icon.png"
/></a>
<a href="" target="_blank"><img height="30" width="30" src=
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-QMcp_QecFOEFB2FDcqOOBB8znXuya9EElvaNSSFox7HFcv5D3oslb0lx8EalMjgWLDOPVFNygt6QSqJQ_sgOGjiIx93wLD8xq815q0Shjv1PDmZmgXzzzWAhUpRsL9tcX71Xdom7NgI/s1600/G+icon.png"
/></a>
<a href="" target="_blank"><img height="30" width="30" src=
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjd0Uo9BkwNbFM9yEvhdJQgL5iWqQc0Th4mSyvCgQSTClxbo4dBQCmeIwrXWkQIgv7OtCvJejjUd_XzZDLq74jW5m6dGDvn4EShbI5UYUecE61vi-rEBkpp5u3I6qN4mMx54cgZ_8ZDqIo/s1600/Paper.li-icon.png"
/></a>
<a href="" target="_blank"><img height="30" width="30" src=
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQPljpcks3MvYYHOdA0Vn7-yW58JxewqsrMYQhvZSLgMjbRyGn67XQ2AGfs07w3tnh5Uatp-XXheNVf_Am-pN3Y15tSOzVVirPRvTSAgOo44LPYW5iSq4DxibJjkXVOQe370g6_gUiHHk/s1600/Email-icon.png"
/></a>
<a href="" target="_blank"><img height="30" width="30" src=
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3ppjSXVCNUUk8mNK71r5TO6ZXnXofp2-hAV4G0K5-ea3Y_BSXBk5jKJl7JWQRmdkCemaji7TApcTL0cnDE-y8Ai97Krb6sddts7vipsvP_4vnwNpxt96QfcGPI4e0ewvfEO54ZRt0reQ/s1600/RSS-icon.png"
/></a>
<a href="" target="_blank"><img height="30" width="30" src=
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidty4t-dQOvDAAj3YuhbwaCUyxdReoxfv8P3A0UpFy6-iENjkJ60QqvoNbX0oeRS86JlPjhHqQer7B-l4lSmUO8g7ZTOoMEkVTnmGPIgY5Eb7zBlEUTBFILvwQ7hS2brgAUpG-zWtSjG4/s1600/qrcode_icon.png"
/></a>
<a href="" target="_blank"><img height="30" width="30" src=
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivGq7ZyGO4NgPt3F4OVzwIxT2KKjSD6yqfPrv6gIFrhyq5D3qeqeLbk4819iqGpDZ9eqCCL8hYGhuqjcp6XEpyzSldn0ocZAl5dWltX8-If7mG989YVcT1OM8nxFXMctB0ZxcYk2IKek4/s1600/search-icon.png"
/></a>

2013-12-22

Why every blog in Blogger needs a dedicated Gmail account

You can have up to 100 blogs with Blogger, according to Google. However, there are some reasons you need a dedicated Gmail account for every blog you have:

1. A dedicated Twitter account is needed to promote your blog. According to Twitter, every email account can only have one Twitter account.

2. If you set up an email subscription setting with feedburner of Google, it is better to have a dedicated email account, else all your email will be sent as from your very private Gmail account.

3. If you want to automatically post all your tweets to your Facebook page, there is a problem to use built-in function in Twitter, because twitter can only connect to one Facebook account. To cope this,  multiple Facebook accounts are needed. It also means multiple email accounts needed. Sorry Facebook, please blame this to Twitter.

It is clear Google won’t happy with this suggestion. However, it appears it is the best option for Blogger’s bloggers.

Use Blogger as a private messenger

Nowadays corporate usually won’t allow its employees to use the messenger in office. Twitter and Facebook are also forbidden to use. However, one can dedicate a blog in Blogger as private messenger. Simply setting everyone can comment will do. If you do concern your privacy, set your blog as not searchable.

Here is an example: http://OnlineScribbling.blogspot.com. Although this blog is for public to use, you do not need to tell the public your private messenger’s URL.

Why Blogger?

1.    Blogspot, if is not the best blog, is one of the best. Blogger provides very sophisticated supports with bunch of gadgets.

2.    Google’s AdSense is still the best monetization method for your Internet traffic. Blogger has the best integration with the AdSense.

3.    Blogger now provides full HTML / Javascript support.

4.    Unlike Twitter, Facebook, sites.google.com and many others, with Blogger, you can have subdomain name, like surfonblogger.blogspot.com.

How to reduce top space of each post in Blogger

1. Go to Dashboard > Template > Edit HTML.

2. Move mouse to HTML code and click anywhere, then press Ctrl and F in your keyboard to search "h3.post-title".

3. Add line just before words "h3.post-title":
h3.post-title { margin-top: -25px !important; }

4. Save template.

5. See final view to see if it is in good format. Due to different versions of Blogger designs, it may not work for your version. If not, remove it.

6. Back.

How to reduce Header Space in Blogger

1. There are 3 parts need to be changed. Due to various version of Blogger, some of these changes might not be working. So, it is better to check the final view after each of the changes. If it does not work, exclude it. 

2. Go to Dashboard > Template > Edit HTML.

3. Move mouse to HTML code and click anywhere, then press Ctrl and F in your keyboard to search "</head>".

4. Add following line just before </head>:
<style type='text/css'> .content-inner { margin-top: -40px !important; } </style>

5. Search ".Header h1".

6. Change from:
.Header h1 {
font: normal normal 30px Arial, Tahoma, Helvetica, FreeSans, sans-serif;
color: #152568;
text-shadow: -1px -1px 1px rgba(0, 0, 0, .2);
}
To:
.Header h1 {
font: normal normal 30px Arial, Tahoma, Helvetica, FreeSans, sans-serif;
color: #152568;
text-shadow: -1px -1px 1px rgba(0, 0, 0, .2);
margin-bottom: 0px;
}
There might be some varieties in different Blogger version, so be careful.

7. Search ".header-inner .Header .titlewrapper" or ".header-inner .titlewrapper".

8. Change from:
.header-inner .Header .titlewrapper {
padding: 22px 30px;
}
To:
.header-inner .Header .titlewrapper {
padding: 0 30px;
}

9. Save template and Back.
Top